mirror of
https://github.com/zadam/trilium.git
synced 2026-01-21 05:54:33 +01:00
30 lines
1.2 KiB
TypeScript
30 lines
1.2 KiB
TypeScript
const prefersDark = localStorage.getItem("theme") === "dark" || (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
|
if (prefersDark) {
|
|
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() {
|
|
const themeSwitch: HTMLInputElement = document.querySelector(".theme-selection input")!;
|
|
|
|
const themeSelection: HTMLDivElement = document.querySelector(".theme-selection")!;
|
|
themeSelection.classList.add("no-transition");
|
|
themeSwitch.checked = prefersDark;
|
|
setTimeout(() => themeSelection.classList.remove("no-transition"), 400);
|
|
|
|
themeSwitch?.addEventListener("change", () => {
|
|
if (themeSwitch.checked) {
|
|
document.body.classList.add("theme-dark");
|
|
document.body.classList.remove("theme-light");
|
|
localStorage.setItem("theme", "dark");
|
|
} else {
|
|
document.body.classList.remove("theme-dark");
|
|
document.body.classList.add("theme-light");
|
|
localStorage.setItem("theme", "light");
|
|
}
|
|
});
|
|
}
|