Added option to toggle dark mode

1 files changed, 27 insertions, 0 deletions

diff --git a/src/scripts/darktheme.js b/src/scripts/darktheme.js
new file mode 100644
index 0000000..a06aca2
--- /dev/null
+++ b/src/scripts/darktheme.js
@@ -0,0 +1,27 @@
+// Get the theme toggle input
+const currentTheme = localStorage.getItem("theme"); // If the current local storage item can be found
+
+if (window.matchMedia
+    && window.matchMedia("(prefers-color-scheme: dark)").matches
+    && !localStorage.getItem("theme")) {
+    localStorage.setItem("theme", "dark");
+}
+
+// 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 {
+        document.body.classList.add("dark-mode");
+        localStorage.setItem("theme", "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");
+}