fix(mobile-menu): fixes rendering of menu on mobile devices

stjudecloud · Feb 7, 2021 · c2b1dee · c2b1dee · github-actions · Feb 7, 2021
1 parent cc0704a
commit c2b1dee
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/src/components/docs/sidebars/content-sidebar-left/content-menu.js b/src/components/docs/sidebars/content-sidebar-left/content-menu.js
@@ -17,11 +17,13 @@ const ContentsMenu = ({
     <div
       id="contents-sidebar-left"
       className={
-        (isMobileMenuOpen ? "" : "invisible ") +
-        "xl:visible z-30 contents-sidebar fixed bg-coolGray-50 min-h-screen border-r border-coolGray-100 border-solid w-full xl:w-320"
+        !isMobileMenuOpen
+          ? "invisible "
+          : "visible " +
+            "xl:visible z-30 contents-sidebar fixed bg-coolGray-50 min-h-screen border-r border-coolGray-100 border-solid w-full xl:w-320"
       }
     >
-      <div id="mobile-menu-button" className="absolute inset-0">
+      <div id="mobile-menu" className="absolute inset-0 cursor-pointer">
         <div
           className="xl:hidden pointer-cursor my-4 mx-4"
           onClick={closeMobileMenu}

diff --git a/src/components/docs/sidebars/content-sidebar-left/index.js b/src/components/docs/sidebars/content-sidebar-left/index.js
@@ -44,8 +44,12 @@ const ContentsSidebarLeft = ({
         />
       </div>
       <ContentsMenu
-        closeMobileMenu={closeMobileMenu}
+        closeMobileMenu={() => {
+          setIsModuleSelectorMousedOver(false)
+          closeMobileMenu()
+        }}
         CurrentIconImported={currentIconImported}
+        isMobileMenuOpen={isMobileMenuOpen}
         currentTitle={currentTitle}
         currentChapters={currentChapters}
         currentPathBeingViewed={currentPathBeingViewed}