summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/js/theme.js19
1 files changed, 19 insertions, 0 deletions
diff --git a/src/js/theme.js b/src/js/theme.js
index 687574e..fd0b755 100644
--- a/src/js/theme.js
+++ b/src/js/theme.js
@@ -1,5 +1,7 @@
window.addEventListener('DOMContentLoaded', () => {
+ const storageTheme = window.localStorage?.getItem('theme');
const preferesDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+
let isDark = preferesDark;
const hid = document.querySelector('#hid');
@@ -8,6 +10,20 @@ window.addEventListener('DOMContentLoaded', () => {
const sidenotes = document.querySelector('.sidenotes');
const harr = document.querySelector('#harr');
+ if (storageTheme === 'dark' || storageTheme === 'light') {
+ const theme = storageTheme;
+ isDark = storageTheme === 'dark';
+ hid.classList.add(theme);
+ html.classList.add(theme);
+ aside.classList.add(theme);
+ sidenotes.classList.add(theme);
+ harr.classList.add(theme);
+
+ for (const article of document.querySelectorAll('article')) {
+ article.classList.add(theme);
+ }
+ }
+
function toogleTheme() {
const arg = isDark ? ['dark', 'light'] : ['light', 'dark'];
const theme = arg[1];
@@ -39,6 +55,9 @@ window.addEventListener('DOMContentLoaded', () => {
}
isDark = !isDark;
+ if (window.localStorage) {
+ window.localStorage.setItem('theme', isDark ? 'dark' : 'light');
+ }
}
const sun = document.querySelector('.sun');