@extends('web.layouts.main')
@section('content')       
<section class="pg_header section">
    <div class="container">
        <h5 class="title_w_vector mx-auto w-fit mt-2">{{$title}}</h5>

    </div>
</section>

<!-- Start section -->
<section class="blog_pg section ">
    <div class="container">
        <div class="sec_head d-flex justify-content-center mb-5 pb-3 mt-4">
            <h5 class="title_w_vector color-primary me-4 mt-2">   {{__('news.blog')}} </h5>
            <h4 class="label color-secondary fw-bold">
                {{__('news.explore')}}
            </h4>
        </div>
        @if(!$request->search ?? null)
        <div class="swiper-container blogCateg_swiper mb-5">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <button class="butn {{(!$request->category_id ?? null)?"active":""}}"  onclick="window.location ='{{route('news.all')}}'">{{__('news.all')}} <small>({{$allnews ?? 0}})</small></button> 
                </div>
                @foreach($categories as $value)
                @if($value->currentDescription->name?? null)
                <div class="swiper-slide">
                    <button class="butn {{($request->category_id ?? null)==$value->id?"active":""}}" type="button" onclick="window.location ='{{route('news.all',['category_id'=>$value->id])}}'"> {{$value->currentDescription->name ?? ""}} <small>({{$value->news() ?? 0}})</small></button> 
                </div>
                @endif
                @endforeach
            </div>
        </div>
        @endif
        <div class="row">
            @foreach($news as $value)
            <div class="col-lg-4">
                <div class="blog_card">
                    <img src="{{($value->image ?? null)?asset($value->image):url('').'/assets/web/images/header-bg-2.jpg'}}" class="secImg" alt="" />
                    <div class="txt_content">
                        <span class="categ">{{$value->category->currentDescription->name ?? ""}}</span>
                        <h3 class="title my-3">{{$value->currentDescription->title ?? ""}}</h3>
                        <span class="date"> <i class="fa-light fa-calendar-days"></i>{{date('Y d F', strtotime($value->created_at))}}</span>
                        <div class="p mt-3">
                            {!! stripText($value->currentDescription->description, 200) !!}
                        </div>
                        <a href="{{route('news.details', $value->id)}}" class="more_butn fw-bold text-center w-fit d-flex justify-content-center align-items-end mt-3 ">
                            <span class="zi_5"> {{__('news.more')}}<i class="far fa-long-arrow-right ms-2"></i></span>
                        </a>
                    </div>
                </div>
            </div>
            @endforeach

        </div>
        @if(!($news->hasMorePages() == false && $news->currentPage() == 1))
        <div class="pagination-wrapper mt-5">
            <nav aria-label="Page navigation example">
                <ul class="pagination justify-content-center">
                    @if (!$news->onFirstPage())
                    <li class="page-item">
                        <a class="page-link" href="{{$news->previousPageUrl()}}" aria-label="Previous">
                            <span aria-hidden="true">«</span>
                        </a>
                    </li>
                    @endif
                    @foreach ($news->getUrlRange(1, $news->lastPage()) as $page => $url)
                    <li class="page-item"><a class="page-link  {{$news->currentPage()==$page?"active":""}}" href="{{$url}}">{{$page}}</a></li>
                    @endforeach
                    @if ($news->hasMorePages())
                    <li class="page-item">
                        <a class="page-link" href="{{$news->nextPageUrl()}}" aria-label="Next">
                            <span aria-hidden="true">»</span>
                        </a>
                    </li>

                    @endif
                </ul>
            </nav>
        </div>
        @endif
    </div>
</section>

@endsection