1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-12-02 05:57:29 +01:00

full width menu bar

This commit is contained in:
Matthias Kretschmann 2021-06-09 19:40:43 +02:00
parent 270f567879
commit 9943dae93c
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 19 additions and 26 deletions

View File

@ -1,13 +1,9 @@
.menu {
width: 100%;
}
.menu > div {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: calc(var(--spacer) / 2);
padding-bottom: calc(var(--spacer) / 2);
padding: calc(var(--spacer) / 2) var(--spacer);
}
.logoUnit {

View File

@ -4,7 +4,6 @@ import { useLocation } from '@reach/router'
import loadable from '@loadable/component'
import styles from './Menu.module.css'
import { useSiteMetadata } from '../../hooks/useSiteMetadata'
import Container from '../atoms/Container'
import UserPreferences from './UserPreferences'
import Badge from '../atoms/Badge'
import Logo from '../atoms/Logo'
@ -36,28 +35,26 @@ export default function Menu(): ReactElement {
return (
<nav className={styles.menu}>
<Container>
<Link to="/" className={styles.logoUnit}>
<Logo />
<h1 className={styles.title}>
{siteTitle} <Badge label="beta" />
</h1>
</Link>
<Link to="/" className={styles.logoUnit}>
<Logo />
<h1 className={styles.title}>
{siteTitle} <Badge label="beta" />
</h1>
</Link>
<ul className={styles.navigation}>
{menu.map((item: MenuItem) => (
<li key={item.name}>
<MenuLink item={item} />
</li>
))}
<li>
<Wallet />
<ul className={styles.navigation}>
{menu.map((item: MenuItem) => (
<li key={item.name}>
<MenuLink item={item} />
</li>
<li>
<UserPreferences />
</li>
</ul>
</Container>
))}
<li>
<Wallet />
</li>
<li>
<UserPreferences />
</li>
</ul>
</nav>
)
}