diff --git a/frontend/index.html b/frontend/index.html index 3ff78dc..b924493 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -14,7 +14,6 @@ rel="stylesheet" /> - @@ -66,9 +168,13 @@ - -
-
Zauber-Detektiv Notizbogen
+
diff --git a/frontend/src/main.jsx b/frontend/src/main.jsx index 58ec495..c0a0bc2 100644 --- a/frontend/src/main.jsx +++ b/frontend/src/main.jsx @@ -5,7 +5,7 @@ import { applyTheme, DEFAULT_THEME_KEY } from "./styles/themes"; import { registerSW } from "virtual:pwa-register"; async function bootstrap() { - // ✅ Theme sofort setzen + // Theme sofort setzen try { const key = localStorage.getItem("hpTheme:guest") || DEFAULT_THEME_KEY; applyTheme(key); @@ -13,29 +13,37 @@ async function bootstrap() { applyTheme(DEFAULT_THEME_KEY); } - // ✅ Fonts abwarten (kein Layout-Jump) + // Fonts abwarten (verhindert Layout-Sprung) try { if (document.fonts?.ready) { await document.fonts.ready; } } catch {} - // React rendern + // App rendern ReactDOM.createRoot(document.getElementById("root")).render(); - // ✅ Splash sauber ausblenden (KEIN Schwarz) - const splash = document.getElementById("app-splash"); - if (splash) { - requestAnimationFrame(() => splash.classList.add("hide")); - setTimeout(() => splash.remove(), 220); - } + // Splash mind. 3 Sekunden anzeigen (3000ms) + const MIN_SPLASH_MS = 3000; + const tStart = performance.now(); - // ✅ Service Worker ohne Reload-Flash + const hideSplash = () => { + const splash = document.getElementById("app-splash"); + if (!splash) return; + splash.classList.add("hide"); + setTimeout(() => splash.remove(), 320); + }; + + const elapsed = performance.now() - tStart; + const remaining = Math.max(0, MIN_SPLASH_MS - elapsed); + setTimeout(hideSplash, remaining); + + // Service Worker ohne Auto-Reload-Flash registerSW({ immediate: true, onNeedRefresh() { console.info("Neue Version verfügbar"); - // später Toast möglich + // optional: später Toast "Update verfügbar" }, }); }