Fix toggle color schema button on desktop

src/components/core/BasicScripts.astro

@@ -14,15 +14,20 @@ const {} = Astro.props;
   }
 
   function attachEvent(selector, event, fn) {
-    const elem = document.querySelector(selector);
+    const matches = document.querySelectorAll(selector);
-    if (elem) {
+    console.log(matches);
-      elem.addEventListener(
+    if (matches && matches.length) {
-        event,
+      console.log("Hello");
-        function () {
+      matches.forEach((elem) => {
-          fn(elem);
+        console.log(elem);
-        },
+        elem.addEventListener(
-        false
+          event,
-      );
+          function () {
+            fn(elem);
+          },
+          false
+        );
+      });
     }
   }
 

src/components/widgets/Header.astro

@@ -78,7 +78,7 @@ const {} = Astro.props;
             type="button"
             class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5 inline-flex items-center"
             aria-label="Toggle between Dark and Light mode"
-            onclick="window.toggleDarkMode()"
+            data-aw-toggle-color-scheme
           >
             <IconSun />
           </button>