@extends('frontend.layouts.app')
@section('content')
    <div class="search-overlay">
        <div class="d-table">
            <div class="d-table-cell">
                <div class="search-layer"></div>
                <div class="search-layer"></div>
                <div class="search-layer"></div>
                <div class="search-close">
                    <span class="search-close-line"></span>
                    <span class="search-close-line"></span>
                </div>
                <div class="search-form">
                    <form>
                        <input type="text" class="input-search" placeholder="Search here...">
                        <button type="submit"><i class="bx bx-search"></i></button>
                    </form>
                </div>
            </div>
        </div>
    </div>


    <div class="inner-banner" id="banner-opc">
        <div class="container">
            <div class="inner-title text-center">
                <h3>Blog Style Two</h3>
                <ul>
                    <li>
                        <a href="{{route('home')}}">Home</a>
                    </li>
                    <li>
                        <i class="bx bx-chevrons-right"></i>
                    </li>
                    <li>Blog Style Two</li>
                </ul>
            </div>
        </div>
    </div>


    <div class="blog-area pt-100 pb-70">
        <div class="container">
            <div class="section-title text-center">
                <span class="sp-color2">Latest Blog</span>
                <h2>Let’s Check Some Latest Blog</h2>
            </div>
            <div class="row pt-45">
                @foreach ($blogs as $blog)
                    <div class="col-lg-4 col-md-6">
                        <div class="blog-card">
                            <div class="blog-img">
                                <a href="{{route('blogs',$blog->slug )}}">
                                    <img src="{{ asset('backend/images/blog/' . $blog->image) }}" alt="Blog Images">
                                </a>
                                <div class="blog-tag">
                                    <h3>{{ $blog->created_at->format('d') }}</h3>
                                    <span>{{ $blog->created_at->format('M') }}</span>
                                </div>
                            </div>
                            <div class="content">
                                <ul>
                                    <li>
                                        <a href="#"><i class="bx bxs-user"></i> By ARMS</a>
                                    </li>
                                    <li>
                                        <a href="#"><i class="bx bx-purchase-tag-alt"></i>Business</a>
                                    </li>
                                </ul>
                                <a href="{{route('blogs',$blog->slug )}}">
                                    <h3>
                                        {{ $blog->title }}
                                    </h3>
                                </a>
                                <p>{{ $blog->short_description }}</p>
                                <a href="{{route('blogs',$blog->slug )}}" class="read-btn">Read More <i
                                        class="bx bx-chevron-right"></i></a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="pagination-wrapper text-center">
                {{ $blogs->links() }}
            </div>
        </div>
    </div>
@endsection