mirror of
https://github.com/r-freeman/portfolio.git
synced 2024-11-22 17:25:40 +00:00
Extracted nav link component and updated footer styling
This commit is contained in:
parent
f2ff678735
commit
c3b645321f
@ -1,20 +1,10 @@
|
|||||||
import Link from 'next/link'
|
import React from 'react'
|
||||||
import React, {ReactNode} from 'react'
|
|
||||||
import {OuterContainer, InnerContainer} from './Container'
|
import {OuterContainer, InnerContainer} from './Container'
|
||||||
|
import {NavLink} from '@/components/ui/Navigation'
|
||||||
import {SpotifyPlayer} from './ui/SpotifyPlayer'
|
import {SpotifyPlayer} from './ui/SpotifyPlayer'
|
||||||
import {SocialLink} from '@/components/ui/SocialLink'
|
import {SocialLink} from '@/components/ui/SocialLink'
|
||||||
import {GitHubIcon, LinkedInIcon, TwitterIcon} from '@/components/icons/SocialIcons'
|
import {GitHubIcon, LinkedInIcon, TwitterIcon} from '@/components/icons/SocialIcons'
|
||||||
|
|
||||||
function NavLink({href, children}: { href: string, children: ReactNode }) {
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
href={href}
|
|
||||||
className="transition hover:text-indigo-500 dark:hover:text-indigo-400"
|
|
||||||
>
|
|
||||||
{children}
|
|
||||||
</Link>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function Footer() {
|
export function Footer() {
|
||||||
return (
|
return (
|
||||||
@ -24,7 +14,8 @@ export function Footer() {
|
|||||||
<InnerContainer>
|
<InnerContainer>
|
||||||
<SpotifyPlayer/>
|
<SpotifyPlayer/>
|
||||||
<div className="flex flex-col items-center justify-between gap-6 mt-12">
|
<div className="flex flex-col items-center justify-between gap-6 mt-12">
|
||||||
<div className="flex gap-6 text-sm font-medium text-zinc-800 dark:text-zinc-200">
|
<div
|
||||||
|
className="flex flex-wrap justify-center gap-6 text-sm font-medium text-zinc-800 dark:text-zinc-200">
|
||||||
<NavLink href="/about">About</NavLink>
|
<NavLink href="/about">About</NavLink>
|
||||||
<NavLink href="/dashboard">Dashboard</NavLink>
|
<NavLink href="/dashboard">Dashboard</NavLink>
|
||||||
<NavLink href="/writing">Writing</NavLink>
|
<NavLink href="/writing">Writing</NavLink>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import {Fragment} from 'react'
|
import React, {Fragment, ReactNode} from 'react'
|
||||||
import {usePathname} from 'next/navigation'
|
import {usePathname} from 'next/navigation'
|
||||||
import {Popover, Transition} from '@headlessui/react'
|
import {Popover, Transition} from '@headlessui/react'
|
||||||
import clsx from 'clsx'
|
import clsx from 'clsx'
|
||||||
@ -113,3 +113,14 @@ export function DesktopNavigation(props: Props) {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function NavLink({href, children}: { href: string, children: ReactNode }) {
|
||||||
|
return (
|
||||||
|
<Link
|
||||||
|
href={href}
|
||||||
|
className="transition hover:text-indigo-500 dark:hover:text-indigo-400"
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</Link>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user