gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-04 05:28:59 +01:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

refactor(share): reduce duplication in theme management

Browse Source
This commit is contained in:
Elian Doran 2025-10-29 18:40:31 +02:00
parent b58e1f146c
commit 1c832182d6
No known key found for this signature in database
1 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/share-theme/src/scripts/modules/theme.ts
View File

@ -1,11 +1,5 @@
const themeToLoad = getThemeToLoad(); const themeToLoad = getThemeToLoad();
if (themeToLoad === "dark") { setTheme(themeToLoad);
document.body.classList.add("theme-dark");
document.body.classList.remove("theme-light");
} else {
document.body.classList.remove("theme-dark");
document.body.classList.add("theme-light");
}
export default function setupThemeSelector() { export default function setupThemeSelector() {
const themeSwitch: HTMLInputElement = document.querySelector(".theme-selection input")!; const themeSwitch: HTMLInputElement = document.querySelector(".theme-selection input")!;
@ -16,25 +10,31 @@ export default function setupThemeSelector() {
setTimeout(() => themeSelection.classList.remove("no-transition"), 400); setTimeout(() => themeSelection.classList.remove("no-transition"), 400);
themeSwitch?.addEventListener("change", () => { themeSwitch?.addEventListener("change", () => {
if (themeSwitch.checked) { const theme = themeSwitch.checked ? "dark" : "light";
document.body.classList.add("theme-dark"); setTheme(theme);
document.body.classList.remove("theme-light"); localStorage.setItem("theme", theme);
localStorage.setItem("theme", "dark");
} else {
document.body.classList.remove("theme-dark");
document.body.classList.add("theme-light");
localStorage.setItem("theme", "light");
}
}); });
} }
function setTheme(theme: string) {
if (theme === "dark") {
document.body.classList.add("theme-dark");
document.body.classList.remove("theme-light");
} else {
document.body.classList.remove("theme-dark");
document.body.classList.add("theme-light");
}
}
function getThemeToLoad() { function getThemeToLoad() {
const storedTheme = localStorage.getItem("theme"); const storedTheme = localStorage.getItem("theme");
if (storedTheme) { if (storedTheme) {
// Respect user's choice if one has already been made. // Respect user's choice if one has already been made.
return storedTheme; return storedTheme;
} else if (window.matchMedia) { } else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
// Fallback to browser's color preference otherwise. // Fallback to browser's color preference otherwise.
return window.matchMedia('(prefers-color-scheme: dark)').matches; return "dark";
} else {
return "light";
} }
} }