diff --git a/apps/pyconkr/src/components/layout/Header/Mobile/MobileNavigation.tsx b/apps/pyconkr/src/components/layout/Header/Mobile/MobileNavigation.tsx index 860f474..2729ed2 100644 --- a/apps/pyconkr/src/components/layout/Header/Mobile/MobileNavigation.tsx +++ b/apps/pyconkr/src/components/layout/Header/Mobile/MobileNavigation.tsx @@ -87,10 +87,16 @@ export const MobileNavigation: React.FC = ({ isOpen, onCl .filter((s) => !s.hide) .map((menu) => ( - - {menu.name} - - {!R.isEmpty(menu.children) && ( + {!R.isEmpty(menu.children) && Object.values(menu.children).some((child) => !child.hide) ? ( + navigateToDepth2(menu)}> + {menu.name} + + ) : ( + + {menu.name} + + )} + {!R.isEmpty(menu.children) && Object.values(menu.children).some((child) => !child.hide) && ( navigateToDepth2(menu)}> @@ -123,7 +129,7 @@ export const MobileNavigation: React.FC = ({ isOpen, onCl - {!R.isEmpty(menu.children) && ( + {!R.isEmpty(menu.children) && Object.values(menu.children).some((child) => !child.hide) && ( navigateToDepth3(menu)}> @@ -250,6 +256,17 @@ const MenuLink = styled(Link)<{ isMainPath?: boolean }>(({ theme, isMainPath = t fontWeight: 600, })); +const MenuButton = styled(Button)<{ isMainPath?: boolean }>(({ theme, isMainPath = true }) => ({ + color: isMainPath ? theme.palette.mobileNavigation.main.text : theme.palette.mobileNavigation.sub.text, + textTransform: "none", + fontSize: "20px", + fontWeight: 600, + padding: 0, + minWidth: "auto", + minHeight: "auto", + justifyContent: "flex-start", +})); + const MenuArrowButton = styled(IconButton)<{ isMainPath?: boolean }>(({ theme, isMainPath = true }) => ({ color: isMainPath ? theme.palette.mobileNavigation.main.text : theme.palette.mobileNavigation.sub.text, padding: 8,