@extends('layouts.master')
@section('meta')
    @include('layouts.partials.seo', [
        'title' => nova_get_setting_translate('blog_index_meta_title') ?? env('APP_NAME'),
        'description' => nova_get_setting_translate('blog_index_meta_description') ?? env('APP_NAME'),
        'keywords' => nova_get_setting_translate('blog_index_meta_keywords') ?? env('APP_NAME'),
        'schema' => nova_get_setting('blog_index_meta_other'),
        'image' => Storage::url(nova_get_setting('blog_banner')),
    ])
@endsection
@section('content')
    <section class="rlr-section">
        <div class="rlr-cta rlr-cta--no-button"
            style="background-image: url('{{ Storage::url(nova_get_setting('blog_banner')) }}'); background-size:150%;"
            title="{{ nova_get_setting('blog_banner_title') }}" role="img"
            aria-label="{{ nova_get_setting_translate('blog_banner_alt') }}">
            <h1>{{ nova_get_setting_translate('blog_index_title') }}</h2>
            <p> {!! nova_get_setting_translate('blog_index_description') !!} </p>
        </div>
    </section>

    <div class="rlr-search-results-page__breadcrumb-section">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-12">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb rlr-breadcrumb__items">
                            <li class="breadcrumb-item rlr-breadcrumb__item"><a
                                    href="{{ route('home') }}">{{ __('homePage.home') }}</a></li>
                            <li class="breadcrumb-item rlr-breadcrumb__item active" aria-current="page">
                                {{ nova_get_setting_translate('blog_index_title') }}</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div>

    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div id="profile-description">
                    <div class="text show-more-height">
                        <div class="page-heading">
                            <h2>{{ nova_get_setting_translate('blog_index_subHeader') }}</h2>
                            {!! nova_get_setting_translate('blog_index_subDescription') !!}
                        </div><!-- end page-heading -->
                    </div>
                    <div class="show-more">({{ __('homePage.show_more') }})</div>
                </div>
            </div>
        </div>
    </div>

    <div class="container">
        <div class="row rlr-search-results-page__product-details rlr-section__py">
            <aside class="col-xl-3 rlr-search-results-page__sidebar">
                <aside class="rlr-sidebar">
                    <div class="rlr-sidebar__widget">
                        <h4>{{ __('article.categories') }}</h4>
                        <ul class="wp-block-categories">
                            @foreach ($articleCats as $cat)
                                <li><a href="{{ route('categoryBlogs', ['catSlug' => $cat->slug]) }}"> <i
                                            class="fa fa-arrow-circle-left"></i> {{ $cat->name }} </a></li>
                            @endforeach
                        </ul>
                    </div>
                    <div class="rlr-sidebar__widget rlr-sidebar--posts">
                        <h4>{{ __('article.recent_posts') }}</h4>
                        <ul>
                            @foreach ($recentPosts as $item)
                                <li>
                                    <a
                                        href="{{ route('blogs.show', ['catSlug' => $item->category->slug, 'slug' => $item->slug]) }}">
                                        <img src="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'] }}"
                                            title="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['title'] }}"
                                            alt="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['alt'] }}">
                                        <div class="rlr-sidebar--posts__column">
                                            <span>{{ $item->title }}</span>
                                            <time
                                                datetime="{{ $item->created_at->format('Y-M-D') }}">{{ $item->created_at->format('Y-M-D') }}</time>
                                        </div>
                                    </a>
                                </li>
                            @endforeach
                        </ul>
                    </div>
                </aside>
            </aside>
            <section class="col-xl-9 rlr-search-results-page__product-list">
                <div class="row">
                    @foreach ($blogs as $item)
                        <div class="col-md-4 col-lg-4 col-12">
                            <article class="rlr-postcard">
                                <div class="rlr-postcard__thumbnail">
                                    <a
                                        href="{{ route('blogs.show', ['catSlug' => $item->category->slug, 'slug' => $item->slug]) }}">
                                        <img src="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['url'] }}"
                                            title="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['title'] }}"
                                            alt="{{ $item->getFirstMediaUrlOrDefault(\App\Helpers\Constants\MediaHelper::ARTICLE_MEDIA_PATH)['alt'] }}">
                                    </a>
                                </div>
                                <div class="rlr-postcard__summary pb-0">
                                    <span class="rlr-postcard__author"> <i class="fa fa-user"></i>
                                        {{ __('homePage.admin') }} | {{ $item->created_at->format('Y-M-D') }}</span>
                                    <a class="rlr-product-card__anchor-title"
                                        href="{{ route('blogs.show', ['catSlug' => $item->category->slug, 'slug' => $item->slug]) }}">
                                        <h2 class="rlr-product-card__title mt-1">{{ $item->title }}</h2>
                                    </a>
                                </div>
                            </article>
                        </div>
                    @endforeach

                </div>
                <div class="links">
                    @include('blogs.pagination',['paginator'=>$blogs])
                    {{-- {{ $blogs->links() }} --}}


                </div>


            </section>

        </div>
    </div>



    @include('layouts.partials.why_choose')
    @include('layouts.partials.customer_gallery')
    @include('layouts.partials.clients_say')
    @include('layouts.partials.faq')
    @include('layouts.partials.partners')
@endsection