Navigation, Karten-FABs, Nearby-Alerts
- Bottom-Nav neu: Karte | Routen | + | Tagebuch | Forum - + reduziert auf: Giftköder, Gassi-Treffen, Verlorener Hund - Notification-Badge auf User-Avatar (Header) - Nearby-Alerts: Nav-Leiste pulsiert rot/orange bei Giftköder/vermisstm Hund in 20km - SW postMessage bei poison/lost_alert → sofortiger Alert-Check - Karten-FABs: nur Marker setzen + Standort (Route aufzeichnen + Offline entfernt) - SW by-v272, APP_VER 262
This commit is contained in:
parent
5141ba9969
commit
65d1cf6c7f
7 changed files with 105 additions and 27 deletions
|
|
@ -168,6 +168,11 @@
|
|||
style="width:18px;height:18px;color:var(--c-text-muted)">
|
||||
<use href="/icons/phosphor.svg#user"></use>
|
||||
</svg>
|
||||
<span id="notif-nav-badge" class="hidden"
|
||||
style="position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;
|
||||
border-radius:8px;background:var(--c-danger);color:#fff;font-size:10px;
|
||||
font-weight:700;line-height:16px;text-align:center;padding:0 3px;
|
||||
pointer-events:none;z-index:1"></span>
|
||||
</button>
|
||||
<button class="header-menu-btn" id="header-menu-btn" aria-label="Menü"><svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#list"></use></svg></button>
|
||||
</header>
|
||||
|
|
@ -290,9 +295,9 @@
|
|||
|
||||
<!-- MOBILE BOTTOM NAVIGATION -->
|
||||
<nav id="bottom-nav" role="navigation" aria-label="Hauptnavigation">
|
||||
<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 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>
|
||||
|
|
@ -302,17 +307,14 @@
|
|||
<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>
|
||||
<div class="nav-item" data-page="notifications">
|
||||
<span style="position:relative;display:inline-flex">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#bell"></use></svg>
|
||||
<span class="nav-badge hidden" id="notif-nav-badge">0</span>
|
||||
</span>
|
||||
<span class="nav-item-label">Aktuelles</span>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
</div><!-- #app -->
|
||||
|
|
@ -376,6 +378,11 @@
|
|||
navigator.serviceWorker.addEventListener('controllerchange', () => {
|
||||
window.location.reload();
|
||||
});
|
||||
navigator.serviceWorker.addEventListener('message', e => {
|
||||
if (e.data?.type === 'CHECK_NEARBY_ALERTS') {
|
||||
window.App?._checkNearbyAlerts?.();
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue