Skip to content

Commit

Permalink
remove base.org banner (#54)
Browse files Browse the repository at this point in the history
  • Loading branch information
@lukasrosario
lukasrosario authored Oct 6, 2023
1 parent d9e7a9b commit 48cbe99
Showing 1 changed file with 70 additions and 94 deletions.
164 changes: 70 additions & 94 deletions apps/web/src/components/Layout/Nav/Nav.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ function MobileMenu({ toggleMobileMenu }: MobileMenuProps) {

return (
<motion.nav
className="fixed top-0 left-0 z-30 m-0 h-screen w-screen bg-gray p-8"
className="fixed left-0 top-0 z-30 m-0 h-screen w-screen bg-gray p-8"
initial={mobileMenuInitial}
animate={mobileMenuAnimation}
exit={mobileMenuInitial}
Expand Down Expand Up @@ -104,21 +104,6 @@ function MobileMenu({ toggleMobileMenu }: MobileMenuProps) {
);
}

const mainnetBanner = (
<span className="text-center font-sans text-white">
Base mainnet is open. Come join us for{' '}
<a
href="https://onchainsummer.xyz"
className="underline"
target="_blank"
rel="noreferrer noopener"
>
Onchain Summer
</a>
.
</span>
);

export function Nav({ color }: NavProps) {
const [showMobileMenu, toggleMobileMenu] = useState<boolean>(false);
const { pathname } = useRouter();
Expand All @@ -130,91 +115,82 @@ export function Nav({ color }: NavProps) {
}, []);

return (
<>
<div
className={`w-full ${
color === 'white' ? 'bg-blue-600' : 'bg-black'
} flex h-16 items-center justify-center px-4`}
>
{mainnetBanner}
</div>
<nav className="bg-transparent z-10 flex h-24 w-full max-w-[1440px] flex-row justify-between self-center p-8">
<Link href="/">
<Logo color={color} path={pathname} />
</Link>
{/* Desktop */}
<div className="hidden h-full flex-row items-center space-x-16 lg:flex">
<div className="h-full flex-row items-center space-x-16">
<Link href="/about">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
>
About
</span>
</Link>
<a
href={publicRuntimeConfig.docsUrl}
<nav className="bg-transparent z-10 flex h-24 w-full max-w-[1440px] flex-row justify-between self-center p-8">
<Link href="/">
<Logo color={color} path={pathname} />
</Link>
{/* Desktop */}
<div className="hidden h-full flex-row items-center space-x-16 lg:flex">
<div className="h-full flex-row items-center space-x-16">
<Link href="/about">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
target="_blank"
rel="noreferrer noopener"
>
Docs
</a>
<Link href="/ecosystem">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
>
Ecosystem
</span>
</Link>
<a
href={publicRuntimeConfig.bridgeUrl}
About
</span>
</Link>
<a
href={publicRuntimeConfig.docsUrl}
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
target="_blank"
rel="noreferrer noopener"
>
Docs
</a>
<Link href="/ecosystem">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
rel="noreferrer noopener"
>
Bridge
</a>
<a
href="https://base.mirror.xyz"
Ecosystem
</span>
</Link>
<a
href={publicRuntimeConfig.bridgeUrl}
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
rel="noreferrer noopener"
>
Bridge
</a>
<a
href="https://base.mirror.xyz"
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
>
Blog
</a>
<Link href="/jobs">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
>
Blog
</a>
<Link href="/jobs">
<span
className={`font-mono text-xl ${color === 'black' ? 'text-black' : 'text-white'}`}
>
Jobs
</span>
</Link>
</div>
<div className="flex h-full flex-row items-center space-x-8">
<Link href="/discord" title="Join us on Discord">
<Icon name="discord" width="24" height="20" color={color} />
</Link>
<a href="https://twitter.com/buildonbase" title="Join us on Twitter">
<Icon name="twitter" width="24" height="20" color={color} />
</a>
<a href="https://github.com/base-org" title="Join us on Github">
<Icon name="github" width="24" height="24" color={color} />
</a>
</div>
Jobs
</span>
</Link>
</div>
{/* Mobile */}
<div className="flex lg:hidden">
<button
className="appearance-none"
type="button"
onClick={handleMenuButtonClick}
aria-label="BASE mobile navigation"
>
<Icon name="more-menu" color={color} />
</button>
<div className="flex h-full flex-row items-center space-x-8">
<Link href="/discord" title="Join us on Discord">
<Icon name="discord" width="24" height="20" color={color} />
</Link>
<a href="https://twitter.com/buildonbase" title="Join us on Twitter">
<Icon name="twitter" width="24" height="20" color={color} />
</a>
<a href="https://github.com/base-org" title="Join us on Github">
<Icon name="github" width="24" height="24" color={color} />
</a>
</div>
<AnimatePresence>
{showMobileMenu ? <MobileMenu toggleMobileMenu={toggleMobileMenu} /> : null}
</AnimatePresence>
</nav>
</>
</div>
{/* Mobile */}
<div className="flex lg:hidden">
<button
className="appearance-none"
type="button"
onClick={handleMenuButtonClick}
aria-label="BASE mobile navigation"
>
<Icon name="more-menu" color={color} />
</button>
</div>
<AnimatePresence>
{showMobileMenu ? <MobileMenu toggleMobileMenu={toggleMobileMenu} /> : null}
</AnimatePresence>
</nav>
);
}

0 comments on commit 48cbe99

Please sign in to comment.