|
|
@ -1,5 +1,6 @@
|
|
|
|
import { NavLink } from 'react-router-dom';
|
|
|
|
import { NavLink } from 'react-router-dom';
|
|
|
|
import Arrow1 from './assets/arrow.svg';
|
|
|
|
import Arrow1 from './assets/arrow.svg';
|
|
|
|
|
|
|
|
import Message from './assets/message.svg';
|
|
|
|
import Hamburger from './assets/hamburger.svg';
|
|
|
|
import Hamburger from './assets/hamburger.svg';
|
|
|
|
import Key from './assets/key.svg';
|
|
|
|
import Key from './assets/key.svg';
|
|
|
|
import Info from './assets/info.svg';
|
|
|
|
import Info from './assets/info.svg';
|
|
|
@ -56,6 +57,18 @@ export default function Navigation({
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</button>
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<NavLink
|
|
|
|
|
|
|
|
to={'/'}
|
|
|
|
|
|
|
|
className={({ isActive }) =>
|
|
|
|
|
|
|
|
`${
|
|
|
|
|
|
|
|
isActive ? 'bg-gray-3000' : ''
|
|
|
|
|
|
|
|
} my-auto mx-4 mt-4 flex h-12 cursor-pointer gap-4 rounded-md hover:bg-gray-100`
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<img src={Message} className="ml-2 w-5"></img>
|
|
|
|
|
|
|
|
<p className="my-auto text-eerie-black">Chat</p>
|
|
|
|
|
|
|
|
</NavLink>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="flex-grow border-b-2 border-gray-100"></div>
|
|
|
|
<div className="flex-grow border-b-2 border-gray-100"></div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="flex flex-col gap-2 border-b-2 border-gray-100 py-2">
|
|
|
|
<div className="flex flex-col gap-2 border-b-2 border-gray-100 py-2">
|
|
|
@ -85,7 +98,11 @@ export default function Navigation({
|
|
|
|
<div className="flex h-48 flex-col border-b-2 border-gray-100">
|
|
|
|
<div className="flex h-48 flex-col border-b-2 border-gray-100">
|
|
|
|
<NavLink
|
|
|
|
<NavLink
|
|
|
|
to="/about"
|
|
|
|
to="/about"
|
|
|
|
className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-md hover:bg-gray-100"
|
|
|
|
className={({ isActive }) =>
|
|
|
|
|
|
|
|
`my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-md hover:bg-gray-100 ${
|
|
|
|
|
|
|
|
isActive ? 'bg-gray-3000' : ''
|
|
|
|
|
|
|
|
}`
|
|
|
|
|
|
|
|
}
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<img src={Info} alt="info" className="ml-2 w-5" />
|
|
|
|
<img src={Info} alt="info" className="ml-2 w-5" />
|
|
|
|
<p className="my-auto text-eerie-black">About</p>
|
|
|
|
<p className="my-auto text-eerie-black">About</p>
|
|
|
|