{% load navigation_tags static wagtailuserbar wagtailfontawesome %}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>
            {% block title %}
                {% if page.seo_title %}
                    {{ page.seo_title }}
                {% else %}
                    {{ page.title }}
                {% endif %}
            {% endblock %}
            {% block title_suffix %}
                | The Wagtail Bakery
            {% endblock %}
        </title>
        <meta name="description" content="{% if page.search_description %}{{ page.search_description }}{% endif %}">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
        {% fontawesome_css %}
        <link rel="stylesheet" href="{% static 'css/font-marcellus.css' %}">
        <link rel="stylesheet" href="{% static 'css/font-open-sans.css' %}">
        <link rel="stylesheet" href="{% static 'css/main.css' %}">
    </head>

    <body class="{% block body_class %}template-{{ self.get_verbose_name|slugify }}{% endblock %}">
        {% wagtailuserbar %}

        {% block header %}
            {% include "includes/header.html" with parent=site_root calling_page=self %}
        {% endblock header %}

        {% block breadcrumbs %}
            {# breadcrumbs is defined in base/templatetags/navigation_tags.py #}
            {% breadcrumbs %}
        {% endblock breadcrumbs %}

        {% block messages %}
            {% include "includes/messages.html" %}
        {% endblock messages %}

        <main>
            {% block content %}
            {% endblock content %}
        </main>

        <hr>

        {% include "includes/footer.html" %}

        <script type="module" src="{% static 'js/main.js' %}"></script>
    </body>
</html>
