@extends('layouts.blog')

@section('title')
{{ "Technoblog | " . $category->name }}
@endsection

@section('blog_content')

	<div class="mainContent">

		<div class="container-fluid">

			<div class="row">

				<style>
					.default_sectionTitle_{{ strtolower($category->name) }}:before,
					.default_sectionTitle_{{ strtolower($category->name) }} span,
					.default_sectionTitle_{{ strtolower($category->name) }} a {
						background: {{ $category->color }};
						color: {{ $category->color }} !important;
					}
				</style>

				<div class="col-md-12">
					<header class="default_sectionTitle default_sectionTitle_{{ strtolower($category->name) }}"><span>TechnoBlog / {{ $category->name }}</span></header>
				</div>

				@for ($i = 0; $i < count($posts); $i++)

					@if (count($posts) > 2)
						@if ($i < 2) @php $strLimit = 200; $class = "col-md-6"; @endphp
						@else @php $strLimit = 90; $class = "col-md-4"; @endphp @endif
					@else @php $strLimit = 90; $class = "col-md-4"; @endphp @endif

					<div class="{{ $class }} mb-4 post-item">
						<div class="card">
							<div class="card-img-top-wrapper">
								<img class="card-img-top" src="/uploads/{{ $posts[$i]->image_link }}" alt="Card image cap">
							</div>
							<div class="card-body">
								<h5 class="card-title">
									<a href="/category/{{ strtolower($posts[$i]->category->name) }}/{{ $posts[$i]->slug }}">{{ $posts[$i]->title }}</a>
								</h5>
								<p class="card-text">{!! str_limit($posts[$i]->content, $strLimit) !!}</p>
							</div>
							<div class="card-footer">
								<small class="text-muted">{{ $posts[$i]->ago() }}</small>
							</div>
						</div>
					</div>
				@endfor

				<div class="col-md-12 mt-4 mb-5">
					{{ $posts->links() }}
				</div>

			</div>

		</div>

	</div>

@endsection