@php $about = getContent(config('settings')->active_template, 'about.content', true); $aElement = getContent(config('settings')->active_template, 'about.element'); @endphp
@extends($activeTemplate.'layouts.users')

@push('style')
<style>
.back-title[data-v-58cb4ed7]{position:-webkit-sticky;position:sticky;top:0;display:flex;justify-content:center;align-items:center;height:50px;width:100%;background-color:#fff;color:#9c6431;font-size:20px;font-weight:600;z-index:100;}
.back-title .title-txt[data-v-58cb4ed7]{text-align:center;width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:40px;}
.back-title>span[data-v-58cb4ed7]:first-child{position:absolute;left:20px;width:10px;height:10px;border-bottom:2px solid #9c6431;border-right:2px solid #9c6431;-webkit-transform:rotate(135deg);transform:rotate(135deg);}
</style>
@endpush

@section('content')
    <uni-app class="uni-app--maxwidth" >
        <uni-page data-page="pages/about/about" >
            <uni-page-wrapper>
                <uni-page-body>
                    <uni-view data-v-614da8ff="">
                        <uni-view data-v-58cb4ed7="" data-v-614da8ff="" class="back-title">
							<span data-v-58cb4ed7="" data-href="{{ route('user.profile') }}" class="linkBTN"></span>
							<span data-v-58cb4ed7="" class="title-txt">About Us</span>
						</uni-view>
						
						<div style="width: 100%; margin: 0 auto; text-align: center;  position: relative; height: auto; overflow: hidden;">
							<img src="{{ getImage('assets/images/frontend/about/' .@$about->data_values->image, '900x456') }}" style=" width:100%;">
						</div>
						
                        <uni-view data-v-614da8ff="" class="about">
							<div style="width: 100%; margin: 0 auto; background:#eeeeed; height: auto; overflow: hidden; margin-top: 10px; margin-bottom:15px; ">
								<p style="padding:15px; color:#000; font-weight:700; padding-top:0px; font-size:18px; text-align:center;margin-top:10px">{{ __(@$about->data_values->heading) }}<br/>{{ __(@$about->data_values->sub_heading) }}</p>
								<div style="padding:15px; color:#000; padding-top:0px; font-size:16px; text-align:justify;" id="kfinfo">
									<p><br></p>
									{!! @$about->data_values->content !!}
									<p><br></p>
								</div>
							</div>

							@foreach($aElement as $info)
							<div style="width: 100%; margin: 0 auto; background: #eeeeed; height: auto; overflow: hidden; margin-top: 10px; margin-bottom:15px; ">
								<div style="padding:15px; color:#000; font-size:16px; text-align:justify; " id="kfinfo">
									<h3 class="font-body uppercase text-gray-600 mb-2 w-full">{!! @$info->data_values->title !!}</h3>
									<p class="font-body text-gray-500 whitespace-pre-wrap">{!! @$info->data_values->text !!}</p>
								</div>
							</div>
							@endforeach

						</uni-view>
					</uni-view>
					
					<uni-tabbar class="" style="box-shadow:none;">
						<div class="uni-tabbar" style="backdrop-filter: none;box-shadow:none">
							<div class="uni-tabbar-border" style=""></div>

							@if( config('settings')->whatsapp_url )
								<div class="uni-tabbar__item socialHandle" data-href="{{ config('settings')->whatsapp_url }}" >
									<div class="uni-tabbar__bd" style="height: 45px;">
										<div class="uni-tabbar__icon" style="width: 24px; height: 24px;">
											<img src="{{ asset($activeTemplateTrue.'img/WhatsAppGroup.png') }}">
										</div>
										<div class="uni-tabbar__label" style="color: rgb(233, 164, 98); font-size: 12px; line-height: normal; margin-top: 3px;">Whatsapp</div>
									</div>
								</div>
							@endif

							@if( config('settings')->telegram_url )
								<div class="uni-tabbar__item socialHandle" data-href="{{ config('settings')->telegram_url }}">
									<div class="uni-tabbar__bd" style="height: 45px;">
										<div class="uni-tabbar__icon" style="width: 24px; height: 24px;">
											<img src="{{ asset($activeTemplateTrue.'img/TelegramChannel.png') }}">
										</div>
										<div class="uni-tabbar__label" style="color: rgb(233, 164, 98); font-size: 12px; line-height: normal; margin-top: 3px;">Telegram</div>
									</div>
								</div>
							@endif
						</div>
						<div style="width: 100%; margin: 0 auto; background: transparent; height: 45px; margin-top: 10px; line-height: 55px;  height:55px;"></div>
					</uni-tabbar>

				</uni-page-body>
			</uni-page-wrapper>
		</uni-page>
	</uni-app>
@endsection

@push('script')
@endpush
