@extends(get_view('index'))
@section('title') {{ __('Projeler') }} - @endsection
@section('menu-active-about-us') active @endsection
@section('header')

@endsection
@section('content')

@include(get_view('components.pages.page-title'), ['title' => __('Projeler')])



<div class="container pb-5 pb-sm-0 my-5">
	<div class="row">
		<div class="col">

			@if ( $projects->count() > 0 )
				<ul class="nav nav-pills sort-source sort-source-style-3 justify-content-center justify-content-md-start text-3-5 pb-2 mb-4 appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="1000" data-sort-id="portfolio" data-option-key="filter" data-plugin-options="{'layoutMode': 'masonry', 'filter': '*'}">
					<li class="nav-item active" data-option-value="*"><a class="nav-link font-weight-semibold text-color-dark text-color-hover-primary px-0 active" href="#">{{ __('Hepsi') }}</a></li>
					@foreach (get_project_categories() as $item)
					<li class="nav-item ms-4" data-option-value=".{{ $item->content->url ?? $item->id ?? '' }}"><a class="nav-link font-weight-semibold text-color-dark text-color-hover-primary px-0" href="#">{{ $item->content->title ?? '#' }}</a></li>
					@endforeach
				</ul>

				<div class="sort-destination-loader sort-destination-loader-showing" data-remove-min-height style="min-height: 792px;">
					<div class="row sort-destination g-4 px-0" data-sort-id="portfolio">

						@forelse ($projects as $item)
							<!-- item start -->
							<div class="col-sm-6 col-md-4 isotope-item {{ $item->category->content->url ?? $item->category->id ?? '' }}">
								<div class="portfolio-item appear-animation" data-appear-animation="fadeInUpShorterPlus" data-appear-animation-delay="500">
									<div class="thumb-info thumb-info-no-borders thumb-info-no-borders-rounded thumb-info-centered-icons mb-3-5">
										<div class="thumb-info-wrapper">
											<img src="{{ Common::get_project_image($item->id, $item->image) }}" class="img-fluid" alt="{{ $item->content->title ?? '' }}">
											<div class="thumb-info-action">
												<a href="{{ route('projects.detail', ['slug' => ($item->content->url ?? '')]) }}">
													<div class="thumb-info-action-icon thumb-info-action-icon-light"><i class="fas fa-plus text-dark"></i></div>
												</a>
											</div>
										</div>
									</div>
									<h2 class="font-weight-bold text-5-5 line-height-3">
										<span class="d-block text-color-grey positive-ls-3 font-weight-medium text-2">{{ $item->category->content->title ?? '' }}</span>
										<a href="{{ route('projects.detail', ['slug' => ($item->content->url ?? '')]) }}" class="text-color-dark text-color-hover-primary text-decoration-none">{{ $item->content->title ?? '#' }}</a>
									</h2>
								</div>
							</div>
							<!-- item end -->
						@empty
							@include(get_view('components.errors.post-not-found'))
						@endforelse
						
					</div>
				</div>
			@else
				@include(get_view('components.errors.post-not-found'))
			@endif

		</div>
	</div>
</div>

<div class="position-relative pb-5 d-sm-none d-xl-block">
	<div class="position-absolute transform3dy-n50 left-0">
		<div class="appear-animation" data-appear-animation="fadeInRightShorterPlus" data-appear-animation-delay="1500" data-appear-animation-duration="1500ms">
			<div class="custom-square-1 bg-primary mt-0 mb-5"></div>
		</div>
	</div>
</div>

@endsection
@section('footer')

@endsection