@extends('layouts.frontend.app')

@section('content')

<section class="module paralax paallax-3 mt-1" style="background-image: url(''); background-position: 100% 120px; height: 120px;">
  <div class="container">
      <div class="row">
          <nav aria-label="breadcrumb">
              <ol class="breadcrumb mt-4">
                <li class="breadcrumb-item"><a href="index.html">Home</a></li>
                <li class="breadcrumb-item active" aria-current="page">Cateogry Post</li>
              </ol>
          </nav>
      </div>
      <!-- <h3><span style="background-color: #dc3545; border-radius: 10px; padding: 10px;">Customize Your own PC. </span></h3> --}} -->
  </div>
</section>


<section class="ftco-section ftco-degree-bg">
  <div class="container">
    <div class="row">
      <div class="col-md-8">

            <div class="row">
              @foreach ($catpost as $post)
                    <div class="col-md-6 mb-3">
                        <div class="card">
                            <img class="card-img-top" src="{{ asset('storage/app/public/post/'.$post->image)}}">
                            <div class="card-block p-2">
                                <a href="{{ route('post', $post->slug) }}"> <h4 class="card-title mt-3">{{ $post->title}}</h4></a>
                                <div class="meta">
                                    <a>{{ $post->user->name}}</a>
                                    <hr>
                                </div>
                                <div class="card-text">      
                                    {!! Str::limit($post->body, 100) !!}
                                </div>
                            </div>
                            <div class="card-footer">
                                <small>{{ $post->created_at->diffForHumans() }}</small>
                                <a href="{{ route('post', $post->slug) }}" class="btn btn-success float-right btn-sm">Read More</a>
                                <p class="footer">
                                  <i class="fa fa-heart" aria-hidden="true"></i>
                                  <a href="#">{{$post->likedUsers->count()}} Likes</a>
                                  <i
                                    class="ml-20 fa fa-comment"
                                    aria-hidden="true"
                                  ></i>
                                  <a href="#">{{$post->comments->count()}} Comments</a>
                                </p>
                            </div>
                        </div>
                    </div>
              @endforeach
            </div>

      </div>

      @include('layouts.frontend.partials.sidebar')
      
    </div>
  </div>
</section> <!-- .section -->


<div class="container-fluid bg-success p-3">
  <div class="container text-center">
      <h5 class="text-light font-weight-bold text-uppercase"> if any query fell free to contact us </h5>
      <h4 class="text-light font-weight-bold ">Call : &nbsp;<span class="icon-phone2"></span> (+880) 1824 570690 &nbsp;&nbsp;&nbsp; & &nbsp;&nbsp;&nbsp;Email : &nbsp;<span class="icon icon-envelope"></span> info@aeaw.net</h4>
  </div>
</div>

@endsection