@extends('reachassuree_web/layouts.main')
@section('title', $data['title'])
@section('description', $data['description'])
@section('title', $data['blog'])
@section('content')

<!-- Start Page Title Area -->
<div class="page-title-area">
    <div class="container">
        <div class="page-title-content">
            <h2>Blog</h2>
            <ul>
                <li><a href="{{ route('home.page') }}">Home</a>
                <li class="active">Blog and News</li>
            </ul>
        </div>
    </div>
    <img src="{{ asset('rassets/images/subscribe-shape-1.png') }}" alt="Image" class="shape shape-1" data-speed="0.04" data-revert="true">
    <img src="{{ asset('rassets/images/subscribe-shape-2.png') }}" alt="Image" class="shape shape-2" data-speed="0.04" data-revert="true">
</div>
<!-- End Page Title Area -->
<div class="blog-area pt-50 pb-50">
    <div class="container">
        <div class="section-title">
            <h3>Better Digital Insurance Begins Right Here</h3>
        </div>
        <div class="row align-items-center">
        
            @foreach ($data['blog'] as $key => $value)
            <div class="col-lg-4 col-md-6">
                <div class="single-blog-item style-post">
                    <a href="{{ route('blog.details',['slug'=>$value->slug]) }}">
                        <img src="{{ asset('/rassets/images/blog/'.$value->img)}}" alt="Image"> 
                    </a>
                    <div class="blog-content blog-page">
                        <ul>
                            <li>{{  $value->date }}</li>
                            <li><a href="{{ route('blog') }}">{{ $value->category }}</a></li>
                        </ul>
                        <h3><a href="{{ route('blog.details',['slug'=>$value->slug]) }}">{{ $value->title }}</a></h3>
                        <a href="{{ route('blog.details',['slug'=>$value->slug]) }}" class="blog-readMore default-btn"><i class="ri-arrow-right-s-line"></i>Read More</a>
                    </div>
                </div>     
            </div>
            @endforeach 
        </div>
      
        <div class=""> {{ $data['blog']->links() }} </div>
        </div>
    </div>
</div>
<!-- End Blog Area -->

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="{{ asset('rassets/js/jquery.min.js') }}"></script>
<script src="{{ asset('rassets/js/bootstrap.bundle.min.js') }}"></script>
<script>
    $("#tab_blog").addClass("hightlight-tab");
</script>

@endsection