@extends('web.layouts.master')

@section('content')
    @if (in_array($slug, ArticleCategoryEnum::getSingleContentArticleArray()))
        <section class="height-auto text-center background-light-orange">
            <div class="container pos-vertical-center">
                <div class="row">
                    <div class="col-12 col-md-12">
                        <div class="text-left">
                            <h2 class="font-size-26 text-dark-grey Font-Manrope-ExtraBold custom-section-title">{{ $title }}</h2>
                        </div>

                        <div class="html-decryption-container">
                            {!! $article->description !!}
                        </div>
                    </div>
                </div>
                <!--end of row-->
            </div>
            <!--end of container-->
        </section>
    @else
        @if(count($paginator) > 0)
            <section class="height-auto space--sm background-light-orange">
                <div class="container">
                    <div class="row">
                        <div class="col-12 col-md-12">
                            <h2 class="font-size-26 text-dark-grey Font-Manrope-ExtraBold custom-section-title">{{ $title }}</h2>

                            <div class="masonry">
                                <div class="masonry__container row">
                                    <div class="masonry__item col-12 col-lg-4 col-md-6"></div>
                                    @foreach ($paginator->items() as $item)
                                        <div class="masonry__item col-12 col-lg-4 col-md-6">
                                            <article class="feature feature-1">
                                                <a href="{{ route('web.article.show', ["slug" => $slug, "articleSlug" => $item->code]) }}" class="block text-center background-white border--round">
                                                    <img alt="Image" src="{{ $item->attachments()->first()->image_url }}"/>
                                                </a>
                                                <div class="feature__body boxed boxed--border">
                                                    <span class="text-dark-grey Font-Manrope-Regular">{{ $item->created_at->format("M d, Y") }}</span>
                                                    <a href="{{ route('web.article.show', ["slug" => $slug, "articleSlug" => $item->code]) }}">
                                                        <h5 class="text-dark-grey Font-Manrope-ExtraBold">{{ $item->name }}</h5>
                                                    </a>
                                                    <h5 class="text-dark-grey Font-Manrope-Regular">{{ $item->summary }}</h5>
                                                    <a class="" href="{{ route('web.article.show', ["slug" => $slug, "articleSlug" => $item->code]) }}">
                                                        <span class="btn__text text-red font-size-14 Font-Manrope-ExtraBold">
                                                            Read More
                                                        </span>
                                                    </a>
                                                </div>
                                            </article>
                                        </div>
                                    @endforeach
                                </div>
                                <!--end of masonry container-->
                                @include("web.components.pagination", collect($paginator)->toArray())
                            </div>
                            <!--end masonry-->
                        </div>
                    </div>
                    <!--end of row-->
                </div>
                <!--end of container-->
            </section>
        @endif
    @endif
@endsection