NickBland/website-2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change navbar to sit inside of header tag

Browse Source 
Reflect that both the head and nav tag are inside of a header rather than nesting both inside of an empty div
This commit is contained in:
Nick Bland 2022-05-15 23:33:15 +10:00
parent cca535bcd8
commit 13ab78bf2a
No known key found for this signature in database
GPG Key ID: B46CF88E4DAB4A2C
1 changed files with 66 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/navbar.tsx
View File

@ -16,7 +16,7 @@ type Props = {
const NavBar = ({children, title = "nickbland.dev | Home", description = "A website made by Nick Bland."}: Props) => { const NavBar = ({children, title = "nickbland.dev | Home", description = "A website made by Nick Bland."}: Props) => {
const [isOpen, setIsOpen] = useState(false); const [isOpen, setIsOpen] = useState(false);
return ( return (
<div> <header>
<Head> <Head>
<title>{title}</title> <title>{title}</title>
<meta charSet="utf-8" /> <meta charSet="utf-8" />
@ -24,8 +24,7 @@ const NavBar = ({children, title = "nickbland.dev | Home", description = "A webs
<meta name="description" content={description} /> <meta name="description" content={description} />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<header> <Disclosure as="nav" className="dark:bg-black bg-white m-0 p-0">
<Disclosure as="nav" className="dark:bg-black bg-white">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between h-16"> <div className="flex items-center justify-between h-16">
<div className="flex items-center"> <div className="flex items-center">
@ -51,6 +50,7 @@ const NavBar = ({children, title = "nickbland.dev | Home", description = "A webs
<div className="ml-10 flex items-baseline space-x-4"> <div className="ml-10 flex items-baseline space-x-4">
<Link href="/"><a className="dark:text-white text-black">Home</a></Link> <Link href="/"><a className="dark:text-white text-black">Home</a></Link>
<Link href="/"><a className="dark:text-white text-black">About</a></Link> <Link href="/"><a className="dark:text-white text-black">About</a></Link>
<Link href="/"><a className="dark:text-white text-black">Projects</a></Link>
</div> </div>
<div className="flex items-center justify-center mx-auto absolute top-5 right-0 left-1/3"> <div className="flex items-center justify-center mx-auto absolute top-5 right-0 left-1/3">
<ThemeSwitch></ThemeSwitch> <ThemeSwitch></ThemeSwitch>
@ -94,10 +94,7 @@ const NavBar = ({children, title = "nickbland.dev | Home", description = "A webs
</Transition.Child> </Transition.Child>
</Transition> </Transition>
</Disclosure> </Disclosure>
</header> </header>
</div>
) )
} }