30 lines
1.2 KiB
JavaScript
30 lines
1.2 KiB
JavaScript
// theme.js — toggle UI wire-up. The initial theme is set by a tiny inline
|
|
// script in the <head> so there's no flash of the wrong palette on load;
|
|
// this module only handles click-to-toggle + broadcasting the change so
|
|
// anything that cached a CSS-var value (e.g. the metrics page's plot
|
|
// palette) can re-render.
|
|
|
|
(function () {
|
|
function current() {
|
|
return document.documentElement.getAttribute("data-theme") || "light";
|
|
}
|
|
function apply(theme) {
|
|
document.documentElement.setAttribute("data-theme", theme);
|
|
try { localStorage.setItem("theme", theme); } catch (e) {}
|
|
document.dispatchEvent(new CustomEvent("themechange", { detail: { theme } }));
|
|
const btn = document.getElementById("theme-toggle");
|
|
if (btn) btn.setAttribute("aria-label", theme === "dark" ? "switch to light mode" : "switch to dark mode");
|
|
}
|
|
function wire() {
|
|
const btn = document.getElementById("theme-toggle");
|
|
if (!btn) return;
|
|
btn.addEventListener("click", () => apply(current() === "dark" ? "light" : "dark"));
|
|
apply(current());
|
|
}
|
|
if (document.readyState === "loading") {
|
|
document.addEventListener("DOMContentLoaded", wire);
|
|
} else {
|
|
wire();
|
|
}
|
|
})();
|