nessi/cluedo-hp-webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dev #6

Merged
nessi merged 6 commits from dev into main 2026-02-07 10:12:30 +00:00
Conversation 0 Commits 6 Files Changed 5 +55 -12
2 changed files with 55 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7c4754e506 - Show all commits

47
frontend/index.html
View File

@@ -2,12 +2,48 @@
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta
name="viewport"
content="width=device-width, initial-scale=1.0"
/>
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<title>Cluedo Sheet</title> <title>Cluedo Sheet</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <!-- Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700&family=IM+Fell+English:ital@0;1&display=swap" rel="stylesheet"> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700&family=IM+Fell+English:ital@0;1&display=swap"
rel="stylesheet"
/>
<!-- Fallback Background (vor CSS/JS) -->
<style>
html {
background: #000;
}
body {
margin: 0;
background: radial-gradient(
ellipse at top,
rgba(30, 30, 30, 0.9),
#000
);
}
/* 🔒 Preload Lock */
body.preload {
opacity: 0;
}
body.ready {
opacity: 1;
transition: opacity 140ms ease;
}
</style>
<!-- Theme-Key sofort setzen (kein FOUC) -->
<script> <script>
try { try {
const k = localStorage.getItem("hpTheme:guest") || "default"; const k = localStorage.getItem("hpTheme:guest") || "default";
@@ -15,7 +51,8 @@
} catch {} } catch {}
</script> </script>
</head> </head>
<body>
<body class="preload">
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/main.jsx"></script> <script type="module" src="/src/main.jsx"></script>
</body> </body>

10
frontend/src/main.jsx
View File

@@ -4,6 +4,7 @@ import App from "./App.jsx";
import { applyTheme, DEFAULT_THEME_KEY } from "./styles/themes"; import { applyTheme, DEFAULT_THEME_KEY } from "./styles/themes";
import { registerSW } from "virtual:pwa-register"; import { registerSW } from "virtual:pwa-register";
// ✅ Theme VOR React setzen (kein Theme-Flash)
try { try {
const key = localStorage.getItem("hpTheme:guest") || DEFAULT_THEME_KEY; const key = localStorage.getItem("hpTheme:guest") || DEFAULT_THEME_KEY;
applyTheme(key); applyTheme(key);
@@ -11,12 +12,17 @@ try {
applyTheme(DEFAULT_THEME_KEY); applyTheme(DEFAULT_THEME_KEY);
} }
// ✅ Preload Unlock (nach Theme!)
document.body.classList.remove("preload");
document.body.classList.add("ready");
ReactDOM.createRoot(document.getElementById("root")).render(<App />); ReactDOM.createRoot(document.getElementById("root")).render(<App />);
registerSW({ immediate: true });
// ✅ Service Worker NUR EINMAL registrieren
const updateSW = registerSW({ const updateSW = registerSW({
immediate: true, immediate: true,
onNeedRefresh() { onNeedRefresh() {
updateSW(true); // sofort neue Version aktivieren updateSW(true);
window.location.reload(); window.location.reload();
}, },
}); });