@extends('layouts.app')
@section('content')

      <div class="container main">
        <div class="row">
          <div class="col-lg-8">
            <div class="all-posts">
                @foreach ($blogs as $blog)

              <div class="post-item">
                <div class="post-img"><img src="{{asset('storage/'.$blog->thumbnail)}}" alt=""></div>
                <div class="post-main-info">
                  <h4>{{$blog->title}}</h4>
                  <div class="post-meta text-muted">
                <span><i class="far fa-user"></i> Posted by {{$blog->author ?? 'Admin'}}</span><span><img style="width: 20px;" src="{{asset('assets/img/icon/calendar.svg')}}" alt=""> {{$blog->created_at}}</span><span><i class="far fa-comment-alt"></i> 0 comments</span>
              </div>
                  <p>{!! Str::limit($blog->content, 100, '...') !!}</p>
                  <a href="{{route('blog.show',$blog->id)}}" class="main-btn">Read More</a>
                </div>
              </div>

              @endforeach

            </div>
          </div>
          <div class="sidebar col-lg-4">
        
            <div class="sidebar-category">
              <h4>We take care of your business</h4>
              <a href="">All category <img style="width: 20px; margin-left: 20px;" src="img/icon/arrow-right-icon.svg" alt=""></a>
              <div class="category">
                @foreach ($blogCategories as $category)

                <div class="category-item">
                  <img class="category-icon" src="{{asset('assets/img/icon/analytics.svg')}}" alt="">
                  <h6 class="category-title">{{$category->title}}</h6>
                  <p> {{ $category->blogs?->count() ?? 0 }} Posts</p>

                  <a href="{{route('category.show',$category->id)}}"><img style="width: 20px;" src="{{asset('assets/img/icon/arrow-right-icon.svg')}}" alt=""></a>
                </div>
                @endforeach

              </div>
            </div>


          </div>
        </div>
      </div>
      @endsection