@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('./front/img/bgg.jpg'); background-repeat: no-repeat; background-size: cover;background-position: center;">
        <div class="container">
            <div class="row justify-content-center  m-top-100">
                <div class="col-md-8 col-sm-12">
                    <p class="m-auto mb-0 title-white text-center primary-ts-color" style="margin-bottom: 10px !important">BLOG</p>
                    <h1 class="display-3 title-white size-3 text-center">What's New</span></h1>
                    <p class="title-white text-center">Welcome! Here you'll find our top guides and resources to
                        help you learn new technology the right way. Enjoy!</p>
                        
                        
                        @include('/front/partials/search')
                </div>
            </div>
        </div>
    </div>
</div>


<section class="blog-grid-wrapper section-padding ">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 m-bottom-100">
                <div class="divider section-title-simple ">
                    <img src='{{ asset("front/img/svg/labs.png") }}' style="width: 30px" />
                    <div class="divider text-center">
                        <h1 class="color-dark">{{ $posts->count() }} Result for {{ $query }} </h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="row" data-uk-grid>
            @if($posts->count() > 0)
            @foreach ($posts as $post)

            <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>{{ $post->admin->name }}</span>
                            </li>
                            <li>{{ $post->created_at->toFormattedDateString() }}</li>
                        </ul>
                        <h6 class="color-gray"><a href="">{{$post->title}}</a></h6>
                      
                    </div>
                </div>
            </div>

            @endforeach
            @else
            <div class="m-bottom-50">

                <div class="divider text-center">
                    <h4 class="color-light">Sorry, No Post Found</h4>
                </div>

            </div>
            @endif

        </div>

        {{-- {{ $posts->links() }} --}}
</section>


    





    @endsection