Update visitors.js

update v1.0

js/visitors.js

@@ -30,34 +30,41 @@ document.addEventListener('DOMContentLoaded', function () {
 document.addEventListener('DOMContentLoaded', function () {
   const darkModeToggle = document.getElementById('darkModeToggle');
 
-  // Set initial mode (false for light mode, true for dark mode)
-  const isDarkMode = false;
+  // Check the saved theme in localStorage
+  const savedMode = localStorage.getItem('darkMode');
+  const isDarkMode = savedMode ? JSON.parse(savedMode) : false; // Default to false if no saved mode
 
-  // Set initial mode based on the default
+  // Set initial mode based on the saved preference
   setDarkMode(isDarkMode);
 
   // Set the initial state of the checkbox
-  darkModeToggle.checked = isDarkMode;
+  if (darkModeToggle) {
+    darkModeToggle.checked = isDarkMode;
 
-  // Toggle dark mode when the checkbox is clicked
-  darkModeToggle.addEventListener('change', function () {
-    const newMode = darkModeToggle.checked;
-    setDarkMode(newMode);
-  });
+    // Toggle dark mode when the checkbox is clicked
+    darkModeToggle.addEventListener('change', function () {
+      const newMode = darkModeToggle.checked;
+      setDarkMode(newMode);
+
+      // Save the preference in localStorage
+      localStorage.setItem('darkMode', JSON.stringify(newMode));
+    });
+  }
 });
 
 function setDarkMode(isDarkMode) {
   const body = document.body;
 
+  // Apply the dark mode or light mode class to the body element
   body.classList.toggle('dark-mode', isDarkMode);
   body.classList.toggle('light-mode', !isDarkMode);
 
-  // Apply dark mode to specific elements or containers directly
-  // For example, you can select all div elements and toggle a dark mode class
-  const allContainers = document.querySelectorAll('div'); // Adjust the selector based on your structure
+  // Apply dark mode to other containers if necessary
+  const allContainers = document.querySelectorAll('.container, .header, .footer'); // Adjust based on your needs
   allContainers.forEach(container => {
     container.classList.toggle('dark-mode', isDarkMode);
   });
-};
+}
+
 
 //const countEl=document.getElementById("CounterVisitor");function updateVisitCount(){fetch("https://api.countapi.xyz/update/mgm/visits/?amount=1").then(t=>t.json()).then(t=>{countEl.innerHTML=t.value})}updateVisitCount();