This commit is contained in:
1 parent
8efd032cc6
commit
df38dccbf1
735 files changed
+128321
-120870
No files matched your search
@@ -1,8 +1,8 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import type { ReactNode } from "react";
|
||||
import { usePathname } from "next/navigation";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
/**
|
||||
* Sidebar link that highlights when its route is active. "/admin" matches
|
||||
@@ -10,40 +10,42 @@ import { usePathname } from "next/navigation";
|
||||
* active on /admin/radio/history) so the current section stays lit.
|
||||
*/
|
||||
export function AdminNavLink({
|
||||
href,
|
||||
icon,
|
||||
children,
|
||||
href,
|
||||
icon,
|
||||
children,
|
||||
}: {
|
||||
href: string;
|
||||
icon?: ReactNode;
|
||||
children: ReactNode;
|
||||
href: string;
|
||||
icon?: ReactNode;
|
||||
children: ReactNode;
|
||||
}) {
|
||||
const pathname = usePathname() ?? "";
|
||||
const active =
|
||||
href === "/admin" ? pathname === "/admin" : pathname === href || pathname.startsWith(`${href}/`);
|
||||
const pathname = usePathname() ?? "";
|
||||
const active =
|
||||
href === "/admin"
|
||||
? pathname === "/admin"
|
||||
: pathname === href || pathname.startsWith(`${href}/`);
|
||||
|
||||
return (
|
||||
<Link
|
||||
href={href}
|
||||
aria-current={active ? "page" : undefined}
|
||||
className={`group flex items-center gap-2.5 rounded-xl px-3 py-2 text-sm no-underline transition-all duration-150 ${
|
||||
active
|
||||
? "bg-[var(--admin-accent)]/20 font-semibold text-[var(--admin-sidebar-text-readable)] border-l-2 border-[var(--admin-accent)] shadow-sm"
|
||||
: "font-medium text-[var(--admin-sidebar-text-readable)] hover:bg-[var(--admin-accent)]/10 hover:no-underline"
|
||||
}`}
|
||||
>
|
||||
{icon ? (
|
||||
<span
|
||||
className={`flex-none transition-colors ${
|
||||
active
|
||||
? "text-[var(--admin-accent)]"
|
||||
: "text-[var(--admin-sidebar-text-readable)] opacity-75 group-hover:opacity-100"
|
||||
}`}
|
||||
>
|
||||
{icon}
|
||||
</span>
|
||||
) : null}
|
||||
<span className="truncate">{children}</span>
|
||||
</Link>
|
||||
);
|
||||
return (
|
||||
<Link
|
||||
href={href}
|
||||
aria-current={active ? "page" : undefined}
|
||||
className={`group flex items-center gap-2.5 rounded-xl px-3 py-2 text-sm no-underline transition-all duration-150 ${
|
||||
active
|
||||
? "bg-[var(--admin-accent)]/20 font-semibold text-[var(--admin-sidebar-text-readable)] border-l-2 border-[var(--admin-accent)] shadow-sm"
|
||||
: "font-medium text-[var(--admin-sidebar-text-readable)] hover:bg-[var(--admin-accent)]/10 hover:no-underline"
|
||||
}`}
|
||||
>
|
||||
{icon ? (
|
||||
<span
|
||||
className={`flex-none transition-colors ${
|
||||
active
|
||||
? "text-[var(--admin-accent)]"
|
||||
: "text-[var(--admin-sidebar-text-readable)] opacity-75 group-hover:opacity-100"
|
||||
}`}
|
||||
>
|
||||
{icon}
|
||||
</span>
|
||||
) : null}
|
||||
<span className="truncate">{children}</span>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user