Spark
2290560627
Le bouton Recherche & commandes devient une icône 🔍 seule à
droite du titre (sous le logo en rail replié). Les groupes
deviennent des accordéons: chevron animé, transition douce,
sections fermées mémorisées (appliquées avant le rendu), section
de la page courante toujours ouverte; rail replié = icônes.
97 lines
4.6 KiB
HTML
97 lines
4.6 KiB
HTML
{# ── Cadre applicatif partagé (issue #16, refonte 0.16.0) ─────────
|
|
Barre latérale unique pour TOUTES les pages applicatives :
|
|
desktop = barre fixe repliable en rail d'icônes (état mémorisé),
|
|
mobile = tiroir hors-canvas ouvert par le burger de la topbar.
|
|
NE PAS dupliquer ce markup dans les pages.
|
|
Page active : `active_nav` (déduite du gabarit dans render()).
|
|
Fil d'Ariane : `owner`+`repo` (board) ou `full_name` (projet).
|
|
Le wallboard (TV) n'inclut pas ce partiel, volontairement. #}
|
|
<script>
|
|
document.body.classList.add('with-sidebar');
|
|
try {
|
|
if (localStorage.getItem('kanbante-sidebar') === 'collapsed') {
|
|
document.body.classList.add('sidebar-collapsed');
|
|
}
|
|
JSON.parse(localStorage.getItem('kanbante-nav-closed') || '[]')
|
|
.forEach(function (k) {
|
|
document.body.classList.add('nav-closed-' + k);
|
|
});
|
|
} catch (e) { /* stockage indisponible : état par défaut */ }
|
|
</script>
|
|
{% set nav_groups = [
|
|
("principal", "Principal", [
|
|
("home", "/", "🏠", "Projets"),
|
|
("focus", "/focus", "🎯", "Focus"),
|
|
("today", "/today", "🌅", "Aujourd'hui"),
|
|
("my", "/my", "👤", "Mes issues"),
|
|
]),
|
|
("rituels", "Rituels", [
|
|
("briefing", "/briefing", "📊", "Briefing"),
|
|
("standup", "/standup", "🗣️", "Standup"),
|
|
("digest", "/digest", "🧠", "Digest"),
|
|
]),
|
|
("pilotage", "Pilotage", [
|
|
("forecast", "/forecast", "🔮", "Prévisions"),
|
|
("health", "/health", "🩺", "Santé"),
|
|
("rules", "/rules", "⚙️", "Règles"),
|
|
("activity", "/activity", "📰", "Activité"),
|
|
]),
|
|
("outils", "Outils", [
|
|
("search", "/search", "🔍", "Recherche"),
|
|
("capture", "/capture", "⚡", "Capture"),
|
|
("wall", "/wall", "🖥️", "Wallboard"),
|
|
]),
|
|
] %}
|
|
<aside class="sidebar" id="sidebar" aria-label="Navigation principale">
|
|
<div class="side-head">
|
|
<a href="/" class="side-logo" aria-label="Kanbante — accueil">
|
|
<span class="logo-mark">📋</span>
|
|
<span class="side-label gradient-text">Kanbante</span>
|
|
</a>
|
|
<button type="button" class="side-search palette-trigger" title="Recherche & commandes (Ctrl+K)" aria-label="Recherche et commandes (Ctrl+K)">🔍</button>
|
|
</div>
|
|
<nav class="side-nav">
|
|
{% for gkey, group, links in nav_groups %}
|
|
<div class="side-section" data-group="{{ gkey }}">
|
|
<button type="button" class="side-group-btn" data-group-btn="{{ gkey }}" aria-expanded="true">
|
|
<span>{{ group }}</span>
|
|
<span class="side-chevron" aria-hidden="true">▾</span>
|
|
</button>
|
|
<div class="side-acc">
|
|
<div class="side-acc-inner">
|
|
{% for key, href, icon, label in links %}
|
|
<a href="{{ href }}" class="side-link{% if active_nav == key %} active{% endif %}" title="{{ label }}">
|
|
<span class="side-ico">{{ icon }}</span>
|
|
<span class="side-label">{{ label }}</span>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</nav>
|
|
<div class="side-foot">
|
|
<button type="button" class="side-collapse" id="side-collapse" aria-label="Replier ou déplier le menu">
|
|
<span class="side-collapse-ico">«</span>
|
|
<span class="side-label">Replier</span>
|
|
</button>
|
|
<span class="side-version side-label">v{{ version }}</span>
|
|
</div>
|
|
</aside>
|
|
<div class="side-backdrop" id="side-backdrop" hidden></div>
|
|
<header class="app-header topbar">
|
|
<button type="button" class="nav-burger" id="nav-burger" aria-expanded="false" aria-controls="sidebar" aria-label="Ouvrir le menu">☰</button>
|
|
{% if owner is defined and repo is defined %}
|
|
<span class="crumb"><a href="/board/{{ owner }}/{{ repo }}">{{ owner }} / <strong>{{ repo }}</strong></a></span>
|
|
{% elif full_name is defined %}
|
|
<span class="crumb"><a href="/board/{{ full_name }}">{{ full_name }}</a></span>
|
|
{% endif %}
|
|
<div class="header-actions">
|
|
{% if repo_info is defined and repo_info and repo_info.html_url %}
|
|
<a href="{{ repo_info.html_url }}" target="_blank" rel="noopener" class="nav-pill" title="Ouvrir ce dépôt dans Gitea">🔗 Gitea ↗</a>
|
|
{% endif %}
|
|
<button type="button" class="nav-pill palette-trigger topbar-search" title="Recherche et commandes (Ctrl+K)">🔍</button>
|
|
</div>
|
|
<script src="/static/js/nav.js" defer></script>
|
|
</header>
|