@extends('front.layouts.app', ['title' => $blog->name, 'description' => $blog->description,
'image'=> $blog->image ? url('storage') . '/' . $blog->image: ''])

@section('content')
@include('front.layouts.app-header')

<main>

    <section class="single_blog_sec">
        <div class="container">
            <div class="row">
                <div class="col col-8 mx-auto">
                    <div class="sb_title_wrap">
                        <div class="blog_banner_inner">
                            <label for="">{{$blog->blogCategory->name}}</label>
                            <h2><a href="#!">{{$blog->name}}</a></h2>
                            <ul>
                                <li>{{ $blog->date ? date('F j Y', strtotime($blog->date)) : date('F j Y', strtotime($blog->created_at)) }} </li>
                            </ul>
                        </div>
                    </div>
                    <div class="sb_post_image_autor_wrap">
                        <div class="sb_post_image">
                            @if(!empty($blog->image) && \Illuminate\Support\Facades\Storage::exists($blog->image))
                            <img src="{{ url('storage') . '/' . $blog->image}}" alt="">
                            @else
                            <img src="{{ url('storage') . '/no_image.png'}}">
                            @endif
                        </div>

                        <div class="sb_author_wrap">
                            <ul>
                                <li>
                                    <img src="{{ url('storage') . '/usericon.png'}}" alt="">
                                    <label for=""> {{$blog->author}} </label>
                                </li>
                            </ul>
                        </div>
                    </div>

                    <div class="sb_post_main_content">
                        <div class="row">
                            <div class="col col-12">
                                <div class="sb_post_content_inner">
                                    <p>{!!$blog->description!!}</p>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col col-6">
                                <div class="sb_sidebar_wrapper">
                                    <div class="sb_sidebar_item">
                                        <div class="sb_sidebar_title">
                                            <h3>popular</h3>
                                        </div>
                                        <div class="sb_sidebar_content">
                                            <div class="sb_sidebar_blog_list_wrap">
                                                @foreach($popularblogs as $popular)
                                                <div class="sb_sidebar_blog_list_item">
                                                    <div class="sb_sidebar_blog_list_item_image">
                                                        @if(!empty($popular->image) && \Illuminate\Support\Facades\Storage::exists($popular->image))
                                                        <a href="{{route('blog-detail', ['slug' => $popular->slug])}}"><img src="{{ url('storage') . '/' . $popular->image}}" alt=""></a>
                                                        @else
                                                            <a href="{{route('blog-detail', ['slug' => $popular->slug])}}"><img src="{{ url('storage') . '/no_image.png'}}"></a>
                                                        @endif
                                                    </div>
                                                    <div class="sb_sidebar_blog_list_item_content">
                                                        <h3><a href="{{route('blog-detail', ['slug' => $popular->slug])}}">{{$popular->name}}</a></h3>
                                                        <label for="">{{$popular->date ? date('F j Y', strtotime($popular->date)) : date('F j Y', strtotime($popular->created_at)) }}</label>
                                                    </div>
                                                </div>
                                                @endforeach

                                            </div>
                                        </div>
                                    </div>
                                    <!-- <div class="sb_sidebar_item">
                                                <div class="sb_sidebar_bottom_banner">
                                                    <div class="sb_sidebar_bottom_banner_inner" style="background-image: url(images/side_bar_banner.png) center / cover no-repeat;;">
                                                        <h3>Execptional Selection of Wine</h3>
                                                        <div class="c_btn c_btn_red">
                                                            <a href="#!">Buy Now</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div> -->
                                </div>
                            </div>
                            <div class="col col-6">
                                <div class="sb_sidebar_wrapper">
                                    <div class="sb_sidebar_item">
                                        <div class="sb_sidebar_title">
                                            <h3>Categories</h3>
                                        </div>
                                        <div class="sb_sidebar_content">
                                            <div class="sb_sidebar_category_list_wrap">
                                                <ul>
                                                    @foreach($blogCategories as $blog_category)
                                                    <li class="sb_sidebar_category_item">
                                                        <a href="{{route('blog-category-detail', ['slug' => $blog_category->slug])}}">{{$blog_category->name}}</a>
                                                    </li>
                                                    @endforeach
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- <div class="sb_sidebar_item">
                                                <div class="sb_sidebar_bottom_banner">
                                                    <div class="sb_sidebar_bottom_banner_inner" style="background-image: url(images/side_bar_banner.png) center / cover no-repeat;;">
                                                        <h3>Execptional Selection of Wine</h3>
                                                        <div class="c_btn c_btn_red">
                                                            <a href="#!">Buy Now</a>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div> -->
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section>

    <section class="more_recent_sec">
        <div class="container">
            <div class="row">
                <div class="col col-12">
                    <div class="section_title">
                        <h2>Most Recent</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                @foreach($recentblogs as $recent)
                <div class="col col-4">
                    <div class="blog_card">
                        <div class="blog_card_inner">
                            <div class="blog_card_img">
                                @if(!empty($recent->image) && \Illuminate\Support\Facades\Storage::exists($recent->image))
                                <img src="{{ url('storage') . '/' . $recent->image}}" alt="">
                                @else
                                <img src="{{ url('storage') . '/no_image.png'}}">
                                @endif
                                {{-- <span>{{$recent->blogCategory->name}}</span> --}}
                            </div>
                            <div class="blog_card_content">
                                <h3><a href="{{route('blog-detail', ['slug' => $recent->slug])}}">{{$recent->name}}</a></h3>
                                <ul>
                                    <li>{{$recent->date ? date('F j Y', strtotime($recent->date)) : date('F j Y', strtotime($recent->created_at)) }} </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
                <!-- <div class="col col-4">
                    <div class="blog_card">
                        <div class="blog_card_inner">
                            <div class="blog_card_img">
                                <img src="images/blog_2.png" alt="">
                                <span>Get Smart</span>
                            </div>
                            <div class="blog_card_content">
                                <h3><a href="#!">Out of the Bottle: A Wine Containers Quiz</a></h3>
                                <ul>
                                    <li>Jun 11, 2021</li>
                                    <li>5 Comments</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col col-4">
                    <div class="blog_card">
                        <div class="blog_card_inner">
                            <div class="blog_card_img">
                                <img src="images/blog_3.png" alt="">
                                <span>Get Smart</span>
                            </div>
                            <div class="blog_card_content">
                                <h3><a href="#!">Out of the Bottle: A Wine Containers Quiz</a></h3>
                                <ul>
                                    <li>Jun 11, 2021</li>
                                    <li>5 Comments</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div> -->
            </div>
        </div>
    </section>

</main>



@include('front.layouts.app-footer')
@endsection