mmintelandClaude Opus 5.5
75993100fa
The site now exists in German (at the root, with /impressum and /datenschutz) and English (/en). A request without a language follows the visitor's choice from the language switch, then the browser language, then German; the old English legal addresses move to /en for good. All visible texts are data in src/content/de.ts and en.ts, so components hold none of their own. The header carries a DE/EN switch whose bit curtain covers the page while it is swapped and reopens at the same reading position. Title, description, canonical, hreflang, Open Graph, the share image, the sitemap and the structured data are per language. The privacy notice now describes the cookie that remembers the chosen language. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
79 lines
2.8 KiB
TypeScript
79 lines
2.8 KiB
TypeScript
"use client";
|
|
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import * as React from "react";
|
|
|
|
import LogoBlack from "../assets/logo/Logo-Black-Transparent.svg";
|
|
import { pathFor } from "@/src/domain/routes";
|
|
import { BinaryTicker } from "./bits/BinaryTicker";
|
|
import { useContent, useLocale } from "./ContentProvider";
|
|
import { LanguageSwitch } from "./LanguageSwitch";
|
|
|
|
export const Footer: React.FC = () => {
|
|
const { nav } = useContent();
|
|
const locale = useLocale();
|
|
const currentYear = new Date().getFullYear();
|
|
|
|
return (
|
|
<footer className="relative py-10 md:py-16 mt-8 md:mt-24 border-t border-slate-100 bg-white z-10">
|
|
{/* Tech border at top */}
|
|
<div className="absolute top-0 left-0 right-0 h-px overflow-hidden">
|
|
<div
|
|
className="h-full w-full"
|
|
style={{
|
|
background:
|
|
"linear-gradient(90deg, transparent 0%, rgba(148, 163, 184, 0.15) 25%, rgba(191, 206, 228, 0.1) 50%, rgba(148, 163, 184, 0.15) 75%, transparent 100%)",
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div className="mx-auto w-full max-w-[1400px] px-5 md:px-12">
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-12 items-end">
|
|
<div className="space-y-6">
|
|
<div className="flex items-center gap-3">
|
|
<Image
|
|
src={LogoBlack}
|
|
alt="Marc Mintel"
|
|
height={64}
|
|
className="h-12 md:h-16 w-auto"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex flex-col md:items-end gap-3 md:gap-4 text-xs md:text-sm font-mono text-slate-300 uppercase tracking-widest">
|
|
<span>© {currentYear}</span>
|
|
<div className="flex flex-wrap gap-x-8 gap-y-3 md:justify-end">
|
|
<Link
|
|
href={`${pathFor("home", locale)}#contact`}
|
|
className="hover:text-slate-900 transition-colors duration-300 no-underline"
|
|
>
|
|
{nav.contactLong}
|
|
</Link>
|
|
<Link
|
|
href={pathFor("imprint", locale)}
|
|
className="hover:text-slate-900 transition-colors duration-300 no-underline"
|
|
>
|
|
{nav.imprint}
|
|
</Link>
|
|
<Link
|
|
href={pathFor("privacy", locale)}
|
|
className="hover:text-slate-900 transition-colors duration-300 no-underline"
|
|
>
|
|
{nav.privacy}
|
|
</Link>
|
|
</div>
|
|
<LanguageSwitch variant="text" />
|
|
{/* Subtle binary decoration */}
|
|
<span className="flex gap-3 text-[8px] text-slate-300 tracking-[0.5em] select-none font-mono">
|
|
{[77, 73, 78].map((code) => (
|
|
<BinaryTicker key={code} value={code} alive />
|
|
))}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
};
|