Feature: Welten-Navigation — Bottom-Nav+Header entfernt, Zurück-FAB (rund, dunkel), SW by-v644
This commit is contained in:
parent
860de6d2a7
commit
150776eab4
7 changed files with 33 additions and 27 deletions
|
|
@ -7635,27 +7635,35 @@ svg.empty-state-icon {
|
|||
}
|
||||
#worlds-fab:active { transform: scale(0.92); box-shadow: 0 2px 10px rgba(196,132,58,0.3); }
|
||||
|
||||
/* Back-Button */
|
||||
/* Header + Bottom-Nav: vollständig entfernt — Welten übernehmen Navigation */
|
||||
#app-header { display: none !important; }
|
||||
#bottom-nav { display: none !important; }
|
||||
|
||||
/* Zurück-FAB (gleiche Position wie worlds-fab, anderer Stil) */
|
||||
#worlds-back {
|
||||
position: fixed;
|
||||
top: 0; left: 0; right: 0;
|
||||
height: calc(env(safe-area-inset-top, 0px) + 44px);
|
||||
padding-top: env(safe-area-inset-top, 0px);
|
||||
bottom: calc(var(--safe-bottom) + 20px);
|
||||
right: 20px;
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
border-radius: 50%;
|
||||
background: rgba(20, 24, 36, 0.88);
|
||||
border: 1.5px solid rgba(255, 255, 255, 0.18);
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
z-index: 200;
|
||||
display: none;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding-left: 16px;
|
||||
background: var(--c-bg);
|
||||
border-bottom: 1px solid var(--c-border);
|
||||
z-index: 200;
|
||||
cursor: pointer;
|
||||
color: var(--c-primary);
|
||||
font-weight: 600;
|
||||
font-size: var(--text-sm);
|
||||
justify-content: center;
|
||||
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.40);
|
||||
backdrop-filter: blur(14px);
|
||||
-webkit-backdrop-filter: blur(14px);
|
||||
transition: transform 0.12s, box-shadow 0.12s;
|
||||
}
|
||||
#worlds-back.worlds-back-visible { display: flex; }
|
||||
#worlds-back:active { transform: scale(0.92); box-shadow: 0 2px 8px rgba(0,0,0,0.3); }
|
||||
|
||||
/* Hide existing header + bottom-nav when worlds are active */
|
||||
/* worlds-hidden bleibt für eventuelle andere Verwendung */
|
||||
.worlds-hidden { display: none !important; }
|
||||
|
||||
/* ── JETZT WORLD ─────────────────────────────────────────── */
|
||||
|
|
|
|||
|
|
@ -105,9 +105,9 @@
|
|||
--transition-slow: 320ms ease;
|
||||
|
||||
/* Navigation */
|
||||
--nav-bottom-height: 64px;
|
||||
--nav-bottom-height: 78px; /* Welten-Zurück-FAB: 54px + 20px bottom + 4px Abstand */
|
||||
--nav-sidebar-width: 240px;
|
||||
--header-height: 56px;
|
||||
--header-height: 0px; /* Header entfernt — Welten-Navigation übernimmt */
|
||||
|
||||
/* Safe Areas (iPhone Notch/Home Indicator) */
|
||||
--safe-top: env(safe-area-inset-top, 0px);
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@
|
|||
min-height: 0; /* iOS-Flex-Bug: ohne das scrollt body statt #page-content */
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding-top: var(--safe-top);
|
||||
padding-bottom: calc(var(--nav-bottom-height) + var(--safe-bottom) + 16px);
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -93,9 +93,9 @@
|
|||
</script>
|
||||
|
||||
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
|
||||
<link rel="stylesheet" href="/css/design-system.css?v=545">
|
||||
<link rel="stylesheet" href="/css/layout.css?v=545">
|
||||
<link rel="stylesheet" href="/css/components.css?v=643">
|
||||
<link rel="stylesheet" href="/css/design-system.css?v=644">
|
||||
<link rel="stylesheet" href="/css/layout.css?v=644">
|
||||
<link rel="stylesheet" href="/css/components.css?v=644">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -551,9 +551,8 @@
|
|||
<svg class="ph-icon" style="width:22px;height:22px"><use href="/icons/phosphor.svg#paw-print"></use></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div id="worlds-back">
|
||||
<svg class="ph-icon" style="width:18px;height:18px"><use href="/icons/phosphor.svg#arrow-left"></use></svg>
|
||||
Zurück
|
||||
<div id="worlds-back" aria-label="Zurück zur Welten-Navigation">
|
||||
<svg class="ph-icon" style="width:22px;height:22px"><use href="/icons/phosphor.svg#arrow-left"></use></svg>
|
||||
</div>
|
||||
|
||||
<!-- TOAST CONTAINER (außerhalb der App, immer sichtbar) -->
|
||||
|
|
@ -566,7 +565,7 @@
|
|||
<script src="/js/api.js?v=94"></script>
|
||||
<script src="/js/ui.js?v=94"></script>
|
||||
<script src="/js/app.js?v=94"></script>
|
||||
<script src="/js/worlds.js?v=643"></script>
|
||||
<script src="/js/worlds.js?v=644"></script>
|
||||
|
||||
<!-- Feature-Seiten werden lazy geladen -->
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
Router, State-Management, Navigation, Initialisierung.
|
||||
============================================================ */
|
||||
|
||||
const APP_VER = '643'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
const APP_VER = '644'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
|
||||
const APP_VERSION = '1.2.1'; // ← semantische Version, wird bei make release gesetzt
|
||||
const IS_STAGING = location.hostname === 'staging.banyaro.app';
|
||||
|
||||
|
|
|
|||
|
|
@ -81,8 +81,6 @@ window.Worlds = (() => {
|
|||
ov.classList.remove('worlds-visible');
|
||||
ov.style.display = 'none';
|
||||
_visible = false;
|
||||
document.getElementById('app-header')?.classList.remove('worlds-hidden');
|
||||
document.getElementById('bottom-nav')?.classList.remove('worlds-hidden');
|
||||
document.getElementById('worlds-back')?.classList.add('worlds-back-visible');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
Offline-Cache + Push Notifications + Tile-Cache
|
||||
============================================================ */
|
||||
|
||||
const CACHE_VERSION = 'by-v643';
|
||||
const CACHE_VERSION = 'by-v644';
|
||||
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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue