Fix: Bottom-Nav z-index 300→700 (über Leaflet), Routen-Buttons auf refresh() aktualisiert

This commit is contained in:
rene 2026-04-19 12:25:33 +02:00
parent 79e88b43ca
commit 4030da3776
3 changed files with 30 additions and 3 deletions

View file

@ -164,7 +164,7 @@
bottom: 0;
left: 0;
right: 0;
z-index: 300;
z-index: 700; /* über Leaflet-Panes (~400) */
min-height: calc(var(--nav-bottom-height) + var(--safe-bottom));
padding-top: var(--space-1);
padding-bottom: calc(var(--safe-bottom) + var(--space-1));

View file

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

View file

@ -64,7 +64,34 @@ window.Page_routes = (() => {
}
}
function refresh() { _syncRecBtn(); _loadData(); }
function refresh() {
// Button-Zeile neu rendern damit style-Änderungen nach einem JS-Update sichtbar werden
const btnRow = document.querySelector('#rk-filter-btn')?.parentElement;
if (btnRow) {
btnRow.innerHTML = `
<button id="rk-filter-btn" style="${_btnStyle()}position:relative">
${UI.icon('funnel')} Filter
<span class="rk-filter-badge" id="rk-filter-badge" style="display:none"></span>
</button>
<label id="rk-imp-wrap" title="GPX / KML / TCX importieren" style="${_btnStyle()}cursor:pointer">
${UI.icon('download-simple')} Import
<input type="file" id="rk-import-input" accept=".gpx,.kml,.tcx" style="display:none">
</label>
<button class="rk-rec-btn" id="rk-rec-btn" style="${_btnStyle(true)}">${UI.icon('path')} Aufzeichnen</button>
`;
document.getElementById('rk-filter-btn').addEventListener('click', _toggleFilterPanel);
document.getElementById('rk-rec-btn').addEventListener('click', () => {
if (window.Page_map?.isRecording?.()) { window.Page_map.stopRecording(); _syncRecBtn(); }
else { App.navigate('map'); setTimeout(() => window.Page_map?.startRecording?.(), 600); }
});
document.getElementById('rk-import-input').addEventListener('change', e => {
const file = e.target.files?.[0]; if (file) _importFile(file); e.target.value = '';
});
_updateFilterBadge();
}
_syncRecBtn();
_loadData();
}
function onDogChange() {}
// ----------------------------------------------------------