<article class="card mb-4 border-0 border-bottom rounded-0 pb-4">
    {% if post.thumbnail %}
        <a href="{{ post.url }}">
            <img src="{{ post.thumbnail }}" class="card-img-top rounded" alt="{{ post.title|e('html_attr') }}" loading="lazy">
        </a>
    {% endif %}
    <div class="card-body px-0">
        <h2 class="card-title h4">
            <a href="{{ post.url }}" class="text-decoration-none text-body">{{ post.title }}</a>
        </h2>
        <div class="text-body-secondary small mb-2">
            <time datetime="{{ post.date_iso }}">{{ post.date }}</time>
            <span class="mx-1">&middot;</span>
            <a href="{{ post.author.url }}" class="text-body-secondary text-decoration-none">{{ post.author.name }}</a>
        </div>
        <p class="card-text">{{ post.excerpt|raw }}</p>
        <a href="{{ post.url }}" class="btn btn-outline-primary btn-sm">
            {{ post.read_more }}
        </a>
    </div>
</article>
