svitvojimilioni/website
1
0
Fork 0
forked from Decentrala/website
Code Pull Requests Activity

[Theme] fix persist pages

Browse Source
This commit is contained in:
coja
2026-08-09 06:53:25 +02:00
parent f6093d9876
commit 904ed7e317
5 changed files with 39 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/scripts/main.js
+36 -34
View File
@@ -1,5 +1,37 @@
window.addEventListener("DOMContentLoaded", () => {
(function () {
const theme = window.localStorage.getItem("theme");
const prefersDark = window?.matchMedia?.("(prefers-color-scheme: dark)").matches;
const isDark = theme === "dark" || (!theme && prefersDark);
if (isDark) document.documentElement.classList.add("dark");
// Swap images as soon as DOM is ready (script runs in <head>, imgs not parsed yet)
if (isDark) {
window.addEventListener("DOMContentLoaded", () => {
document.querySelectorAll("img[src*='-light']").forEach((img) => {
img.src = img.src.replace("-light", "-dark");
});
}, { once: true });
}
window.changeTheme = (toDark) => {
if (toDark) {
window.localStorage.setItem("theme", "dark");
document.documentElement.classList.add("dark");
document.querySelectorAll("img[src*='-light']").forEach((img) => {
img.src = img.src.replace("-light", "-dark");
});
} else {
window.localStorage.setItem("theme", "light");
document.documentElement.classList.remove("dark");
document.querySelectorAll("img[src*='-dark']").forEach((img) => {
img.src = img.src.replace("-dark", "-light");
});
}
}
})();
window.addEventListener("DOMContentLoaded", () => {
const getById = (id) => document.getElementById(id);
const getByClass = (className) => document.getElementsByClassName(className)[0];
@@ -7,31 +39,11 @@ window.addEventListener("DOMContentLoaded", () => {
const hamburger = getByClass("hamburger");
const hamburgerIcon = hamburger?.children[0];
const menu = document.getElementsByTagName("nav")[0];
const imgs = document.getElementsByTagName("img");
const main = document.getElementsByTagName("main")[0];
const isMenuOpen = () => hamburger?.classList.contains("open");
const theme = window.localStorage.getItem("theme");
/* Functions */
const changeToDarkTheme = () => {
window.localStorage.setItem("theme", "dark");
document.documentElement.classList.add("dark");
themeBtn?.setAttribute("title", "turn the light on");
Array.from(imgs).forEach((img) => {
if (img.src.includes("-light")) img.src = img.src.replace("-light", "-dark");
});
}
const changeToLightTheme = () => {
window.localStorage.setItem("theme", "light");
document.documentElement.classList.remove("dark");
themeBtn?.setAttribute("title", "turn the light off");
Array.from(imgs).forEach((img) => {
if (img.src.includes("-dark")) img.src = img.src.replace("-dark", "-light");
});
}
const closeMenu = () => {
hamburger.classList = "hamburger closed"
hamburgerIcon.src = hamburgerIcon.src.replace("opened", "closed");
@@ -73,18 +85,8 @@ window.addEventListener("DOMContentLoaded", () => {
if (themeBtn) {
themeBtn.addEventListener("click", () => {
const title = themeBtn.getAttribute("title") ?? "off"
if (title.indexOf("off") !== -1) changeToDarkTheme();
else changeToLightTheme();
const isDark = document.documentElement.classList.contains("dark");
changeTheme(!isDark);
});
}
/* Rest */
const userPerfersDark = window?.matchMedia?.("(prefers-color-scheme: dark)").matches
if (themeBtn) {
if (!theme && userPerfersDark) changeToDarkTheme();
else if (theme === "light") changeToLightTheme();
else if (!theme && !userPerfersDark) changeToDarkTheme();
}
})
});