fix: Navbar2 bugs (#490)

* fix: submenu and not clickable * fix: not scrollable * fix: suggestions * fix: prettier
decentraland · Jan 11, 2024 · 3ff706d · 3ff706d · vercel · Jan 11, 2024
1 parent e033fc6
commit 3ff706d
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 1 deletion.
diff --git a/src/components/Navbar2/Navbar2.css b/src/components/Navbar2/Navbar2.css
@@ -436,6 +436,10 @@
   .dui-navbar2 .item.submenu .submenu-column__wrapper {
     flex-flow: row wrap;
   }
+
+  .dui-navbar2 .item.submenu::after {
+    content: none;
+  }
 }
 
 @media (max-width: 1199px) {
@@ -576,4 +580,8 @@
   .dui-navbar2.dui-navbar2__mobile-open .item.submenu .dui-submenu-item p {
     color: var(--navbar-menu-hover);
   }
+
+  .dui-navbar2 .item.submenu {
+    position: fixed;
+  }
 }
diff --git a/src/components/Navbar2/Navbar2.tsx b/src/components/Navbar2/Navbar2.tsx
@@ -43,7 +43,12 @@ export const Navbar2 = React.memo((props: Navbar2Props) => {
 
   const handleMobileToggle = useCallback(
     (e: React.MouseEvent, show: boolean) => {
-      !show && setToggle(false)
+      if (!show) {
+        setToggle(false)
+        window.removeEventListener('scroll', noScroll)
+      } else {
+        window.addEventListener('scroll', noScroll)
+      }
       setMenuMobileOpen(show)
     },
     [setToggle, setMenuMobileOpen]
@@ -129,3 +134,7 @@ export const Navbar2 = React.memo((props: Navbar2Props) => {
     </div>
   )
 })
+
+function noScroll() {
+  window.scrollTo(0, 0)
+}