@extends('layouts.webdes')

@section('main')

<div class="container">
    <div class="row main-content ">
        <div class="col-lg-8 js-demo-content-area">
            <div class="js-post-list-wrap">
    @foreach ($post as $item)
    <article class="post-card flex js-post-card">
        <div class="post-img-container">
            <a href="{{ route('webdes.artikelDetail', ['desa'=>$nama_desa,'slug'=>$item->slug]) }}" class="post-img-wrap">
                <img loading="lazy" srcset="{{ asset('storage/'.$item->image) }}"
                    sizes="(max-width: 472px) 400px, (max-width: 767px) 600px, (min-width: 768px) 400px, 400px"
                    src="{{ asset('storage/'.$item->image) }}" alt="{{ $item->title }}">
            </a>
        </div>
        <div class="post-info-wrap">
            <div class="tag-list">
                <a href="#"><span class="tag-accent" style="background: #1DBF2F;"></span>{{ $item->tags }}</a>
            </div>
            <h2 class="post-title">
                <a href="{{ route('webdes.artikelDetail', ['desa'=>$nama_desa,'slug'=>$item->slug]) }}">{{ $item->title }}</a>
            </h2>
            <div class="post-excerpt">
                {!! $item->content !!}
            </div>
            <div class="post-meta text-s">
                <time class="post-date" datetime="2022-05-02">
                    <svg><use xlink:href="#i-calendar"></use></svg>{{ \Carbon\Carbon::parse($item->created_at)->translatedFormat('F d, Y') }}
                </time>
            </div>
        </div>
    </article>
    @endforeach
    
</div>
<div class="pagination-wrap text-center" id="pagination-wrap">
    <a href="{{ $post->previousPageUrl() }}" class="btn post-load-button"><span>Sebelumnya</span></a>
    <a href="{{ $post->nextPageUrl() }}" class="btn post-load-button"><span>Selanjutnya</span></a>
</div>
<div id="load-more"></div>            
</div>
@include('components.webdes.sidebar')

@endsection