Changed the dark mode icon

gsasansol · Nov 25, 2022 · 42cbbeb · 42cbbeb
1 parent 247c30b
commit 42cbbeb
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 1 deletion.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/index.html b/index.html
@@ -161,7 +161,7 @@
 
             <!--dark mode button is now outside the option class-->
             <button onclick="darkMode()" class="toggleButton">
-                <i class='fas fa-sun'></i>
+                <i class="fa-solid fa-moon fa-2x" id="dark-mode-enable"></i>
             </button>
         </nav>
 

diff --git a/index.js b/index.js
@@ -40,6 +40,16 @@ function darkMode() {
       element.style.borderRight = "2px solid white";
     }
   }
+  const toggleButton = document.getElementById("dark-mode-enable");
+
+  if(toggleButton.classList.contains("fa-moon")){
+    toggleButton.classList.remove("fa-moon");
+    toggleButton.classList.add("fa-lightbulb");
+  }
+  else{
+    toggleButton.classList.remove("fa-lightbulb");
+    toggleButton.classList.add("fa-moon");
+  }
 }
 const toggles = document.querySelectorAll(".faq-toggle");