{% extends "ocyan_plugin_wagtail/page.html" %}
{% load i18n %}
{% load static %}
{% load wagtailcore_tags %}
{% load wagtailimages_tags %}

{% block title %}{{ page.title }}{% endblock %}

{% block body_class %}{{ block.super }} blog-overview blog-overview--premium{% endblock %}
{% block headertext %}{{ page.title }}{% endblock %}

{% block styles %}
    {{ block.super }}
    {% if blog_stylesheet_paths %}
        {% for stylesheet_path in blog_stylesheet_paths %}
            <link rel="stylesheet" href="{% static stylesheet_path %}">
        {% endfor %}
    {% else %}
        <link rel="stylesheet" href="{% static 'wagtail_blog/css/blog.css' %}">
        <link rel="stylesheet" href="{% static 'wagtail_blog/css/blog-premium.css' %}">
    {% endif %}
{% endblock %}

{% block page_meta %}
    {{ block.super }}
    {% include "blog/partials/blog_canonical_links.html" with canonical_url=canonical_url prev_page_url=prev_page_url next_page_url=next_page_url only %}
    {% include "blog/partials/blog_structured_data.html" with page=page only %}
{% endblock %}

{% block content %}
    <section class="blog-premium-overview py-4 py-lg-5">
        {% include "blog/packs/premium/partials/blog_overview_intro.html" with page=page current_page=current_page paginator=paginator only %}

        {% if blogs %}
            <div class="row g-4 g-xl-5">
                {% for blog in blogs %}
                    <div class="col-12 col-lg-6">
                        {% include "blog/packs/premium/partials/blog_overview_card.html" with blog=blog only %}
                    </div>
                {% endfor %}
            </div>

            {% if paginator.num_pages > 1 %}
                <div class="pt-4 pt-lg-5">
                    {% include "partials/cms_pagination.html" %}
                </div>
            {% endif %}
        {% else %}
            <div class="blog-premium-empty alert alert-light mb-0" role="status">
                {% trans "No blog posts have been published yet." %}
            </div>
        {% endif %}
    </section>
{% endblock %}