fix menu again

ui/snippets/navigation/NavigationMobile.tsx

@@ -38,12 +38,19 @@ const NavigationMobile = () => {
   const openedItem = mainNavItems[openedGroupIndex];
 
   return (
-    <>
-      <Box position="relative">
+    <Flex position="relative" flexDirection="column" flexGrow={ 1 }>
       <Box
-          as={ motion.nav }
-          mt={ 6 }
+        display="flex"
+        flexDirection="column"
+        flexGrow={ 1 }
+        as={ motion.div }
         style={{ x: mainX }}
+        maxHeight={ openedGroupIndex > -1 ? '100vh' : 'unset' }
+        overflowY={ openedGroupIndex > -1 ? 'hidden' : 'unset' }
+      >
+        <Box
+          as="nav"
+          mt={ 6 }
         >
           <VStack
             w="100%"
@@ -62,18 +69,19 @@ const NavigationMobile = () => {
         </Box>
         { isAuth && (
           <Box
-            as={ motion.nav }
+            as="nav"
             mt={ 6 }
             pt={ 6 }
             borderTopWidth="1px"
             borderColor="divider"
-            style={{ x: mainX }}
           >
             <VStack as="ul" spacing="1" alignItems="flex-start">
               { accountNavItems.map((item) => <NavLink key={ item.text } item={ item }/>) }
             </VStack>
           </Box>
         ) }
+        <NavFooter hasAccount={ hasAccount }/>
+      </Box>
       { openedGroupIndex >= 0 && (
         <Box
           as={ motion.nav }
@@ -113,9 +121,7 @@ const NavigationMobile = () => {
           </Box>
         </Box>
       ) }
-      </Box>
-      <NavFooter hasAccount={ hasAccount }/>
-    </>
+    </Flex>
   );
 };