rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix: Nav als Flex-Kind in #app{height:100dvh} — kein position:fixed, Desktop-Scroll repariert, SW by-v534

Browse source
This commit is contained in:
rene 2026-04-30 08:52:39 +02:00
parent 03508f8aa3
commit 9506eea0d9
4 changed files with 49 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

47
backend/static/index.html
View file

@ -434,33 +434,32 @@
</main>
<!-- MOBILE BOTTOM NAVIGATION — Flex-Kind von #app (height:100dvh) -->
<nav id="bottom-nav" role="navigation" aria-label="Hauptnavigation">
<div class="nav-item" data-page="map">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#map-trifold"></use></svg>
<span class="nav-item-label">Karte</span>
</div>
<div class="nav-item" data-page="routes">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#path"></use></svg>
<span class="nav-item-label">Routen</span>
</div>
<!-- Mittlerer + Button -->
<div class="nav-item nav-item-center" id="nav-add">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#plus"></use></svg>
</div>
<div class="nav-item active" data-page="diary">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#book-open"></use></svg>
<span class="nav-item-label">Tagebuch</span>
</div>
<div class="nav-item" data-page="forum">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#push-pin"></use></svg>
<span class="nav-item-label">Forum</span>
</div>
</nav>
</div><!-- #app -->
<!-- MOBILE BOTTOM NAVIGATION — außerhalb #app damit position:fixed zum echten Viewport -->
<nav id="bottom-nav" role="navigation" aria-label="Hauptnavigation">
<div class="nav-item" data-page="map">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#map-trifold"></use></svg>
<span class="nav-item-label">Karte</span>
</div>
<div class="nav-item" data-page="routes">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#path"></use></svg>
<span class="nav-item-label">Routen</span>
</div>
<!-- Mittlerer + Button -->
<div class="nav-item nav-item-center" id="nav-add">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#plus"></use></svg>
</div>
<div class="nav-item active" data-page="diary">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#book-open"></use></svg>
<span class="nav-item-label">Tagebuch</span>
</div>
<div class="nav-item" data-page="forum">
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#push-pin"></use></svg>
<span class="nav-item-label">Forum</span>
</div>
</nav>
<!-- TOAST CONTAINER (außerhalb der App, immer sichtbar) -->
<div class="toast-container" id="toast-container" role="alert" aria-live="polite"></div>