100 lines
3.0 KiB
TypeScript
100 lines
3.0 KiB
TypeScript
/**
|
|
* SiteFooter — editorial three-column footer.
|
|
*
|
|
* Column 1: Wordmark + dedication
|
|
* Column 2: Explore (links to the main content sections)
|
|
* Column 3: Resources (about, search, profile, etc.)
|
|
*
|
|
* A thin copyright row sits at the bottom.
|
|
*/
|
|
|
|
import Link from "next/link";
|
|
|
|
const EXPLORE = [
|
|
{ href: "/books", label: "Books" },
|
|
{ href: "/letters", label: "Letters" },
|
|
{ href: "/transcriptions", label: "Lectures" },
|
|
{ href: "/essays", label: "Essays" },
|
|
{ href: "/magazines", label: "Magazines" },
|
|
{ href: "/journals", label: "Journals" },
|
|
];
|
|
|
|
const RESOURCES = [
|
|
{ href: "/glossary", label: "Glossary" },
|
|
{ href: "/disciples", label: "Disciples" },
|
|
{ href: "/other-documents", label: "Other Documents" },
|
|
{ href: "/search", label: "Search" },
|
|
{ href: "/about", label: "About" },
|
|
];
|
|
|
|
export function SiteFooter() {
|
|
return (
|
|
<footer className="mt-auto border-t border-border bg-secondary text-secondary-foreground">
|
|
{/* Three-column main */}
|
|
<div className="max-w-5xl mx-auto px-4 sm:px-6 py-10 grid grid-cols-1 sm:grid-cols-3 gap-8">
|
|
{/* Brand */}
|
|
<div>
|
|
<Link
|
|
href="/"
|
|
aria-label="Prabhupāda Says — home"
|
|
className="font-[family-name:var(--font-title)] font-semibold uppercase tracking-[0.12em] text-base text-foreground"
|
|
>
|
|
Prabhupāda{" "}
|
|
<span className="text-muted-foreground tracking-[0.22em] font-medium">
|
|
Says
|
|
</span>
|
|
</Link>
|
|
<p className="mt-4 text-sm text-muted-foreground leading-relaxed max-w-xs">
|
|
A complete, searchable library of His Divine Grace A.C. Bhaktivedanta
|
|
Swami Prabhupāda's books, letters, and teachings.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Explore */}
|
|
<FooterColumn title="Explore" items={EXPLORE} />
|
|
|
|
{/* Resources */}
|
|
<FooterColumn title="Resources" items={RESOURCES} />
|
|
</div>
|
|
|
|
{/* Copyright row */}
|
|
<div className="border-t border-border">
|
|
<div className="max-w-5xl mx-auto px-4 sm:px-6 py-5 flex flex-col sm:flex-row items-center justify-between gap-2 text-xs text-muted-foreground">
|
|
<p>
|
|
© {new Date().getFullYear()} Team Prabhupāda Says · Hare Kṛṣṇa
|
|
</p>
|
|
<p>All glories to Śrīla Prabhupāda</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|
|
|
|
function FooterColumn({
|
|
title,
|
|
items,
|
|
}: {
|
|
title: string;
|
|
items: { href: string; label: string }[];
|
|
}) {
|
|
return (
|
|
<div>
|
|
<p className="text-[0.72rem] uppercase tracking-[0.2em] font-semibold text-foreground/80">
|
|
{title}
|
|
</p>
|
|
<ul className="mt-4 space-y-2">
|
|
{items.map((item) => (
|
|
<li key={item.href}>
|
|
<Link
|
|
href={item.href}
|
|
className="text-sm text-foreground/80 hover:text-foreground transition-colors"
|
|
>
|
|
{item.label}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|