47 lines
1.2 KiB
React
47 lines
1.2 KiB
React
|
import { NavLink } from 'react-router-dom'
|
||
|
|
import { Home, Search, Bell, User } from 'lucide-react'
|
||
|
|
import './Navigation.css'
|
||
|
|
|
||
|
|
export default function Navigation() {
|
||
|
|
return (
|
||
|
|
<nav className="navigation">
|
||
|
|
<NavLink to="/feed" className="nav-item">
|
||
|
|
{({ isActive }) => (
|
||
|
|
<>
|
||
|
|
<Home size={24} strokeWidth={isActive ? 2.5 : 2} />
|
||
|
|
<span>Лента</span>
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</NavLink>
|
||
|
|
|
||
|
|
<NavLink to="/search" className="nav-item">
|
||
|
|
{({ isActive }) => (
|
||
|
|
<>
|
||
|
|
<Search size={24} strokeWidth={isActive ? 2.5 : 2} />
|
||
|
|
<span>Поиск</span>
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</NavLink>
|
||
|
|
|
||
|
|
<NavLink to="/notifications" className="nav-item">
|
||
|
|
{({ isActive }) => (
|
||
|
|
<>
|
||
|
|
<Bell size={24} strokeWidth={isActive ? 2.5 : 2} />
|
||
|
|
<span>Уведомления</span>
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</NavLink>
|
||
|
|
|
||
|
|
<NavLink to="/profile" className="nav-item">
|
||
|
|
{({ isActive }) => (
|
||
|
|
<>
|
||
|
|
<User size={24} strokeWidth={isActive ? 2.5 : 2} />
|
||
|
|
<span>Профиль</span>
|
||
|
|
</>
|
||
|
|
)}
|
||
|
|
</NavLink>
|
||
|
|
</nav>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|