<!DOCTYPE html>
<html>
<head>
    {% block meta %}
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    {% endblock %}

    <title>
        {% block title %}{% endblock %}
    </title>

    {% block stylesheets %}
        <link rel='stylesheet' type='text/css' href="{{ asset('assets/fonts/inter/inter.css') }}">
        <link rel='stylesheet' type='text/css' href="{{ asset('assets/fonts/manrope/manrope.css') }}">
        <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/base.css') }}">
        <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/reset.css') }}">
        {% for stylesheet in show_stylesheets() %}
            <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/' ~ stylesheet) }}">
        {% endfor %}
    {% endblock %}

    {% for arr in handle_event('ShowHeadElements', app.request) %}
        {# Only one element, but has dynamic value, can't access it directly #}
        {% for type, element in arr %}
            <{{ type }} rel="{{ element['rel'] }}" type="{{ element['type'] }}" href="{{ element['href'] }}" title="{{ element['title'] }}">
        {% endfor %}
    {% endfor %}
</head>

<body class="bg">
    {% block header %}
        <div id='header'>
            <details class="panel" id="left-container">
                <summary tabindex="0" aria-haspopup="true" role="button" aria-expanded="false">
                    {{ icon('menu', 'icon icon-left') | raw }}
                    {{ block("leftpanel", "stdgrid.html.twig") }}
                </summary>
            </details>

            <a id='instance' href="{{ path('main_public') }}" tabindex="0">
                {{ icon('logo', 'icon icon-logo') | raw }}
                <h1> {{ config('site', 'name') }} </h1>
            </a>

            <details class="panel" id="right-container">
                <summary tabindex="0" aria-haspopup="true" role="button" aria-expanded="false">
                    {{ icon('notes', 'icon icon-right') | raw }}
                    {{ block("rightpanel", "stdgrid.html.twig") }}
                </summary>
            </details>
        </div>
    {% endblock header %}

    <div class="container">
        <div class='content'>
            {% block nav %}{% endblock %}
            {% block body %}{% endblock %}
            {% block javascripts %}{% endblock javascripts %}
        </div>
    </div>
</body>
</html>

