52 lines
1.9 KiB
HTML
52 lines
1.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#111827" />
|
|
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#f1f5f9" />
|
|
<title>Kickern</title>
|
|
<script>
|
|
// Apply the saved theme (light/dark/auto) before first paint to avoid a flash
|
|
// of the wrong theme. Mirrors src/stores/themeStore.ts.
|
|
(function () {
|
|
try {
|
|
var stored = localStorage.getItem("theme");
|
|
var mode =
|
|
stored === "light" || stored === "dark" || stored === "auto"
|
|
? stored
|
|
: "auto";
|
|
var dark =
|
|
mode === "dark" ||
|
|
(mode === "auto" &&
|
|
window.matchMedia("(prefers-color-scheme: dark)").matches);
|
|
var root = document.documentElement;
|
|
root.classList.toggle("dark", dark);
|
|
root.style.colorScheme = dark ? "dark" : "light";
|
|
|
|
var accent = localStorage.getItem("accent");
|
|
if (accent && /^#[0-9a-fA-F]{6}$/.test(accent)) {
|
|
var hex = accent.slice(1);
|
|
var r = parseInt(hex.slice(0, 2), 16) / 255;
|
|
var g = parseInt(hex.slice(2, 4), 16) / 255;
|
|
var b = parseInt(hex.slice(4, 6), 16) / 255;
|
|
var lin = function (c) {
|
|
return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
|
|
};
|
|
var lum = 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);
|
|
root.style.setProperty("--c-accent", accent);
|
|
root.style.setProperty("--c-accent-contrast", lum > 0.45 ? "#0b1220" : "#ffffff");
|
|
}
|
|
} catch (e) {
|
|
/* ignore */
|
|
}
|
|
})();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/index.tsx"></script>
|
|
</body>
|
|
</html>
|