@extends('frontLayout.frontlayout')
@section('content')

<!-- ==== Breadcame Section Start ==== -->
@if($catSlug)
<section class="breadcame_section" style="background-image: url('../assets/frontend/images/about-banner.jpg');">
@else
<section class="breadcame_section" style="background-image: url('assets/frontend/images/about-banner.jpg');">
@endif
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="breadcame_area text-center">
                <h3>Blogs</h3>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- ==== Breadcame Section End ==== -->

<!-- ==== Blog Section Start ==== -->
<section class="blog-wrap frome-blog">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="blog-inner listing-block">
                    <div class="search_tags">
                        <div class="next_prev prev_btn" id="left-button"><i class="fal fa-angle-left"></i></div>
                            <div class="filter_options_row">
                                <ul class="list-inline filter-options">
                                    <li class="btn btn-primary {{ $catSlug == null ? 'active' : ""}}"><a href="{{route('blogs.index')}}">All</a></li>
                                    @foreach($blogCategories as $b)
                                    <li class="btn btn-primary {{ $catSlug == $b['slug'] ? 'active' : ""}}"><a href="{{route('blogs.withSlug',['catSlug' => $b['slug']])}}">{{$b['title']}}</a></li>
                                    @endforeach
                                </ul>
                            </div>
                        <div class="next_prev next_btn" id="right-button"><i class="fal fa-angle-right"></i></div>
                    </div>
                    <div class="blog_wrap blog_columns listing-table">
                        <div class="row appenHtml">
                            @include('frontend.blogs.listingLoop')                            
                        </div>
                        @include('admin.partials.pagination', ["pagination" => $blogs])
                    </div>         
                </div>
            </div>
        </div>
    </div>
</section>
<!-- ==== Blog Section end ==== -->

@endsection