adminandClaude Opus 4.8
f4beca3f76
Converts every last bare-Swedish const array across landing sections
(STATS, TILES, CHAIN, PIPELINE, MODELS, DATASETS, PRINCIPLES, COLUMNS)
and shared components (data-artifact, provenance-badge) to {en,sv} Loc
objects consumed via useT(). Verified by per-file verify agent: 10/10
clean, zero remaining bare-Swedish display text. tsc 0 + build green.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
73 lines
4.3 KiB
TypeScript
73 lines
4.3 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { useReveal } from "@/hooks/use-reveal";
|
|
import { useT } from "@/components/locale-provider";
|
|
|
|
type Loc = { en: string; sv: string };
|
|
const COLUMNS: { head: Loc; links: { label: Loc; href: string }[] }[] = [
|
|
{ head: { en: "Product", sv: "Produkt" }, links: [{ label: { en: "Catalog", sv: "Katalog" }, href: "/#katalog" }, { label: { en: "Order", sv: "Beställ" }, href: "/bestall" }, { label: { en: "Pricing", sv: "Priser" }, href: "/#priser" }, { label: { en: "API", sv: "API" }, href: "/bestall" }] },
|
|
{ head: { en: "Sources", sv: "Källor" }, links: [{ label: { en: "Sourcing", sv: "Sourcing" }, href: "/#tackning" }, { label: { en: "Freshness", sv: "Färskhet" }, href: "/#tackning" }, { label: { en: "Licenses", sv: "Licenser" }, href: "/#motorn" }] },
|
|
{ head: { en: "Company", sv: "Bolag" }, links: [{ label: { en: "SIAX", sv: "SIAX" }, href: "https://siax.io" }, { label: { en: "Contact", sv: "Kontakt" }, href: "mailto:hej@siax.io" }] },
|
|
{ head: { en: "Legal", sv: "Juridik" }, links: [{ label: { en: "DPA", sv: "DPA" }, href: "/#" }, { label: { en: "Terms", sv: "Villkor" }, href: "/#" }, { label: { en: "Privacy", sv: "Integritet" }, href: "/#" }] },
|
|
];
|
|
|
|
export function FooterSection() {
|
|
const ref = useReveal<HTMLElement>();
|
|
const t = useT();
|
|
return (
|
|
<footer ref={ref} className="dark relative overflow-hidden bg-[#0a0a0a] text-[#fafafa]">
|
|
<div className="mx-auto max-w-[80rem] px-6">
|
|
{/* Columns over a single shared baseline */}
|
|
<div className="grid grid-cols-2 gap-x-10 gap-y-12 border-b border-[#1f1f1f] py-16 md:grid-cols-12">
|
|
<div className="reveal-left col-span-2 md:col-span-5">
|
|
<div className="flex items-center gap-2">
|
|
<span className="font-mono text-[11px] uppercase tracking-[0.18em] text-[#737373]">your data</span>
|
|
<span className="inline-block h-1 w-1 animate-float" style={{ backgroundColor: "var(--accent-red)" }} />
|
|
</div>
|
|
<p className="mt-5 max-w-sm text-[15px] leading-snug text-[#a3a3a3]">
|
|
{t({ en: "On demand. Provenance per field.", sv: "På beställning. Härkomst per fält." })}<br />
|
|
{t({ en: "Nothing guessed.", sv: "Inget gissat." })}
|
|
</p>
|
|
</div>
|
|
{COLUMNS.map((c, i) => (
|
|
<div key={c.head.sv} className={`reveal delay-${i + 1} md:col-span-2`}>
|
|
<h4 className="border-b border-[#1f1f1f] pb-2.5 font-mono text-[10px] uppercase tracking-[0.2em] text-[#737373]">{t(c.head)}</h4>
|
|
<ul className="mt-4 space-y-3">
|
|
{c.links.map((l) => (
|
|
<li key={l.label.sv}>
|
|
<Link
|
|
href={l.href}
|
|
className="group inline-flex items-center gap-2 text-[15px] tracking-[-0.01em] text-[#fafafa] transition-colors hover:text-[#fafafa]"
|
|
>
|
|
<span className="h-px w-0 bg-[#fafafa] transition-all duration-300 group-hover:w-4" />
|
|
<span className="transition-transform duration-300 group-hover:translate-x-0">{t(l.label)}</span>
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Oversized wordmark as graphic texture */}
|
|
<div className="reveal-fade relative py-12">
|
|
<div className="flex items-end justify-between gap-6">
|
|
<span className="select-none font-semibold leading-[0.8] tracking-[-0.05em] text-[#fafafa] text-[clamp(5rem,22vw,17rem)]">
|
|
0pt
|
|
</span>
|
|
<span className="hidden pb-4 text-right font-mono text-[11px] uppercase leading-relaxed tracking-[0.14em] text-[#525252] md:block">
|
|
{t({ en: "Order.", sv: "Beställ." })}<br />{t({ en: "Pay half.", sv: "Betala hälften." })}<br />{t({ en: "Validate.", sv: "Validera." })}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col items-start justify-between gap-2 border-t border-[#1f1f1f] py-6 md:flex-row md:items-center">
|
|
<p className="font-mono text-[10px] uppercase tracking-[0.12em] text-[#525252]">© 2026 SIAX Technology AB</p>
|
|
<p className="font-mono text-[10px] uppercase tracking-[0.12em] text-[#525252]">0pt.app</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|