34 lines
914 B
TypeScript
34 lines
914 B
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { usePathname } from 'next/navigation';
|
|
|
|
export default function Navigation() {
|
|
const pathname = usePathname();
|
|
|
|
function isActive(path: string) {
|
|
return pathname === path ? 'active' : '';
|
|
}
|
|
|
|
return (
|
|
<header
|
|
style={{
|
|
padding: '1rem 2rem',
|
|
backgroundColor: '#2E7D32',
|
|
}}
|
|
>
|
|
<nav className="navbar">
|
|
<strong style={{ fontSize: '1.2rem', color: 'white' }}>
|
|
OnlyPets
|
|
</strong>
|
|
|
|
<Link href="/" className={isActive('/')}>Start</Link>
|
|
<Link href="/feed" className={isActive('/feed')}>Feed</Link>
|
|
<Link href="/explore" className={isActive('/explore')}>Entdecken</Link>
|
|
<Link href="/post/new" className={isActive('/post/new')}>Neuer Beitrag</Link>
|
|
<Link href="/profile" className={isActive('/profile')}>Profil</Link>
|
|
</nav>
|
|
</header>
|
|
);
|
|
}
|