@extends('layouts.public')

@section('title') {{trans('seo.title.category', ['title' => $category->title])}} @endsection
@section('description') {{trans('seo.description.category')}} @endsection
@section('image', asset('images/share/posts.jpg'))

@section('content')
<div class="rs-breadcrumbs">
	<div class="breadcrumbs-image">
		<img src="/images/breadcrumbs/blog.jpg" alt="Zona Plus agencija za digitalni marketing - Zadar">
		<div class="breadcrumbs-inner">
			<div class="container">
				<div class="breadcrumbs-text">
					<h1 class="breadcrumbs-title">{{$category->title}}</h1>
					<ul class="breadcrumbs-subtitle">
						<li><a href="{{route('public.index')}}"><i class="fa fa-home"></i> {!!trans('navigation.index')!!}</a></li>
						<li><a href="{{route('public.posts')}}">{!!trans('navigation.posts')!!}</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>                
</div>

<div id="rs-blog" class="rs-blog pt-100 pb-100">
	<div class="container">
		@foreach($posts->chunk(3) as $chunk)
		<div class="row">
			@foreach($chunk as $post)
			<div class="col-lg-4 mb-50">
				<div class="single-blog inner-page-blog">
					<div class="blog-img">
						<a href="{{route('public.post', [$post->category, $post])}}"><img src="{{asset($post->thumbnail)}}" alt="{{$post->title}}"></a>
						<div class="blog-date">{{$post->date}}</div>
					</div>
					<div class="blog-item-text">
						<div class="blog-details">
							<h3 class="blog-title"><a href="{{route('public.post', [$post->category, $post])}}">{{$post->title}}</a></h3>
							<div class="blog-author">
								<span class="category"><a href="{{route('public.category', $post->category)}}">{{$post->category->title}}</a></span>
							</div>
							<p class="blog-desc">{{mb_substr($post->summary, 0, 200)}}...</p>
							<a class="readmore-btn" href="{{route('public.post', [$post->category, $post])}}">{{trans('global.read-more')}}</a>
						</div>
					</div>
				</div>
			</div>
			@endforeach
		</div>
		@endforeach
		<div class="page-nav text-center mt-50">
			@include('include.pagination', ['paginator' => $posts])
		</div>
	</div>
</div>
@endsection