{# Usage : {% include 'components/blog-card.html.twig' with { article } %} #}
<article class="blog-card">
    <a class="blog-card__media" href="/blog/{{ article.slug }}">
        <img src="{{ article.featuredImage|default('/images/og-default.jpg') }}" alt="{{ article.title }}" loading="lazy" width="640" height="360">
    </a>
    <div class="blog-card__body">
        {% if article.category %}
            <span class="pill" style="{% if article.category.color %}background:{{ article.category.color }};color:#111410{% endif %}">{{ article.category.name }}</span>
        {% endif %}
        <h3 class="blog-card__title"><a href="/blog/{{ article.slug }}">{{ article.title }}</a></h3>
        <p class="blog-card__excerpt">{{ article.excerpt }}</p>
        <div class="blog-card__meta">
            {% if article.publishedAt %}<span>{{ article.publishedAt|date('d/m/Y') }}</span>{% endif %}
            {% if article.readingTime %}<span>{{ article.readingTime }} min de lecture</span>{% endif %}
        </div>
    </div>
</article>