diff options
Diffstat (limited to 'src/scripts')
-rw-r--r-- | src/scripts/darktheme.js | 35 |
1 files changed, 16 insertions, 19 deletions
diff --git a/src/scripts/darktheme.js b/src/scripts/darktheme.js index a06aca2..66a3194 100644 --- a/src/scripts/darktheme.js +++ b/src/scripts/darktheme.js @@ -1,27 +1,24 @@ -// Get the theme toggle input -const currentTheme = localStorage.getItem("theme"); // If the current local storage item can be found +const theme = localStorage.getItem("theme"); +var isDark = false; -if (window.matchMedia - && window.matchMedia("(prefers-color-scheme: dark)").matches - && !localStorage.getItem("theme")) { - localStorage.setItem("theme", "dark"); +if (theme) { + setTheme(theme === "dark"); +} else if (window.matchMedia + && window.matchMedia("(prefers-color-scheme: dark)").matches) { + setTheme(true); } -// Function that will switch the theme based on the if the theme toggle is checked or not -function switchTheme() { - if (document.body.classList.contains('dark-mode')) { - document.body.classList.remove("dark-mode"); - localStorage.setItem("theme", "light"); - } else { +function setTheme(dark) { + if (dark) { document.body.classList.add("dark-mode"); localStorage.setItem("theme", "dark"); + } else { + document.body.classList.remove("dark-mode"); + localStorage.setItem("theme", "light"); } + isDark = dark; } -// Get the current theme from local storage -if (currentTheme === "dark") { - document.body.classList.add("dark-mode"); - localStorage.setItem("theme", "dark"); -} else { - document.body.classList.remove("dark-mode"); - localStorage.setItem("theme", "light"); + +function switchTheme() { + setTheme(!isDark); } |