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

Fix: Nav zentriert (mobile) + Desktop Nav unten zwischen Chips und Footer

Browse source 
- #world-labels: right:80px→right:0 (Nav war durch halbe Breite nach links versetzt)
- @media 768px: Nav bleibt unten statt zurück nach oben — Chips+Nav+Footer
  gleiches Layout wie Mobile, nur top-padding 48px und chip-grid max-width 480px
- components.css ?v=1005, SW by-v1006, APP_VER 1006
This commit is contained in:
rene 2026-05-16 09:02:41 +02:00
parent ad942e81b2
commit c29b2c1752
5 changed files with 20 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

51
backend/static/css/components.css
View file

@ -7886,7 +7886,7 @@ svg.empty-state-icon {
position: fixed;
bottom: calc(env(safe-area-inset-bottom, 0px) + 20px);
top: auto;
left: 0; right: 80px; /* Platz für FAB rechts */
left: 0; right: 0;
display: flex;
justify-content: center;
gap: 8px;
@ -7912,47 +7912,28 @@ svg.empty-state-icon {
}
@media (min-width: 768px) {
/* Desktop: Nav wieder oben, Dots wieder sichtbar */
#world-dots {
display: flex;
top: calc(env(safe-area-inset-top, 0px) + 14px);
bottom: auto;
}
#world-labels {
bottom: auto;
top: calc(env(safe-area-inset-top, 0px) + 28px);
right: 0;
gap: 40px;
}
.wlabel {
font-size: 13px;
letter-spacing: 0.18em;
opacity: 0.55;
padding: 6px 14px;
border-radius: 20px;
text-shadow: 0 1px 6px rgba(0,0,0,0.7);
}
.wlabel:hover {
opacity: 0.85;
background: rgba(255, 255, 255, 0.12);
}
.wlabel.active {
opacity: 1;
background: rgba(255, 255, 255, 0.18);
text-shadow: 0 1px 8px rgba(0,0,0,0.5);
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
/* Desktop: Top-Padding wiederherstellen (Nav ist oben) */
/* Desktop: Nav bleibt unten — nur Abstände anpassen */
.world-panel {
padding-top: calc(env(safe-area-inset-top, 0px) + 58px);
padding-top: calc(env(safe-area-inset-top, 0px) + 48px);
}
/* Desktop: Chips nicht als Full-Width Bottom-Bar */
.world-chips-grid {
max-width: 480px;
margin-left: auto;
margin-right: auto;
}
#world-labels {
gap: 24px;
bottom: calc(env(safe-area-inset-bottom, 0px) + 22px);
}
.wlabel {
font-size: 12px;
letter-spacing: 0.14em;
padding: 7px 18px;
}
.wlabel:hover {
opacity: 0.85;
background: rgba(255, 255, 255, 0.12);
}
}
/* Settings-Button */

2
backend/static/index.html
View file

@ -103,7 +103,7 @@
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
<link rel="stylesheet" href="/css/design-system.css?v=907">
<link rel="stylesheet" href="/css/layout.css?v=973">
<link rel="stylesheet" href="/css/components.css?v=1004">
<link rel="stylesheet" href="/css/components.css?v=1005">
</head>
<body>

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '1005'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '1006'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt
const IS_STAGING = location.hostname === 'staging.banyaro.app';
// Cache-Bust-Parameter nach Update-Reload sofort entfernen

2
backend/static/sw.js
View file

@ -3,7 +3,7 @@
Offline-Cache + Push Notifications + Tile-Cache
============================================================ */
const CACHE_VERSION = 'by-v1005';
const CACHE_VERSION = 'by-v1006';
const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache