35 lines
650 B
React
35 lines
650 B
React
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import config from './config';
|
|
import './styles.scss';
|
|
import { usePathname } from 'next/navigation';
|
|
|
|
const Navbar = () => {
|
|
const pathname = usePathname();
|
|
|
|
return (
|
|
<nav
|
|
className='navbar'
|
|
style={{
|
|
gridTemplateColumns: `repeat(${config.length}, 1fr)`,
|
|
}}
|
|
>
|
|
{config.map((element) => (
|
|
<Link
|
|
key={element.title}
|
|
href={element.link}
|
|
className={`navButton ${
|
|
element.link == pathname ? 'selected' : ''
|
|
}`}
|
|
>
|
|
{element.icon()}
|
|
<span className='navButtonLabel'>{element.title}</span>
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
);
|
|
};
|
|
|
|
export default Navbar;
|