@extends('masterpage')
@section('title',  $sayfaDetay->title )
@section('keywords', $sayfaDetay->keywords)
@section('description', $sayfaDetay->description)
<!-- MODUL SAYFASI SAYFA İSE -->


@section('bread')
    @include("breadcrump")
@endsection
@section('page_top')
    @include("page_menu_bottom")
@endsection
@push('head')
    <script type="text/javascript" src="{{ url('js/formbuilder/form-render.min.js') }}"></script>
@endpush
@section('content')
<div class="about-page-area area-padding">
    <div class="container">
        <div class="row">
            <!-- ÜST SAYFA MENÜ -->
			
				@include("yanmenu")	
			
			<!-- ÜST SAYFA MENÜ BİTTİ -->
		    
			 <!--  eğer sayfa detayı varsa göster -->
        @if(!empty($id))
			
			<div class="col-md-9 col-sm-4 col-xs-12">
                <div style="padding-left:0px; padding-right:0px;" class="col-md-12"><h3 style="margin-top:0px">{{  $sayfaDetay->title }}</h3></div>	
		
        
		{!! $sayfaDetay->content !!}
   
		</div>
        @endif 
        
   

			
			
			
			<!-- ALT SAYFALAR -->
			<div style="padding-left:0px; padding-right:0px;float:right"class="col-md-9">
			
				@foreach($menulerAlt->whereIn('page_parent_id',[$sayfaDetay->page_parent_id,$sayfaDetay->id]) as $menu_alt)
					@if (@$sayfaDetay->id == @$menu_alt->page_parent_id )	
						<div class="col-md-6 col-sm-4">
					
							<div class="single-member">
								<a href="{{ app('url')->current().'/'.SeoUrl($menu_alt->title) }}">
								<div class="team-img">
									
										<img style="
    width:  100%;
    object-fit:  cover;
" src="{{ dosyaUrl() }}{{ $menu_alt->picture }}" alt="">
									</a>
									
								</div>
									
								<div class="team-content">
									<div class="team-title">
										<a href="{{ app('url')->current().'/'.SeoUrl($menu_alt->title) }}"> <h4>{{$menu_alt->title}}</h4>
										</a>   
										<p style="color:#fff"> {{$menu_alt->short_content}}</p>
										 <a href="{{ app('url')->current().'/'.SeoUrl($menu_alt->title) }}" class="ready-btn left-btn" >Detaya Git </a>
									</div>       
								</div>
							</div>
						</div>
						
					
					@endif
				
				@endforeach
				<div style="padding-left:0px; padding-right:0px;margin-top:20px" class="col-md-12">
				<div style="padding-right: 0px;"class="col-md-12">
															@if($sayfaGalerisi)
																@foreach($sayfaGalerisi as $galeri)
																	<div style="padding-left:0px;"class="gdk col-md-3">
																		<a id="firstlink" class="venobox vbox-item" data-gall="myGallery" data-title="{{$galeri->pic_descriptions}}" href="{{ dosyaUrl() }}{{ $galeri->path }}">
																		<img style="width: 100%;
    height: 145px;
    object-fit: cover;
    padding-bottom: 18px;"src="{{ dosyaUrl() }}{{ $galeri->path }}" alt="">
	<div style="width: 100%; text-align: center; padding-bottom: 5px;    height:55px;">{{  $galeri->pic_descriptions }}</div>
																		</a>
																	</div>
																@endforeach
																@endif
															</div>	</div>
															
															
															
														<div style="padding-left:0px; padding-right:0px;margin-top:20px" class="col-md-12">
				<div class="col-md-12">
							
							 @if(!empty($sayfa_tablari))
                    @if(count($sayfa_tablari)>0)
								<style>
									.w3-container, .w3-panel {
										padding: 0.01em 16px;
										border: 1px solid #8c8989;
									}
									.w3-bar .w3-bar-item {
										padding: 12px 16px!important;
										float: left;
										width: auto;
										border: none;
										display: block;
										outline: 0;
									}										
								</style>
								<link rel="stylesheet" href="http://serkanural.com/css/w3.css">
									<div class="col-md-12 " style="padding-left:0px; padding-right:0px;margin-bottom: 20px;">
										<div class="w3-bar w3-black" style=" height: 44px; padding: 0px;     background-color: #06396a!important; ">
											@foreach($sayfa_tablari as $index=>$tab)
												<button class="w3-bar-item w3-button   " id="tab_btn{{$index}}" onclick="openTab('{{$tab->tab_title}}','{{$index}}')">{{$tab->tab_title}}
												</button>
											@endforeach
							
										</div>

										@foreach($sayfa_tablari as $index=>$tab)
											<div id="{{$tab->tab_title}}" class="w3-container tab " @if($index!=0)  style="display:none"   @endif>
												<p>{!!$tab->tab_descriptions!!}</p>
												@if(!empty($tab->tab_galeri))
													<div style="padding-left:0px; padding-right:0px"class="col-md-12">
															
																@foreach($tab->tab_galeri as $galeri)
																	<div class="gdk col-md-3">
																		<a class="venobox" data-gall="myGallery" data-title="{{  $galeri->pic_descriptions }}" href="{{ dosyaUrl() }}{{ $galeri->path }}">
																		<img style="width: 100%;
    height: 145px;
    object-fit: cover;
    padding-bottom: 18px;"src="{{ dosyaUrl() }}{{ $galeri->path }}" alt="">
	<div style="width: 100%; text-align: center; padding-bottom: 5px;height: 55px;">{{  $galeri->pic_descriptions }}</div>
																		</a>
																	</div>
																@endforeach
															</div>	
														
												@endif
											</div>
										@endforeach   
										<script>
											function openTab(tabName,index) {
												
												var i;
												var x = document.getElementsByClassName("tab");
												var x_ = document.getElementsByClassName("w3-button");
												for (i = 0; i < x.length; i++) {
													x[i].style.display = "none"; 
													x_[i].style.backgroundColor = "#06396a"; 										
												}
												document.getElementById(tabName).style.display = "block";  
												document.getElementById("tab_btn"+index).style.backgroundColor = "#f5af25"; 
											}
											
											var x_ = document.getElementsByClassName("w3-button");
											x_[0].style.backgroundColor = "#f5af25"; 
										</script>
									</div>	
								@endif
							
							@endif
						
															</div>	
															
															
															</div>									
																</div>	
																<!-- ALT SAYFALAR BİTTİ -->
														

        

        


       
    
<div style="margin-top:10px"class="col-md-12">
															@include("modules.yorumlar.yorumlar")
															</div>
  </div>  </div>  </div>
@endsection