diff --git a/src/components/App/index.tsx b/src/components/App/index.tsx index 3cff44bf..41980dc4 100644 --- a/src/components/App/index.tsx +++ b/src/components/App/index.tsx @@ -35,7 +35,9 @@ export const App: React.FC = props => { - + {hideBreadcrumbs || !props.breadcrumbs ? null : ( diff --git a/src/components/Menu/styles.css b/src/components/Menu/styles.css index be3cb18d..61ebda64 100644 --- a/src/components/Menu/styles.css +++ b/src/components/Menu/styles.css @@ -6,6 +6,14 @@ list-style: none; } +.menu.desktop { + flex-direction: row; +} + +.menu.mobile { + flex-direction: column; +} + .menuItem { position: relative; border-top: var(--menu-mark-thickness) solid rgba(0, 0, 0, 0); @@ -14,10 +22,10 @@ /* MOBILE */ .menuItem.mobile { - flex-direction: column; - font-size: 1.25em; color: var(--color-text-opposite); + + padding: var(--size-xs) var(--size-s); } .menuItem.mobile.selected { @@ -28,12 +36,6 @@ .menuItem.desktop { padding: var(--size-xs) var(--size-s); - margin-bottom: var(--size-s); - margin-right: var(--size-s); -} - -.menuItem.desktop:last-child { - margin-right: 0; } .menuItem.desktop.selected {