@extends('web.layouts.container')

@section('header')
    <div class="container">
        <div class="inner">
            <div class="top">
                <a href="{{LaravelLocalization::getLocalizedURL(getCurrentLocale(), route('home'), [], true)}}">{{__('main.home')}}</a>
                <span>{{__('articles.shar_blog') ?? $blogPage->title}}</span>
            </div>
{{--            <h2>{{$blogPage->title}}</h2>--}}
{{--            <p>{{stripText($blogPage->description)}}</p>--}}
        </div>
    </div>
@endsection

@section('content')
    <section class="news_pg">
        <!--Start blog-sec-->
        <section class="blog-sec">
            <div class="container">
                <div class="heading-sec">
                    <h4>{{__('articles.shar_blog')}}</h4>
                </div>
                <div class="row">
                    @if(count($blogs))
                        @foreach($blogs as $blog)
                            @if($loop->iteration == 1 || $loop->iteration == 2)
                                <div class="col-lg-6">
                                    <a href="{{route('blog.show', $blog->id)}}">
                                        <div class="content">
                                            <div class="item">
                                                <div class="card row no-gutters">
                                                    <div class="image-content col-lg-5">
                                                        <img src="{{asset($blog->image)}}" class="main-blog">
                                                        <sapn class="date">{{date('d M' , strtotime($blog->created_at))}}</sapn>
                                                    </div>
                                                    <div class="card-body col-lg-7">
                                                        <span class="date">{{date('d M, Y' , strtotime($blog->created_at))}}</span>
                                                        <h5>{{$blog->title}}</h5>
                                                        <p>{{stripText($blog->description, 50)}}</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                @else

                                <div class="col-lg-4">
                                    <a href="{{route('blog.show', $blog->id)}}">
                                        <div class="card">
                                            <div class="image-content">
                                                <img src="{{asset($blog->image)}}" class="main-blog">
                                                <sapn class="date">{{date('d M' , strtotime($blog->created_at))}}</sapn>
                                            </div>
                                            <div class="card-body">
                                                <span class="date">{{date('d M, Y' , strtotime($blog->created_at))}}</span>
                                                <h5>{{$blog->title}}</h5>
                                                <p>{{stripText($blog->description, 50)}}</p>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                            @endif

                        @endforeach
                    @endif
                </div>
            </div>
        </section>
    </section>
@endsection

@section('inner_js')
    <script>
        let url = "{{asset($blogPage->image)}}";
        $('header').addClass('inner_header').attr('style', 'background: url('+url+')');
        $('.navs-container').addClass('inner_nav');
    </script>
@endsection