@extends('front.partials.front')

@section('content')


<div class="intro-one">
    <div class="intro-one--contents" style="background-image: linear-gradient(to right bottom, rgba(14, 5, 76, 0.8),rgba(14, 5, 76, 0.8)), url({{ Storage::disk('public')->url('post/'.$post->image) }}); background-repeat: no-repeat; background-size: cover;background-position: center;">
        <div class="container">
            <div class="row justify-content-center  m-top-80">
                <div class="col-md-8 col-sm-12 text-center">
                    @foreach ($post->categories as $category)
                      <img src="{{ Storage::disk('public')->url('category/'.$category->image) }}" alt="" style="width: 224px; border-radius: 15px;" />
                    @endforeach

                    <h1 class="display-3 title-white size-3 text-center m-top-80">{{$post->title}}</h1>
                </div>
            </div>

            <div class="row m-top-80 align-items-center">
                <div class="col-lg-3 col-sm-6">
                    <div class="text-center anthor">
                        <img src="{{ asset('front/img/team1.jpg') }}" style="width: 40.13px; border-radius: 100px;margin-right: 6px;" alt="">
                        <span>{{ $post->admin->name }}</span>
                    </div>
                </div>

                <div class="col-lg-3 col-sm-6">
                    <div class="text-center date">
                        <span>{{ $post->created_at->toFormattedDateString() }}</span>
                    </div>
                </div>

                <div class="col-lg-3 col-sm-6 ">
                    <div class="text-center category">
                        @foreach ($post->categories as $category)
                        <span href="">{{ $category->name }}</span>
                        @endforeach
                    </div>
                </div>

                <div class="col-lg-3 col-sm-6 ">
                    <div class="text-center read">
                        <span><i class="fa fa-eye"></i> {{ $post->view_count }}</span>
                    </div>
                </div>

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




<section class="blog-single-wrapper  section-padding ">
    <div class="container">
        <div class="row">
            <div class="col-lg-10 offset-lg-1">
                <div class="post-details">
                    <div class="post-head">
                        <img src="{{ Storage::disk('public')->url('post/'.$post->image) }}" alt="">
                    </div>
                    <div class="post-content">
                        <div class="post-header">
                            <h3>{{ $post->title }}</h3>
                        </div>

                        <div class="content">
                        {!! $post->body !!}
                </div>
                     
                    </div>
                </div>

                <div class="post-bottom d-flex justify-content-between">
                    <div class="tags">
                        <ul class="d-flex">
                            @foreach ($post->tags as $tag)
                            <li><a href="{{ url('tag',$tag->slug) }}">{{ $tag->name }}</a></li>
                            @endforeach
                        </ul>
                    </div>
                    <div class="social-share d-flex align-items-center">
                        <span class="m-right-15">Love The Post? Share it! </span>

                        <div class="social social--small social--colored ">
                            <ul class="d-flex flex-wrap">
                                <li><a href="#" class="facebook"><span class="fab fa-facebook-f"></span></a></li>
                                <li><a href="#" class="twitter"><span class="fab fa-twitter"></span></a></li>
                                <li><a href="#" class="linkedin"><span class="fab fa-linkedin-in"></span></a></li>
                            </ul>
                        </div>

                    </div>
                </div>

                <div class="post-author cardify border">
                    <div class="author-thumb">
                        <img src="{{ asset('front/img/minilogo.png') }}" alt="" class="rounded-circle">
                    </div>
                    <div class="author-info" style="padding-left: 20px;">
                        <h5>About <span>TaillisLabs Developers</span></h5>
                        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quod laudantium fuga modi quam minima adipisci facere a ad aperiam. Odit architecto quidem expedita maiores repellendus doloremque accusantium, delectus quod natus.</p>

                        <div class="social-basic ">
                            <ul class="d-flex justify-content-start ">
                                <li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
                                <li><a href="#"><span class="fab fa-twitter"></span></a></li>
                                <li><a href="#"><span class="fab fa-linkedin-in"></span></a></li>
                            </ul>
                        </div>
                    </div>
                </div>


            </div>
        </div>


    </div>
</section>




<section class="blog-grid-wrapper p-top-120  p-bottom-90" style="position: relative; background: #ffffff;">
    <img src="{{asset('front/img/svg/up.svg') }}" style="position:absolute; top: -2px; left:0; width: 100%;" alt="">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 m-bottom-20 m-top-120">
                <div class="divider section-title-simple">
                    <h1 class="">You'll also like... </h1>
                </div>
            </div>
        </div>
    </div>

    <div class="content-block section-feature-boxes">
        <div class="container">

            <div class="row">
                @foreach ($posts as $post)
                @if($post->status == true)
                <div class="col-lg-4 col-md-6">
                    <div class="card post--card post--card-item shadow-sm" style="border-radius: 1rem;">
                        <figure>
                            <a href="/blog/{{$post->slug}}">
                                <div class="row justify-content-center">
                                    <div class="col-3">
                                        <img src="{{ Storage::disk('public')->url('post/'.$post->image) }}" alt="">
                                    </div>
                                    <div class="col-9">
                                        <h4 class="title-white">{{$post->title}}</h4>
                                    </div>
                                </div>
                            </a>
                        </figure>
                        <div class="card-body">
                            <ul class="post-meta d-flex">
                                <li>
                                    <img src="{{ asset('front/img/team1.jpg') }}" style="width: 24.7px; border-radius: 100px;margin-right: 6px;" alt="">
                                    <span>Abdelghafour Harraz</span>
                                </li>
                                <li>{{ $post->created_at->toFormattedDateString() }}</li>
                            </ul>
                            <h6 class="color-gray"><a href="">{{$post->title}}</a></h6>
                        </div>
                    </div>
                </div>
                @endif
                @endforeach
            </div>

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







@endsection