Files
shadow-gunbuilder-ai-proto/components/Footer.tsx
T

108 lines
3.3 KiB
TypeScript

import Link from "next/link";
export function Footer() {
const year = new Date().getFullYear();
const linkClass =
"text-zinc-400 hover:text-amber-300 transition-colors";
const sectionTitle =
"text-[11px] font-semibold uppercase tracking-[0.28em] text-zinc-500";
return (
<footer className="border-t border-zinc-900 bg-black/60">
<div className="mx-auto max-w-6xl px-4 py-12">
<div className="grid gap-10 md:grid-cols-3">
{/* Brand */}
<div>
<p className="text-[11px] font-semibold uppercase tracking-[0.35em] text-zinc-500">
Battl Builders
</p>
<p className="mt-3 text-sm text-zinc-300">
Build rifles smarter, not harder.
</p>
<p className="mt-2 text-[11px] text-zinc-500">
Early access platform · Data & pricing may change
</p>
</div>
{/* Explore */}
<div>
<p className={sectionTitle}>Explore</p>
<ul className="mt-4 space-y-2 text-sm">
<li>
<Link href="/builder" className={linkClass}>
Builder
</Link>
</li>
<li>
<Link href="/builds" className={linkClass}>
Community Builds
</Link>
</li>
<li>
<Link href="/vault" className={linkClass}>
My Builds
</Link>
</li>
</ul>
</div>
{/* Platform */}
<div>
<p className={sectionTitle}>Platform</p>
<ul className="mt-4 space-y-2 text-sm">
<li>
<Link href="/about" className={linkClass}>
About
</Link>
</li>
<li>
<Link href="/privacy" className={linkClass}>
Privacy Policy
</Link>
</li>
<li>
<Link href="/tos" className={linkClass}>
Terms of Service
</Link>
</li>
{/* Optional, if you have it */}
{/* <li>
<Link href="/contact" className={linkClass}>
Contact
</Link>
</li> */}
</ul>
</div>
</div>
{/* Bottom bar */}
<div className="mt-10 flex flex-col gap-3 border-t border-zinc-900 pt-6 text-[11px] text-zinc-500 md:flex-row md:items-center md:justify-between">
<span>© {year} Battl Builders</span>
<div className="flex flex-col items-center gap-2 md:flex-row md:gap-4">
<span className="text-zinc-600">
Built by people who actually build rifles
</span>
<span className="hidden text-zinc-700 md:inline"></span>
<span className="text-zinc-600">
<Link href="/tos" className="hover:text-amber-300 transition-colors">
Terms
</Link>{" "}
·{" "}
<Link href="/privacy" className="hover:text-amber-300 transition-colors">
Privacy
</Link>
</span>
</div>
</div>
</div>
</footer>
);
}