{% load static i18n cms_tags sekizai_tags fontawesome menu_tags %}<!DOCTYPE html>
<html class="r" lang="{{ LANGUAGE_CODE }}">
<head>
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>{% block title %}{% page_attribute page_title %}{% endblock %} | Tagesschule Elementa Zug</title>
    <meta name="description" content="{% block description %}{% page_attribute 'meta_description' %}{% endblock %}">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    {% block extra_meta %}
    {% endblock %}

    <link rel="shortcut icon" href="{% static 'img/favicon.ico' %}" type="image/x-icon">
    <link rel="icon" href="{% static 'img/favicon.ico' %}" type="image/x-icon">

    <link rel="icon" type="image/png" sizes="16x16" href="{% static 'img/favicon-16x16.png' %}">
    <link rel="icon" type="image/png" sizes="32x32" href="{% static 'img/favicon-32x32.png' %}">
    <link rel="icon" type="image/png" sizes="96x96" href="{% static 'img/favicon-96x96.png' %}">
    <link rel="icon" type="image/png" sizes="192x192" href="{% static 'img/favicon-192x192.png' %}">

    <meta name="theme-color" content="#98C53A"/>

    <link rel="stylesheet" href="{% static 'css/main.css' %}">

    {% fontawesome_stylesheet %}
    {% render_block "css" %}
    {{ ALDRYN_SNAKE.render_head }}
</head>
<body class="{% block body_class %}{% endblock %}">
    {% cms_toolbar %}

    <a href="/{{ LANGUAGE_CODE }}/" class="header__logo reveal reveal_animation data_delay_2">
        <img src="{% static 'img/tagesschule-elementa.svg' %}" width="100" height="100">
    </a>

    <div id="navigation">
        {% include 'project/includes/navigation.html' %}
    </div>

    <div id="search">
        {% include 'project/includes/search_form.html' %}
    </div>

    {% url 'search' as search_url %}

    {% if notification %}
        <div class="notification">
            <div class="notification__content">
                <div class="notification__title">
                    {{ notification.get_title }}
                </div>
                <div class="notification__text">
                    {{ notification.get_text }}
                </div>
                <a href="{{ notification.page.get_public_url }}" class="notification__button button">
                    <span class="button__icon">{% include 'project/assets/arrow-right-long.svg' %}</span>
                    <span class="button__text">
                        {% if notification.cta %}
                            {{ notification.cta }}
                        {% else %}
                            {% trans 'Mehr erfahren' %}
                        {% endif %}
                    </span>
                </a>
                <a href="#" class="notification__close">
                    {% include 'project/assets/close.svg' %}
                </a>
            </div>
        </div>
    {% endif %}

    <div class="header reveal reveal_animation data_delay_0">
        <span class="header__slogan">{% trans 'Stärken stärken. Lernen lernen.' %}</span>
        <ul class="header__languages">
            {% for lang in LANGUAGES %}
                <li class="{% if lang.0 == LANGUAGE_CODE %}active{% endif %}">
                    <a href="{% page_language_url lang.0 %}">{{ lang.0 }}</a>
                </li>
            {% endfor %}
        </ul>

        {% block header_items %}
            <a href="#" class="header__button header__button--search data_id_2">
                {% trans 'Suche' %}
                <span class="header__button__icon">
                    {% include 'project/assets/search.svg' %}
                </span>
            </a>

            {% if notification %}
                <a href="#" class="header__button header__button--notification data_id_1"
                   data-updated="{{ notification.updated }}">
                    {% trans 'Aktuell' %}
                    <span class="header__button__icon">
                        {% include 'project/assets/bell.svg' %}
                    </span>
                </a>
            {% endif %}

            {% url 'search' as search_url %}
            {% with request.get_full_path as current_url %}
                <a href="{% if search_url in current_url %}/{{ LANGUAGE_CODE }}/{% else %}{{ current_url }}{% endif %}"
                   class="event header__button header__button--navigation data_id_3">
                    {% trans 'Menü' %}
                    <span class="header__button__icon">
                        {% include 'project/assets/menu.svg' %}
                    </span>
                </a>
            {% endwith %}

            <div class="header__navigation">
                {% include 'project/includes/meta_navigation.html' %}
            </div>
        {% endblock %}
    </div>

    <div id="canvas">
        {% block content %}
            {% placeholder 'content' %}
        {% endblock %}
    </div>

    <div class="footer">
        <a href="#" class="footer__login header__button header__button--light data_id_1">
            <span class="header__button__icon">
                {% include 'project/assets/arrow-right-long.svg' %}
            </span>
            {% trans 'Login' %}
        </a>
        <div class="footer__content">
            {% show_menu_below_id 'footer' 0 0 0 0 'project/includes/header_button_menu.html' %}
            {% static_placeholder 'social_media' %}
        </div>
    </div>

    <script type="text/javascript" src="{% static 'js/lib.js' %}"></script>
    <script type="text/javascript" src="{% static 'js/main.js' %}"></script>

    {% block extra_body %}{% endblock %}

    {% render_block "js" %}
    {{ ALDRYN_SNAKE.render_tail }}
</body>
</html>
