@extends('theme.spade.layouts.main')

@section('title') Blogs @endsection

@section('meta')
<meta name="title" content="{{ $seoSetting['meta_title'] }}" />
    <meta name="description" content="{{ $seoSetting['meta_detail'] }}">
    <meta name="keywords" content="{{ $seoSetting['meta_keywords'] }}" />
@endsection

@section('canonical')
<link ref="canonical" href="{{ route('blogs') }}" />
@endsection

@section('content')

    @php
        use Illuminate\Support\Str;
        
          $breadcrumbData = [
               [
                    'title' => 'Blogs',
                    'link' => route('blogs')
               ]
          ]
    @endphp
    @include('theme.spade.layouts.includes.breadcrumb', $breadcrumbData)

    <div class="wrapper">
         @if(count($blogs) > 0)
               <div class="row">
                    @foreach ($blogs as $blog)
                         <div class="col-md-4 gaper">
                              <div class="card">
                                   <div class="card-img">
                                        <a href="{{ route('single_blog', $blog->slug) }}">
                                             <img src="{{ $blog->full_image }}" height="250" class="img-fit">
                                             <span style="color:black">{{ date('F d, Y', strtotime($blog->published_date)) }}</span>
                                        </a>
                                   </div>
                                   <div class="card-body">
                                        <a href="{{ route('single_blog', $blog->slug) }}">
                                             <h2>{{ Str::limit($blog->title, 35, '..') }}</h2>
                                        </a>
                                   </div>
                              </div>
                         </div>
                    @endforeach
               </div>
               <div class="row">
                    <div class="col-md-12 text-center">
                         {{ $blogs->links('theme.spade.layouts.includes.pagination') }}
                    </div>
               </div>
          @endif
     </div>

@endsection