@extends('Template.layouts.master')

@section('title','مجله آی فاند')

@section('content')

<div class="main">
    <!--breadcrumb bar start-->
{{--    <div class="breadcrumb-bar py-3 gray-light-bg border-bottom">--}}
{{--        <div class="container">--}}
{{--            <div class="row">--}}
{{--                <div class="col-12">--}}
{{--                    <div class="custom-breadcrumb">--}}
{{--                        <ol class="breadcrumb d-inline-block bg-transparent list-inline py-0 pl-0">--}}
{{--                            <li class="list-inline-item breadcrumb-item"><a href="{{ route('home') }}">خانه</a></li>--}}
{{--                            <li class="list-inline-item breadcrumb-item active">مجله آی فاند</li>--}}
{{--                        </ol>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </div>--}}
    <!--breadcrumb bar end-->

    <!--pricing section start-->
    <section class="pricing-section ptb-100 ">
        <div class="mx-4">
            <div class="row justify-content-center">
                <div class="col-md-9 col-lg-8">
                    <div class="section-heading text-center mb-5">
                        <h2>بلاگ</h2>
                    </div>
                </div>
            </div>
            <div class="row align-items-center">
                @foreach($articles as $article)
                    <div class="col-lg-3 col-md-6 col-12 mt-4">
                        <a href="{{route('blog-details',$article['id'])}}">
                            <div class="card text-center single-pricing-pack">
                                <div class="position-relative">
                                    <img class="img-blog w-100"
                                         src="{{asset('user_data/images/'.$article['cover_img'])}}" alt="">
                                    <div class="card-header border-0 blog-header">
                                        <h5 class="mt-2 text-white">{{$article['title']}}</h5>
                                    </div>
                                </div>

                                <div class="card-body p-3">
                                    <p class="blog-Summary description mb-4">{{$article['intro']}}</p>
                                    <div class="blog-details d-flex justify-content-between">
                                        <span>{{$article['fullName']}}</span>
                                        <span class="blog-date">{{$article['created_at']}}</span>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                @endforeach
            </div>
            <div class="mt-4">
                {{$articleLinks->links('pagination::bootstrap-4')}}
            </div>
        </div>
    </section>
    <!--pricing section end-->

</div>

@endsection