Jason Woltje
b47c5e420a
All checks were successful
ci/woodpecker/push/web Pipeline was successful
Co-authored-by: Jason Woltje <jason@diversecanvas.com> Co-committed-by: Jason Woltje <jason@diversecanvas.com>
84 lines
2.9 KiB
TypeScript
84 lines
2.9 KiB
TypeScript
import Link from "next/link";
|
|
import { StatusTerminal } from "./StatusTerminal";
|
|
|
|
const NAV_LINKS = [
|
|
{ label: "Home", href: "/" },
|
|
{ label: "About", href: "/about" },
|
|
{ label: "Projects", href: "/projects" },
|
|
{ label: "Contact", href: "/contact" },
|
|
];
|
|
|
|
const SOCIALS = [
|
|
{ label: "GitHub", href: "https://github.com/jasonwoltje" },
|
|
{ label: "LinkedIn", href: "https://linkedin.com/in/jasonwoltje" },
|
|
];
|
|
|
|
export function Footer() {
|
|
return (
|
|
<footer className="bg-background">
|
|
<div className="mx-auto max-w-7xl px-6 pt-16 pb-8">
|
|
{/* Columns */}
|
|
<div className="grid grid-cols-1 gap-12 md:grid-cols-3 md:gap-8">
|
|
{/* Brand */}
|
|
<div className="flex flex-col gap-4">
|
|
<Link
|
|
href="/"
|
|
className="font-headline text-lg font-bold uppercase tracking-tighter text-primary"
|
|
>
|
|
JASON WOLTJE
|
|
</Link>
|
|
<p className="font-body text-sm leading-relaxed text-on-surface-variant">
|
|
Systems thinker. Builder. IT leader turning into a software
|
|
engineer.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Nav */}
|
|
<div className="flex flex-col gap-3">
|
|
<span className="label-md text-on-surface-variant mb-1">Navigate</span>
|
|
{NAV_LINKS.map((link) => (
|
|
<Link
|
|
key={link.href}
|
|
href={link.href}
|
|
className="font-label text-[11px] uppercase tracking-widest text-on-surface-variant transition-colors hover:text-primary"
|
|
>
|
|
{link.label}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
|
|
{/* Socials */}
|
|
<div className="flex flex-col gap-3">
|
|
<span className="label-md text-on-surface-variant mb-1">Connect</span>
|
|
{SOCIALS.map((s) => (
|
|
<a
|
|
key={s.href}
|
|
href={s.href}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="font-label text-[11px] uppercase tracking-widest text-on-surface-variant transition-colors hover:text-secondary"
|
|
>
|
|
{s.label}
|
|
</a>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
{/* Divider tonal shift — no 1px border at 100% */}
|
|
<div className="mt-12 h-px bg-gradient-to-r from-transparent via-outline-variant/20 to-transparent" />
|
|
|
|
{/* Bottom bar */}
|
|
<div className="mt-6 flex flex-col items-start gap-4 md:flex-row md:items-center md:justify-between">
|
|
<span className="font-label text-[9px] uppercase tracking-[0.3em] text-on-surface-variant">
|
|
© {new Date().getFullYear()} JASON WOLTJE // ALL RIGHTS RESERVED
|
|
</span>
|
|
<StatusTerminal />
|
|
<span className="font-label text-[8px] uppercase tracking-[0.5em] text-outline">
|
|
ENGINEERED FOR EXCELLENCE
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|