Portfolio-v3/components/NavLink.js
Robert S 41b39bda69
Cleaned up the code and made it use flexbox
Oh and there's also a nav indicator now :)
2021-10-13 18:42:23 +02:00

18 lines
No EOL
479 B
JavaScript

import React from 'react'
import Link from 'next/link'
import { useRouter } from 'next/router'
const NavLink = ({ href, children }) => {
const router = useRouter()
let className = children.props.className || ''
if (router.pathname === href) {
className = `${className} text-white`
} else {
className = `${className} text-gray-400`
}
return <Link href={href}>{React.cloneElement(children, { className })}</Link>
}
export default NavLink