@extends('front.layouts.base')

@section('content')

    <div class="page-title-area title-bg-two">
        <div class="d-table">
            <div class="d-table-cell">
                <div class="container">
                    <div class="title-content">
                        <h2>{{ __('Blogs') }}</h2>
                        <ul>
                            <li>
                                <a href="{{ route('home') }}">Home</a>
                            </li>
                            <li>
                                <span>{{ __('Blogs') }}</span>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <section class="blog-area ptb-100">
        <div class="container">
            <div class="section-title">
                <span class="sub-title">News & Blog</span>
                <h2>Our Latest News And Blog On Real Estate And Housing</h2>
            </div>
            <div class="row justify-content-center">
                @foreach($blogs as $blog)
                <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="{{ route('client.blogs.show', ['id' => $blog->id]) }}">
                                <img src="{{ asset($blog->images->first()->path) }}" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">{{ $blog->name }}</span>
                            <h3>
                                <a href="{{ route('client.blogs.show', ['id' => $blog->id]) }}">{{ $blog->name }}</a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>Par:</span>
                                    <a href="#">{{ $blog->author_name }}</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>{{ $blog->formatted_published_at }}</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                @endforeach
                <!-- <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="blog-details.html">
                                <img src="assets/images/blog/blog2.jpg" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">Tips & Trick</span>
                            <h3>
                                <a href="blog-details.html">A Digital Prescription For The Pharma Industry </a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>By:</span>
                                    <a href="blog.html#">Admin</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>October 20, 2021</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="blog-details.html">
                                <img src="assets/images/blog/blog3.jpg" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">Tips & Trick</span>
                            <h3>
                                <a href="blog-details.html">Harvest Great Ideas From Your Company’s Best Assets</a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>By:</span>
                                    <a href="blog.html#">Admin</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>October 21, 2021</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="blog-details.html">
                                <img src="assets/images/blog/blog4.jpg" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">Tips & Trick</span>
                            <h3>
                                <a href="blog-details.html">Retail Banks Wake Up To Digital Lending This Year</a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>By:</span>
                                    <a href="blog.html#">Admin</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>October 22, 2021</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="blog-details.html">
                                <img src="assets/images/blog/blog5.jpg" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">Tips & Trick</span>
                            <h3>
                                <a href="blog-details.html">Strategic And Commercial Approach With Issues</a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>By:</span>
                                    <a href="blog.html#">Admin</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>October 23, 2021</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-lg-4">
                    <div class="blog-item">
                        <div class="top">
                            <a href="blog-details.html">
                                <img src="assets/images/blog/blog6.jpg" alt="Blog">
                            </a>
                        </div>
                        <div class="bottom">
                            <span class="tips">Tips & Trick</span>
                            <h3>
                                <a href="blog-details.html">Within The Construction Industry As Their Overdraft</a>
                            </h3>
                            <ul>
                                <li>
                                    <i class='bx bxs-user'></i>
                                    <span>By:</span>
                                    <a href="blog.html#">Admin</a>
                                </li>
                                <li>
                                    <i class='bx bx-calendar'></i>
                                    <span>October 24, 2021</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div> -->
            </div>
            <!-- Pagination links -->
            {{ $blogs->links() }}
            <!-- Pagination end -->
        </div>
    </section>

@endsection