@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-10">
                <div class="col-md-8 col-sm-12">

                    <h1 class="display-3 title-white size-3 text-center"> {{ $category->name }}</span></h1>

                    @include('/front/partials/search')
                </div>

                <div class="col-lg-12 col-sm-12 m-top-80">
                    <div class="ts-blog-categories">
                        <div class="ts-wrapper">
                            <ul>

                                <li>
                                    <a href="{{ url('category',$category->slug) }}">
                                        <img src="{{ Storage::disk('public')->url('category/'.$category->image) }}" alt="Angular topic logo">
                                        <span class="ts-blog-categories-title"> {{ $category->name }} </span>
                                    </a>
                                </li>

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





<section class="blog-grid-wrapper section-padding section-bg">
    <div class="container">

        <div class="row" data-uk-grid>
        @if($category->posts->count() > 0)
                    @foreach ($category->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>

</section>




    






    @endsection