diff options
author | adam <56338480+adastx@users.noreply.github.com> | 2022-08-28 11:09:28 +0200 |
---|---|---|
committer | adam <56338480+adastx@users.noreply.github.com> | 2022-08-28 11:24:26 +0200 |
commit | 7c366e26ffcb31e04b8d64a8ceb2849da4faecf9 (patch) | |
tree | b2ded82b3e4d83f907db6160344341470bef864b | |
parent | e53d889a149f8b85320db2cc71bdd63100e1268a (diff) |
Simplified darktheme.js
-rw-r--r-- | dst/.files | 5 | ||||
-rw-r--r-- | dst/scripts/darktheme.js | 35 | ||||
-rw-r--r-- | src/scripts/darktheme.js | 35 |
3 files changed, 32 insertions, 43 deletions
@@ -1,6 +1 @@ -./styles/style.css ./scripts/darktheme.js -./game.md -./index.md -./ase.md -./spo.md diff --git a/dst/scripts/darktheme.js b/dst/scripts/darktheme.js index a06aca2..66a3194 100644 --- a/dst/scripts/darktheme.js +++ b/dst/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); } 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); } |