merge navlinks styling

This commit is contained in:
andrzej 2024-06-24 11:55:31 +02:00
parent 04688feb28
commit f245b8d72d
1 changed files with 5 additions and 4 deletions

View File

@ -3,6 +3,7 @@ import Link from "next/link";
import { usePathname } from "next/navigation";
import { ComponentProps } from "react";
import clsx from "clsx";
import { twMerge } from "tailwind-merge";
function NavLink(props: ComponentProps<"div"> & { href: string }) {
@ -22,12 +23,12 @@ export default function Navlinks(props: ComponentProps<"div">) {
<div className="text-secondary-foreground" >
{
links.map(e => (<NavLink key={e.link} href={e.link}
className={clsx("text-xl font-black my-2 w-full pl-2 antialiased",
className={twMerge(clsx("text-xl drop-shadow font-black my-2 w-full pl-2 antialiased text-secondary-foreground bg-secondary",
{
"text-primary-foreground bg-primary": pathname === e.link
"text-primary-foreground bg-primary": pathname.includes(e.link)
}
)}
>{e.label}</NavLink >))
))}
><p className="drop-shadow-sm">{e.label}</p></NavLink >))
}
</ div>
</div>