@extends('frontend.layouts.app')
@section('title', 'हाम्रा ब्लगहरू')
@section('meta', 'Welcome to Om Hospital and Research Center PVt. Ltd.')
@section('content')
    <!-- BREADCRUMB
           ============================================= -->
    <div id="breadcrumb" class="division">
        <div class="container">
            <div class="row">
                <div class="col">
                    <div class=" breadcrumb-holder">
                        <h4 class="h4-sm text-white">
                            हाम्रा ब्लगहरू</h4>
                        <!-- Breadcrumb Nav -->
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ route('homepage') }}" class="text-white">गृहपृष्ठ</a>
                                </li>
                                <li class="breadcrumb-item active text-white" aria-current="page">ब्लग</li>
                            </ol>
                        </nav>
                    </div>
                    <!-- Title -->
                </div>
            </div>
        </div> <!-- End row -->
    </div> <!-- End container -->
    <div class="slider-overlay"></div>

    <!-- START SECTION BLOG -->
    <section class="bg_gray">
        <div class="container">
            <div class="row g-5">
                @foreach ($blogs as $blog)
                <div class="col-lg-3 col-md-6 col-12">
                    <div class="blog-item bg-light rounded overflow-hidden">
                        <div class="blog-img position-relative overflow-hidden">
                            <img class="img" src="{{asset($blog->image_path)}}" alt="{{$blog->name}}" width="100%">
                        </div>
                        <div class="p-4">
                            <h4 class="mb-3"><a href="{{route('blog.detail',$blog->slug)}}">{{Str::limit($blog->name_np ? $blog->name_np : $blog->name,25)}}</a></h4>
                            <div class="d-flex mb-3">
                                <small class="mr-3"><i class="far fa-calendar text-primary mr-2"></i>{{$blog->created_at->format('d M, Y')}}</small>
                            </div>
                            <hr>
                            <p>{!!Str::limit($blog->content_np ? $blog->content_np : $blog->content, 125)!!}</p>
                            <a class="text-uppercase" href="{{route('blog.detail',$blog->slug)}}">थप पढ्नुहोस्
                                <i class="bi bi-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>

        </div>
    </section>
    <!-- END SECTION BLOG -->

@endsection