{% macro cards_posts(pages) %}

<div class="cards">
    {%- for page in pages %}
    <div class="card">
        {% if page.extra.local_image %}
        <img class="card-image" alt={{ page.extra.local_image }} src="{{ get_url(path=page.extra.local_image) }}">
        {% elif page.extra.remote_image %}
        <img class="card-image" alt={{ page.extra.remote_image }} src="{{ page.extra.remote_image }}">
        {% else %}
        <div class="card-image-placeholder"></div>
        {% endif %}

        <div class="card-info">
            <h1 class="card-title">
                {% if page.extra.link_to %}
                <a rel="noopener noreferrer" target="_blank" href={{ page.extra.link_to }}>{{page.title}}</a>
                {% else %}
                <a href={{ page.permalink }}>{{page.title}}</a>
                {% endif %}
            </h1>

            <div class="meta">
                {%- if page.date %}
                    {{ page.date | date(format=config.extra.date_format | default (value="%d %B %Y")) }}
                {% endif -%}
                {% if page.draft %}
                <span class="draft-label">DRAFT</span>
                {% endif %}
            </div>

            <div class="card-description">
                {% if page.description %}
                {{ page.description }}
                {% endif %}
            </div>
        </div>
    </div>

    {% endfor -%}
</div>

{% endmacro cards_posts %}