merge navlinks styling
This commit is contained in:
parent
f6784cca29
commit
ad613517f4
|
@ -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>
|
||||
|
|
Loading…
Reference in New Issue