refactor: fix inconsistent id

raexera · Sep 21, 2024 · 6d28485 · 6d28485
1 parent 3e73090
commit 6d28485
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/src/components/DrawerToggle.astro b/src/components/DrawerToggle.astro
@@ -4,7 +4,7 @@ import { cn } from "@/lib/utils";
 ---
 
 <button
-  id="drawer_toggle"
+  id="drawerToggle"
   aria-label="Toggle drawer open and closed"
   class={cn(
     "md:hidden flex size-9 p-2 rounded-full items-center justify-center",
@@ -14,35 +14,35 @@ import { cn } from "@/lib/utils";
     "transition-colors duration-300",
   )}
 >
-  <Icon id="drawer-open" name="menu" class="block size-full" />
-  <Icon id="drawer-close" name="close" class="hidden size-full" />
+  <Icon id="drawerOpen" name="menu" class="block size-full" />
+  <Icon id="drawerClose" name="close" class="hidden size-full" />
 </button>
 
 <style>
-  #drawer_toggle.open #drawer-open {
+  #drawerToggle.open #drawerOpen {
     display: none;
   }
 
-  #drawer_toggle.open #drawer-close {
+  #drawerToggle.open #drawerClose {
     display: block;
   }
 </style>
 
 <script>
   function toggleDrawer() {
     const drawer = document.getElementById("drawer");
-    const drawerButton = document.getElementById("drawer_toggle");
+    const drawerButton = document.getElementById("drawerToggle");
     drawer?.classList.toggle("open");
     drawerButton?.classList.toggle("open");
   }
 
   document
-    .getElementById("drawer_toggle")
+    .getElementById("drawerToggle")
     ?.addEventListener("click", toggleDrawer);
 
   document.addEventListener("astro:after-swap", () => {
     document
-      .getElementById("drawer_toggle")
+      .getElementById("drawerToggle")
       ?.addEventListener("click", toggleDrawer);
   });
 </script>