@extends('front.layouts.app')
@section('title','Blog du diocèse')

@section('content')
    <x-title image="assets/img/eglise.jpg" page="Actualités du diocèse"/>

    <!-- Start Blog
   ============================================= -->
    <div class="blog-area full-blog left-sidebar full-blog default-padding">
        <div class="container">
            <div class="row">
                <div class="blog-items">
                    <div class="blog-content col-md-8">
                        @foreach($posts as $post)
                        <div class="item-box">
                            <div class="item">
                                <div class="thumb">
                                    <a href="{{route('actuality.show',$post->id)}} ">
                                        <img src="{{asset($post->getFirstMediaUrl('cover'))}}" alt="Thumbnail">
                                        <div class="overlay-icon">
                                            <i class="fa fa-images"></i>
                                        </div>
                                    </a>
                                </div>
                                <div class="info">
                                    <div class="title-meta">
                                        <div class="date">
                                            {{$post->created_at->format('d')}} <span>{{$post->created_at->format('M')}}</span>
                                        </div>
                                        <div class="title">
                                            <h3>
                                                <a href="{{route('actuality.show',$post->id)}}">{{$post->title}}</a>
                                            </h3>
                                            <div class="meta">
                                                <ul>
                                                    <li>
                                                        <a href="{{route('actuality.show',$post->id)}}"><i class="fas fa-user"></i> Admin</a>
                                                    </li>
                                                    <li>
                                                        <i class="fas fa-calendar-alt"></i> {{$post->created_at->format('d M Y')}}
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                      <p> {{\Illuminate\Support\Str::limit($post->summary,80)}}</p>
                                    <div class="bottom-info">
                                        <a class="btn btn-dark border btn-sm" href="{{route('actuality.show',$post->id)}}">Lire ... <i class="fas fa-angle-right"></i></a>
                                        <ul>
                                            <li>
                                                Partager maintenant:
                                            </li>
                                            <li>
                                                <a href="#"><i class="fab fa-facebook-f"></i></a>
                                            </li>
                                            <li>
                                                <a href="#"><i class="fab fa-twitter"></i></a>
                                            </li>
                                            <li>
                                                <a href="#"><i class="fab fa-linkedin-in"></i></a>
                                            </li>
                                            <li>
                                                <a href="#"><i class="fab fa-pinterest-p"></i></a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach

                        <div class="col-md-12 blog">
                            {{$posts->links()}}
                        </div>
                    </div>
                    <!-- Start Sidebar -->
                    <div class="sidebar col-md-4">
                        <aside>
                            <div class="sidebar-item search">
                                <div class="title">
                                    <h4>Rechercher</h4>
                                </div>
                                <div class="sidebar-info">
                                    <form>
                                        <input type="text" class="form-control">
                                        <input type="submit" value="Rechercher">
                                    </form>
                                </div>
                            </div>
                            <div class="sidebar-item category">
                                <div class="title">
                                    <h4>Categories</h4>
                                </div>
                                <div class="sidebar-info">
                                    <ul>
                                        @foreach($categories as $category)
                                        <li>
                                            <a href="#">{{$category->name}} <span>({{$category->posts->count()}})</span></a>
                                        </li>
                                        @endforeach

                                    </ul>
                                </div>
                            </div>
                            <div class="sidebar-item recent-post">
                                <div class="title">
                                    <h4>Pulications récentes</h4>
                                </div>
                                <ul>
                                    @foreach($postRandoms as $postRandom)
                                    <li>
                                        <div class="thumb">
                                            <a href="#">
                                                <img src="{{asset($postRandom->getFirstMediaUrl('cover'))}}" alt="Thumb">
                                            </a>
                                        </div>
                                        <div class="info">
                                            <a href="{{route('actuality.show',$postRandom->id)}}">{{$postRandom->title}}</a>
                                            <div class="meta-title">
                                                <span class="post-date">{{$postRandom->created_at->format('d M Y')}}</span> | Par <a href="#">Admin</a>
                                            </div>
                                        </div>
                                    </li>
                                    @endforeach

                                </ul>
                            </div>

                            <div class="sidebar-item social-sidebar">
                                <div class="title">
                                    <h4>Suivez-nous</h4>
                                </div>
                                <div class="sidebar-info">
                                    <ul>
                                        <li class="facebook">
                                            <a href="#">
                                                <i class="fab fa-facebook-f"></i>
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="#">
                                                <i class="fab fa-twitter"></i>
                                            </a>
                                        </li>
                                        <li class="pinterest">
                                            <a href="#">
                                                <i class="fab fa-pinterest-p"></i>
                                            </a>
                                        </li>
                                        <li class="g-plus">
                                            <a href="#">
                                                <i class="fab fa-google-plus-g"></i>
                                            </a>
                                        </li>
                                        <li class="linkedin">
                                            <a href="#">
                                                <i class="fab fa-linkedin-in"></i>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
{{--                            <div class="sidebar-item tags">--}}
{{--                                <div class="title">--}}
{{--                                    <h4>tags</h4>--}}
{{--                                </div>--}}
{{--                                <div class="sidebar-info">--}}
{{--                                    <ul>--}}
{{--                                        <li><a href="#">Fashion</a></li>--}}
{{--                                    </ul>--}}
{{--                                </div>--}}
{{--                            </div>--}}
                        </aside>
                    </div>
                    <!-- End Start Sidebar -->
                </div>
            </div>
        </div>
    </div>
    <!-- End Blog -->


@endsection