update ul on navbar

hicsail · May 8, 2024 · 7c3830f · 7c3830f
1 parent 7f906e2
commit 7c3830f
Showing 1 changed file with 8 additions and 19 deletions.
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -27,11 +27,7 @@ const Navbar = () => {
 
   useEffect(() => {
     const closeDropdown = (e: MouseEvent) => {
-      if (
-        open &&
-        !document.querySelector("#navbar-dropdown")?.contains(e.target as Node)
-      )
-        setOpen(false);
+      if (open && !document.querySelector("#navbar-dropdown")?.contains(e.target as Node)) setOpen(false);
     };
 
     document.addEventListener("mousedown", closeDropdown);
@@ -46,12 +42,7 @@ const Navbar = () => {
       <div className="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
         <Link to="/">
           {/* <h1 className="font-bold text-4xl dark:text-gray-800">CYCM</h1> */}
-          <img
-            src="/cycm-logo.svg"
-            alt="CYCM"
-            className="h-12 w-auto px-4 py-2"
-            loading="lazy"
-          />
+          <img src="/cycm-logo.svg" alt="CYCM" className="h-12 w-auto px-4 py-2" loading="lazy" />
         </Link>
         <button
           data-collapse-toggle="navbar-dropdown"
@@ -88,15 +79,13 @@ const Navbar = () => {
             )}
           </svg>
         </button>
-        <div
-          className={`w-full md:block md:w-auto ${!mobileOpen && "hidden"}`}
-          id="navbar-dropdown"
-        >
-          <ul className="flex flex-col font-medium mt-4 md:items-center md:p-0 md:flex-row md:space-x-8 md:mt-0 md:border-0 md:bg-white">
+        <div className={`w-full md:block md:w-auto ${!mobileOpen && "hidden"}`} id="navbar-dropdown">
+          <ul
+            className="flex flex-col font-medium mt-4 md:items-center md:p-0 md:flex-row md:space-x-8 md:mt-0 md:border-0 md:bg-white"
+            style={{ listStyle: "none", margin: 0, padding: 0 }}
+          >
             {navigation.map((item) => {
-              const color = location.pathname.includes(item.href)
-                ? "bg-orange-400"
-                : "bg-orange-600";
+              const color = location.pathname.includes(item.href) ? "bg-orange-400" : "bg-orange-600";
 
               return (
                 <li key={item.name}>