@extends('frontend.layouts.app')
@section('title')
    News & Events
@endsection
@push('style')
@endpush
@section('content')
    @include('frontend.layouts.include.breadcrumb', [
        'items' => [['name' => 'News & Events', 'url' => null]],
    ])

    <div class="container-fluid my-4">
        <div class="row">
            @foreach ($news_and_events as $event)
                <div class="col-12 col-sm-4 mb-4">
                    <div class="card border-secondary">
                        <img src="{{ asset($event->images[0]) }}" class="card-img-top" />
                        <div class="card-body">
                            <h5 class="card-title text-primary">
                                {{ Str::limit($event->title, 60, '...') }}
                            </h5>
                            <p style="color: gray">
                                {{ Str::limit(strip_tags($event->description), 120, '...') }}
                            </p>
                            <div class="card-meta d-flex justify-content-between mb-0 pb-0">
                                <span><i class="ri-calendar-2-line text-primary"></i>
                                    {{ $event->created_at->format('d M, Y') }}</span>
                                <a href="{{ route('newsAndEventDetails', $event->slug) }}"
                                    class="read-more-link text-primary" style="font-weight: 500">Read More
                                    <i class="ri-arrow-right-line"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
        <div class="mb-5">
            {{ $news_and_events->links('vendor.pagination.frontend') }}
        </div>
    </div>
    </div>
@endsection
@push('script')
@endpush