Files
jiang13-bbs/frontend/components/site-doc/SiteDocIdentity.tsx

62 lines
1.7 KiB
TypeScript

import Link from "next/link";
import { Info, Megaphone, type LucideIcon } from "lucide-react";
export type SiteDocIdentityKind = "announcements" | "about";
const META: Record<
SiteDocIdentityKind,
{ title: string; href: string; Icon: LucideIcon; fallbackLead: string }
> = {
announcements: {
title: "站点公告",
href: "/announcements",
Icon: Megaphone,
fallbackLead: "官方通知与运营公告",
},
about: {
title: "关于本站",
href: "/about",
Icon: Info,
fallbackLead: "站点说明与政策文档",
},
};
/** 左栏身份卡:标明当前公文区 */
export default function SiteDocIdentity({
kind,
lead,
}: {
kind: SiteDocIdentityKind;
lead?: string;
}) {
const m = META[kind];
const Icon = m.Icon;
const text = lead?.trim() || m.fallbackLead;
return (
<section className="j13-module shrink-0" aria-labelledby={`site-doc-id-${kind}`}>
<p className="j13-module-title mb-3" id={`site-doc-id-${kind}`}>
<Icon size={15} style={{ color: "var(--accent)" }} /> {m.title}
</p>
<Link href={m.href} className="flex items-center gap-3 group">
<span
className="w-11 h-11 rounded-xl flex items-center justify-center shrink-0"
style={{ background: "var(--accent-soft)", color: "var(--accent)" }}
aria-hidden
>
<Icon size={20} strokeWidth={2} />
</span>
<span
className="font-semibold text-[14.5px] truncate group-hover:text-[var(--accent)] transition-colors"
style={{ color: "var(--ink)" }}
>
{m.title}
</span>
</Link>
<p className="mt-2.5 text-[12.5px] leading-relaxed" style={{ color: "var(--ink-3)" }}>
{text}
</p>
</section>
);
}