freefire
1535577eac
用顶栏/主栏高度令牌消除 sticky 首滚空走，面包屑叠到中栏上方，公开页增加回顶浮钮。 Co-authored-by: Cursor <cursoragent@cursor.com>
38 lines
1.4 KiB
TypeScript
38 lines
1.4 KiB
TypeScript
import Link from "next/link";
|
|
import { ChevronRight } from "lucide-react";
|
|
|
|
export type Crumb = { href?: string; label: string };
|
|
|
|
/** 位置指引：桌面叠在中栏卡片上方的内边距里，不拉低卡片、不对齐到左栏 */
|
|
export default function SiteDocBreadcrumb({ items }: { items: Crumb[] }) {
|
|
return (
|
|
<nav
|
|
className="meta mb-2 flex items-center gap-1 flex-wrap text-[12.5px] leading-none lg:absolute lg:bottom-full lg:left-0 lg:right-0 lg:mb-0 lg:pb-2 lg:pl-1"
|
|
aria-label="面包屑"
|
|
>
|
|
{items.map((item, i) => {
|
|
const last = i === items.length - 1;
|
|
const cls = last ? "truncate" : "shrink-0";
|
|
return (
|
|
<span key={`${item.label}-${i}`} className="inline-flex items-center gap-1 min-w-0">
|
|
{i > 0 ? <ChevronRight size={12} className="shrink-0 opacity-70" aria-hidden /> : null}
|
|
{item.href ? (
|
|
<Link
|
|
href={item.href}
|
|
className={`hover:text-[var(--accent)] transition-colors ${cls}`}
|
|
style={last ? { color: "var(--accent)" } : undefined}
|
|
>
|
|
{item.label}
|
|
</Link>
|
|
) : (
|
|
<span className={cls} style={last ? { color: "var(--accent)" } : undefined}>
|
|
{item.label}
|
|
</span>
|
|
)}
|
|
</span>
|
|
);
|
|
})}
|
|
</nav>
|
|
);
|
|
}
|