@extends('user.user_dashboard')
@section('home')



<!-- ================================
    START BREADCRUMB AREA
================================= -->
<section class="breadcrumb-area section-padding img-bg-2">
   <div class="overlay"></div>

   <div class="container">

       <div class="breadcrumb-content d-flex flex-wrap align-items-center justify-content-between">
          
           <div class="section-heading">
               <h2 class="section__title text-white"> <a href="{{ route('dashboard') }}"> <i class="la la-chevron-left icon text-white"> </i> </a> Upcoming Events and Blogs </h2>
           </div>

           <ul class="generic-list-item generic-list-item-white generic-list-item-arrow d-flex flex-wrap align-items-center">
              
           </ul>

       </div><!-- end breadcrumb-content -->

   </div><!-- end container -->
</section><!-- end breadcrumb-area -->
<!-- ================================
   END BREADCRUMB AREA
================================= -->




@php
    $blogs = App\Models\Blog::latest()->where('status', 1)->paginate(9);
@endphp



<section class="course-area pb-120px" >
    <div class="container">

        <div class="section-heading text-center">

            {{-- <h5 class="ribbon ribbon-lg mt-5"> Articles  </h5> --}}
            {{-- <h2 class="section__title pt-5 text-white">   UPCOMING EVENTS AND BLOGS  </h2> --}}
            
            {{-- <span class="section-divider"></span> --}}

        </div><!-- end section-heading -->




    <div class="row my-5 p-5" style="background-color:#031124">

     @foreach( $blogs as $blog)

     <div class="col-lg-4">

        <div class="card card-item" style="height:350px">
            <div class="card-image">
                <a href="{{ route('dashboard.show.blog', $blog->blog_slug) }}" class="d-block">
                    <img class="card-img-top" src="{{ asset($blog->blog_image) }}" alt="Card image cap">
                </a>

                <div class="course-badge-labels">
                   {{-- <div class="course-badge"> {{ $blog->blog_day}}  {{$blog->blog_month}} </div> --}}
                </div>

            </div><!-- end card-image -->

            <div class="card-body">
                <h5 class="card-title"><a href="{{ route('dashboard.show.blog', $blog->blog_slug) }}">  {{$blog->blog_name}} </a></h5>

            
                <div class="d-flex justify-content-between align-items-center pt-3">

                    <a href="{{ route('dashboard.show.blog', $blog->blog_slug) }}" class="btn theme-btn theme-btn-sm theme-btn-white">Read More <i class="la la-arrow-right icon ml-1"></i></a>
                   
                </div>
            </div><!-- end card-body -->
        </div><!-- end card -->
      </div><!-- end col-lg-4 -->


    @endforeach

   </div>
     
      
        

    </div>
</section>








<div class="container">
    <div class="row">
        <div class="col-12 d-flex justify-content-center">
            <div class="pagination-container">
                {{ $blogs->links('pagination::bootstrap-4') }}
            </div>
        </div>
    </div>
</div>















@endsection