55 lines
1.8 KiB
JavaScript
55 lines
1.8 KiB
JavaScript
(function () {
|
|
// Get the default theme from the HTML data-theme attribute.
|
|
const defaultTheme = document.documentElement.getAttribute("data-theme");
|
|
|
|
// Set the data-default-theme attribute only if defaultTheme is not null.
|
|
if (defaultTheme) {
|
|
document.documentElement.setAttribute("data-default-theme", defaultTheme);
|
|
}
|
|
|
|
// Attempt to retrieve the current theme from the browser's local storage.
|
|
const storedTheme = localStorage.getItem("theme");
|
|
|
|
if (storedTheme && storedTheme !== "system") {
|
|
document.documentElement.setAttribute("data-theme", storedTheme);
|
|
} else if (defaultTheme && storedTheme !== "system") {
|
|
document.documentElement.setAttribute("data-theme", defaultTheme);
|
|
} else {
|
|
// If no theme is found in local storage and no default theme is set, CSS handles the theme.
|
|
document.documentElement.removeAttribute("data-theme");
|
|
}
|
|
})();
|
|
|
|
const defaultTheme = document.documentElement.getAttribute("data-default-theme");
|
|
|
|
function setTheme(theme, saveToLocalStorage = false) {
|
|
if (theme === "system") {
|
|
document.documentElement.removeAttribute("data-theme");
|
|
} else {
|
|
document.documentElement.setAttribute("data-theme", theme);
|
|
}
|
|
|
|
if (saveToLocalStorage) {
|
|
localStorage.setItem("theme", theme);
|
|
} else {
|
|
localStorage.removeItem("theme");
|
|
}
|
|
|
|
// Dispatch a custom event for comment systems.
|
|
window.dispatchEvent(new CustomEvent("themeChanged", { detail: { theme } }));
|
|
}
|
|
|
|
function resetTheme() {
|
|
// Reset the theme to the default or system preference if no default is set.
|
|
setTheme(defaultTheme || "system");
|
|
}
|
|
|
|
// Functions connected to buttons via `onclick` attributes.
|
|
function switchTheme(theme) {
|
|
if (theme === "system") {
|
|
resetTheme();
|
|
} else {
|
|
setTheme(theme, true);
|
|
}
|
|
}
|