fix: remove dark control-bar background to fix black bar visual glitch
All checks were successful
Build & Push Docker Image to Gitea Registry / build-and-push (push) Successful in 12s

This commit is contained in:
Kroonk
2026-05-22 00:14:02 +02:00
parent 0a72e63e84
commit 6cea1d9de9
4 changed files with 5 additions and 6 deletions

View File

@@ -188,5 +188,5 @@ volumes:
- **Frontend Optimierung & Mobile Usability (Stand: 2026-05-22):**
- **PWA-Kachel Entfernung:** Die ungenutzte "PWA Installierbar"-Statistik-Kachel wurde aus der oberen Übersichtsleiste (`index.html`) entfernt. Das Layout der verbleibenden zwei Kacheln ("Online" & "Dienste") wurde in `style.css` auf ein stabiles, zentriertes 2-Spalten-Raster für Desktop und mobile Ansichten angepasst.
- **Kompakte Service-Kategoriefilter:** Die Kategorieauswahl (`.segments`) wurde aus der klebrigen (`sticky`) oberen `.control-bar` herausgelöst und in einem separaten `#categoryFilters`-Bereich direkt über dem Dienste-Grid platziert. Sie verbraucht dadurch im ungescrollten Zustand keinen kostbaren Platz mehr auf Mobilgeräten.
- **Visual-Premium Redesign:** Die Filter-Pills wurden verkleinert (Höhe von 36px auf 28px reduziert, kleinere Schriftgröße `0.78rem` und kompakteres Padding), linksbündig ausgerichtet und mit sanften Hover- & Aktiv-Transitions versehen.
- **Cache-Buster & PWA Cache Update:** Die Cache-Busting-Parameter für `style.css` und `app.js` wurden in `index.html` hochgestuft (`v=31` bzw. `v=38`). Im Service-Worker (`sw.js`) wurde der Cache-Name auf `mischlabs-pwa-v22` erhöht und die App-Shell-Liste entsprechend angepasst, um ein sofortiges Update der App bei allen Nutzern ohne manuelles Cache-Leeren zu garantieren.
- **Visual-Premium Redesign:** Die Filter-Pills wurden verkleinert (Höhe von 36px auf 28px reduziert, kleinere Schriftgröße `0.78rem` und kompakteres Padding), linksbündig ausgerichtet und mit sanften Hover- & Aktiv-Transitions versehen. Zudem wurde der fälschlicherweise hinzugefügte dunkle Hintergrundbalken auf der `.control-bar` vollständig entfernt, um den nahtlosen Backdrop-Blur-Effekt über dem globalen Farbverlauf wiederherzustellen.
- **Cache-Buster & PWA Cache Update:** Die Cache-Busting-Parameter für `style.css` und `app.js` wurden in `index.html` hochgestuft (`v=32` bzw. `v=38`). Im Service-Worker (`sw.js`) wurde der Cache-Name auf `mischlabs-pwa-v23` erhöht und die App-Shell-Liste entsprechend angepasst, um ein sofortiges Update der App bei allen Nutzern ohne manuelles Cache-Leeren zu garantieren.

View File

@@ -15,7 +15,7 @@
<link rel="icon" type="image/png" sizes="48x48" href="/icons/favicon-48-v4.png">
<link rel="icon" type="image/png" sizes="192x192" href="/icons/favicon-192-v4.png">
<link rel="apple-touch-icon" href="/icons/apple-touch-icon-v4.png">
<link rel="stylesheet" href="style.css?v=31">
<link rel="stylesheet" href="style.css?v=32">
</head>
<body>
<header class="shell hero">

View File

@@ -260,7 +260,6 @@ main {
align-items: center;
padding: 12px 0;
backdrop-filter: blur(16px);
background: rgba(10, 10, 15, 0.7);
}
.search-box {

4
sw.js
View File

@@ -1,10 +1,10 @@
const CACHE_NAME = 'mischlabs-pwa-v22';
const CACHE_NAME = 'mischlabs-pwa-v23';
const APP_SHELL = [
'/',
'/index.html',
'/favorites.html',
'/offline.html',
'/style.css?v=31',
'/style.css?v=32',
'/auth.js?v=2',
'/app.js?v=38',
'/favorites.js?v=1',