nessi
7c4754e506
Added a fallback background and a preload lock for smoother loading transitions. Improved theme application by applying it prior to React rendering and removed theme flash. Adjusted Service Worker registration for better performance and reliability."
60 lines
1.4 KiB
HTML
60 lines
1.4 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1.0"
|
|
/>
|
|
<meta name="theme-color" content="#000000" />
|
|
<title>Cluedo Sheet</title>
|
|
|
|
<!-- Fonts -->
|
|
<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>
|
|
try {
|
|
const k = localStorage.getItem("hpTheme:guest") || "default";
|
|
document.documentElement.setAttribute("data-theme", k);
|
|
} catch {}
|
|
</script>
|
|
</head>
|
|
|
|
<body class="preload">
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.jsx"></script>
|
|
</body>
|
|
</html>
|