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

- #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

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 */