brass/web/templates/nav.html

113 lines
3.1 KiB
HTML

{% extends "base.html" %}
{% block body %}
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="/static/brass.jpeg" height="240" />
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false"
hx-on:click="[this, document.getElementById('navMenu')].forEach(e => e.classList.toggle('is-active'));">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div class="navbar-menu" id="navMenu">
<div hx-boost="true" class="navbar-start">
<a href="/" class="navbar-item">
Kalender
</a>
{% if user.role == Role::AreaManager || user.role == Role::Admin %}
<div class="navbar-item has-dropdown is-hoverable">
<div class="navbar-item">
Export
</div>
<div class="navbar-dropdown">
<a href="/export/availability" class="navbar-item">
Verfügbarkeiten
</a>
<a href="/export/events" class="navbar-item">
Veranstaltungen
</a>
</div>
</div>
<div class="navbar-item has-dropdown is-hoverable">
<div class="navbar-item">
Verwaltung
</div>
<div class="navbar-dropdown">
<a href="/users" class="navbar-item">
Nutzer
</a>
<a href="/locations" class="navbar-item">
Veranstaltungsorte
</a>
<a href="/vehicles" class="navbar-item">
Fahrzeuge
</a>
{% if user.role == Role::Admin %}
<a href="/clothing" class="navbar-item">
Anzugsordnung
</a>
{% endif %}
</div>
</div>
{% endif %}
</div>
<div class="navbar-end">
<div class="navbar-item">
angemeldet als {{ user.name }}
<div class="buttons ml-3">
<a class="button is-success is-outlined" hx-boost="true" href="/profile">
<svg class="icon">
<use href="/static/feather-sprite.svg#user" />
</svg>
<span>Profil</span>
</a>
<button id="theme-switcher" class="button">
<svg class="icon">
<use href="/static/feather-sprite.svg#moon" />
</svg>
</button>
<a href="/logout" class="button is-danger is-outlined">
<svg class="icon">
<use href="/static/feather-sprite.svg#log-out" />
</svg>
<span>Abmelden</span>
</a>
</div>
</div>
</div>
</div>
</nav>
<noscript>
<section class="section">
<div class="notification is-danger is-light">
Dein Browser unterstützt kein JavaScript oder du hast es deaktiviert. Die Funktionalität ist daher auf
nur-Lesen beschränkt.
</div>
</section>
</noscript>
<div class="notification is-hidden" id="toast">
<div id="toast-progress"></div>
<div id="toast-message"></div>
</div>
{% block content %}
{% endblock %}
{% endblock %}