r-freeman/portfolio
1
0
Fork 0
mirror of https://github.com/r-freeman/portfolio.git synced 2024-11-23 00:05:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Extracted MobileNavItem component

Browse Source
This commit is contained in:
r-freeman 2023-02-14 21:34:07 +00:00
parent a05b0006ee
commit 55a5d5fe6f
2 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/Header.tsx
View File

@ -5,24 +5,14 @@ import {Fragment, useEffect, useRef} from 'react'
import {Popover, Transition} from '@headlessui/react' import {Popover, Transition} from '@headlessui/react'
import clsx from 'clsx' import clsx from 'clsx'
import {Container} from './Container' import {Container} from './Container'
import {CloseIcon} from '@/components/icons/CloseIcon' import {MobileNavItem} from './MobileNavItem'
import {ChevronDownIcon} from '@/components/icons/ChevronDownIcon' import {CloseIcon} from './icons/CloseIcon'
import {MoonIcon} from '@/components/icons/MoonIcon' import {ChevronDownIcon} from './icons/ChevronDownIcon'
import {SunIcon} from '@/components/icons/SunIcon' import {MoonIcon} from './icons/MoonIcon'
import {SunIcon} from './icons/SunIcon'
import avatar from '@/public/static/images/avatar.jpg' import avatar from '@/public/static/images/avatar.jpg'
import type {Props} from 'types' import type {Props} from 'types'
function MobileNavItem({href, children}: { href: string } & Props) {
return (
<li>
<Popover.Button as={Link} href={href} className="block py-2">
{children}
</Popover.Button>
</li>
)
}
function MobileNavigation(props: Props) { function MobileNavigation(props: Props) {
return ( return (
<Popover {...props}> <Popover {...props}>

13
components/MobileNavItem.tsx Normal file
View File

@ -0,0 +1,13 @@
import {Props} from '@/types';
import {Popover} from '@headlessui/react'
import Link from 'next/link'
export function MobileNavItem({href, children}: { href: string } & Props) {
return (
<li>
<Popover.Button as={Link} href={href} className="block py-2">
{children}
</Popover.Button>
</li>
)
}