{# The frame around every management screen. One sidebar, always the same, so each area is one
   click away and the current one is visible. Screens fill in heading, lead, actions and content. #}
{% extends 'admin/base.html.twig' %}
{% block body_class %}admin-shell{% endblock %}
{% block body %}
<header class="shell-nav">
    <a class="brand" href="{{ path('admin_pages') }}"><span class="brand-icon" aria-hidden="true">k.</span>kant<span>cms</span></a>
    <nav aria-label="Verwaltung">
        <p class="nav-label" id="nav-content">INHALT</p>
        <ul class="nav-list" aria-labelledby="nav-content">
            {% set entries = [
                {id: 'pages', route: 'admin_pages', icon: '▤', label: 'Seiten'},
                {id: 'partials', route: 'admin_partials', icon: '◫', label: 'Bereiche'},
                {id: 'menus', route: 'admin_menus', icon: '☰', label: 'Menüs'},
                {id: 'media', route: 'admin_media', icon: '▩', label: 'Mediathek'},
                {id: 'forms', route: 'admin_forms', icon: '✉', label: 'Formulare'}
            ] %}
            {% for entry in entries %}
            <li><a class="nav-item" href="{{ path(entry.route) }}"{{ nav|default('') == entry.id ? ' aria-current="page"' : '' }}><span class="nav-icon" aria-hidden="true">{{ entry.icon }}</span>{{ entry.label }}</a></li>
            {% endfor %}
        </ul>
        <p class="nav-label" id="nav-site">WEBSITE</p>
        <ul class="nav-list" aria-labelledby="nav-site">
            <li><a class="nav-item" href="{{ path('admin_theme') }}"{{ nav|default('') == 'theme' ? ' aria-current="page"' : '' }}><span class="nav-icon" aria-hidden="true">◐</span>Design</a></li>
            <li><a class="nav-item" href="{{ path('admin_settings') }}"{{ nav|default('') == 'settings' ? ' aria-current="page"' : '' }}><span class="nav-icon" aria-hidden="true">⚙</span>Einstellungen</a></li>
            <li><a class="nav-item nav-out" href="/">Website ansehen</a></li>
            <li><a class="nav-item nav-out" href="/beitraege">Beitragsübersicht</a></li>
        </ul>
    </nav>
    <div class="shell-foot">
        <p class="shell-user"><span class="shell-avatar" aria-hidden="true">{{ app.user.userIdentifier|first|upper }}</span><strong>{{ app.user.userIdentifier }}</strong></p>
        <form action="{{ path('admin_logout') }}" method="post">
            <input type="hidden" name="_csrf_token" value="{{ csrf_token('logout') }}">
            <button class="subtle" type="submit">Abmelden</button>
        </form>
    </div>
</header>
<main id="admin-main" class="shell-main" tabindex="-1">
    <div class="shell-top">
        <div class="shell-heading">
            <h1>{% block heading %}Verwaltung{% endblock %}</h1>
            <p class="muted">{% block lead %}{% endblock %}</p>
        </div>
        <div class="shell-actions">{% block actions %}{% endblock %}</div>
    </div>
    <div class="shell-body stack">
        {% for type in ['error', 'success'] %}{% for message in app.flashes(type) %}
            <p class="notice {{ type == 'error' ? 'error' : 'ok' }}" role="{{ type == 'error' ? 'alert' : 'status' }}">{{ message }}</p>
        {% endfor %}{% endfor %}
        {% block content %}{% endblock %}
    </div>
</main>
{% endblock %}