Files
medscribe-web/src/components/site-footer.tsx
T

74 lines
2.9 KiB
TypeScript

import Link from "next/link";
import { MedscribeLogo } from "~/components/medscribe-logo";
const footerLinks = [
{ href: "/how-it-works", label: "How it works" },
{ href: "/privacy", label: "Privacy" },
{ href: "/access", label: "Request access" },
] as const;
export function SiteFooter() {
return (
<footer className="print-hidden px-3 pb-3 sm:px-5 sm:pb-5">
<div className="glass-panel mx-auto grid max-w-6xl gap-10 rounded-[2rem] px-6 py-10 text-sm sm:px-8 md:grid-cols-[1.3fr_0.7fr_0.7fr]">
<div>
<Link
href="/"
className="text-foreground focus-visible:ring-primary/40 inline-flex items-center gap-2.5 rounded-md outline-none focus-visible:ring-2"
>
<MedscribeLogo className="h-7 w-auto" />
<span className="font-serif text-lg font-semibold">Medscribe</span>
</Link>
<p className="text-muted-foreground mt-4 max-w-md leading-relaxed">
A private, patient-controlled way to keep visits, medications, and
important care context together.
</p>
<p className="text-muted-foreground mt-3 text-xs leading-relaxed">
Medscribe does not diagnose, prescribe, or replace emergency
services or a clinician&apos;s verification.
</p>
</div>
<nav aria-label="Footer product navigation">
<p className="text-foreground font-semibold">Product</p>
<ul className="text-muted-foreground mt-3 space-y-2.5">
{footerLinks.map((item) => (
<li key={item.href}>
<Link
href={item.href}
className="hover:text-foreground focus-visible:ring-primary/40 rounded-sm underline-offset-4 outline-none hover:underline focus-visible:ring-2"
>
{item.label}
</Link>
</li>
))}
</ul>
</nav>
<div>
<p className="text-foreground font-semibold">Contact</p>
<p className="text-muted-foreground mt-3 leading-relaxed">
Built by{" "}
<a
href="https://soconnor.dev"
className="text-foreground focus-visible:ring-primary/40 rounded-sm underline-offset-4 outline-none hover:underline focus-visible:ring-2"
>
Sean O&apos;Connor
</a>
</p>
<a
href="mailto:sean@soconnor.dev?subject=Medscribe%20website%20question"
className="text-foreground focus-visible:ring-primary/40 mt-2 inline-block rounded-sm underline-offset-4 outline-none hover:underline focus-visible:ring-2"
>
sean@soconnor.dev
</a>
<p className="text-muted-foreground/80 mt-5 text-xs">
&copy; {new Date().getFullYear()} Hadlock Holdings LLC
</p>
</div>
</div>
</footer>
);
}