{% load static wagtailcore_tags wagtailuserbar wagtailsettings_tags %}

<!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 %}
            {% wagtail_site as current_site %}
            {% if current_site and current_site.site_name %}| {{ current_site.site_name }}{% endif %}
            {% if settings.wagtail_feathers.SiteSettings and settings.wagtail_feathers.SiteSettings.title_suffix %}- {{ settings.wagtail_feathers.SiteSettings.title_suffix }}{% endif %}
            {% endblock %}
        </title>

        {% if page.search_description %}
        <meta name="description" content="{{ page.search_description }}" />
        {% endif %}
        <meta name="viewport" content="width=device-width, initial-scale=1" />

        {# Favicon #}
        <link rel="icon" type="image/x-icon" href="{% static 'branding/favicon.ico' %}">
        <link rel="apple-touch-icon" sizes="180x180" href="{% static 'branding/favicon-180x180.png' %}">
        <link rel="icon" type="image/png" sizes="32x32" href="{% static 'branding/favicon-32x32.png' %}">
        <link rel="icon" type="image/png" sizes="16x16" href="{% static 'branding/favicon-16x16.png' %}">

        {# Force all links in the live preview panel to be opened in a new tab #}
        {% if request.in_preview_panel %}
        <base target="_blank">
        {% endif %}

        {# Prevent FOUC #}
        <style>html{visibility: hidden;opacity:0;}</style>
        {# Global stylesheets #}
        <link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
        {% block extra_css %}{% endblock %}
    </head>

    <body class="{% block body_class %}{% endblock %} theme-loading">
        {% wagtailuserbar %}

        {% block header %}{% endblock %}
        {% block content %}{% endblock %}
        {% block footer %}{% endblock %}

        {# Global javascript #}
        <script defer type="text/javascript" src="{% static 'js/theme.js' %}"></script>
        <script defer type="text/javascript" src="{% static 'js/main.js' %}"></script>
        <script defer type="text/javascript" src="{% static 'js/scrollspy.js' %}"></script>

        {% block extra_js %}{% endblock %}

    </body>
</html>
