Skip to content

Commit 764cfce

Browse files
committed
fix: navItem mobile link not working
fix: desktop navItems hover effects
1 parent 6d4b9ab commit 764cfce

File tree

1 file changed

+9
-9
lines changed

1 file changed

+9
-9
lines changed

src/components/NavigationMenu.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { MouseEvent } from 'react';
2-
import { Link } from 'react-router-dom';
32
import { twJoin } from 'tailwind-merge';
43

54
import Button from './Button';
@@ -53,12 +52,12 @@ const NavigationMenu = ({ openState }: { openState: boolean }) => {
5352
{/* Desktop Navbar */}
5453
<nav className="hidden items-center gap-4 md:flex">
5554
<ThemeSwitcher />
56-
<ul className="flex gap-4">
55+
<ul className="flex gap-2">
5756
{menuItems.map(item => (
5857
<li key={item.id}>
5958
<a
6059
href={item.path}
61-
className="font-medium text-white"
60+
className="rounded-md px-4 py-2 font-medium text-white transition-colors duration-200 ease-linear hover:bg-gray-700"
6261
onClick={handelNavigation}
6362
>
6463
{item.itemName}
@@ -81,14 +80,15 @@ const NavigationMenu = ({ openState }: { openState: boolean }) => {
8180
>
8281
<>
8382
{menuItems.map(item => (
84-
<Link to={item.path}>
85-
<li
86-
key={item.id}
87-
className="transition-color relative rounded bg-gray-800 py-2 text-center font-medium text-white duration-1000 ease-linear hover:bg-gray-700"
83+
<li key={item.id} className="flex">
84+
<a
85+
href={item.path}
86+
onClick={handelNavigation}
87+
className="transition-color relative w-full rounded bg-gray-500 py-2 text-center font-medium text-white duration-1000 ease-linear hover:bg-gray-700"
8888
>
8989
{item.itemName}
90-
</li>
91-
</Link>
90+
</a>
91+
</li>
9292
))}
9393
</>
9494
</ul>

0 commit comments

Comments
 (0)