MichilisandClaude Opus 5
e4eb1617d1
GSAP carries the counter roll-ups, the bandeja card physics, the dialog transitions and the three success moments FLOWS.md allows. Every one of them checks prefers-reduced-motion first and does nothing when it is set. boneyard and canvas-ui are not what SPEC.md's stack table says they are: on npm the names belong to two abandoned projects that do neither job. The skeletons were already ours; the two canvas spots are now sixty lines each with no dependency. DECISIONS.md records the substitution. The app installs, keeps a scan taken with no network in IndexedDB and sends it when there is one, falls back to a page that explains itself, and can push a deadline notice. Reading the log of what is queued is the source of truth, so the notice clears when the capture actually lands. The CSP now allows scripts by per-request nonce rather than by 'unsafe-inline'. That forced /offline to render per request: a prerendered page carries a build-time nonce no live policy matches, so its scripts were blocked and it never hydrated. Two crashes fixed on the way. web-push throws on a VAPID subject that is not https: or mailto:, and the code handed it APP_PUBLIC_URL, so any machine with push keys died at boot; a misconfigured optional channel now switches itself off and says why. And a subscription the push service answers 410 for is deleted rather than retried forever. Lighthouse on the production build: accessibility 100, best practices 96, SEO 100, performance 73. The performance number is not trustworthy on this machine and DECISIONS.md says why; total blocking time did fall from 17.6s to 1.7s once the hero canvas stopped drawing at full resolution every frame and the landing page stopped importing GSAP. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
53 lines
1.9 KiB
TypeScript
53 lines
1.9 KiB
TypeScript
import { setRequestLocale } from 'next-intl/server';
|
|
import { HeroCanvas } from '@/components/canvas/hero-canvas';
|
|
import { Card } from '@/components/ui/card';
|
|
import { getT } from '@/i18n/t';
|
|
import { RucHook } from './ruc-hook';
|
|
|
|
export default async function LandingPage({ params }: { params: Promise<{ locale: string }> }) {
|
|
const { locale } = await params;
|
|
setRequestLocale(locale);
|
|
const t = await getT(locale);
|
|
|
|
const values = [
|
|
{ title: t('landing.value1.title'), body: t('landing.value1.body') },
|
|
{ title: t('landing.value2.title'), body: t('landing.value2.body') },
|
|
{ title: t('landing.value3.title'), body: t('landing.value3.body') },
|
|
];
|
|
|
|
return (
|
|
<div className="mx-auto w-full max-w-5xl px-5">
|
|
{/* The one hero effect FLOWS.md A1 allows, behind the content and off under
|
|
reduced motion. */}
|
|
<section className="relative isolate py-14 sm:py-20">
|
|
<HeroCanvas />
|
|
<h1 className="max-w-2xl text-4xl font-semibold tracking-tight text-balance sm:text-5xl">
|
|
{t('landing.hero.title')}
|
|
</h1>
|
|
<p className="mt-4 max-w-xl text-lg text-[var(--text-muted)] text-pretty">
|
|
{t('landing.hero.subtitle')}
|
|
</p>
|
|
<div className="mt-8 max-w-md">
|
|
<RucHook />
|
|
</div>
|
|
</section>
|
|
|
|
<section className="grid gap-4 pb-14 sm:grid-cols-3">
|
|
{values.map((value) => (
|
|
<Card key={value.title} className="space-y-2">
|
|
<h2 className="font-semibold tracking-tight">{value.title}</h2>
|
|
<p className="text-sm text-[var(--text-muted)] text-pretty">{value.body}</p>
|
|
</Card>
|
|
))}
|
|
</section>
|
|
|
|
<section className="pb-16">
|
|
<Card className="space-y-2">
|
|
<h2 className="font-semibold tracking-tight">{t('landing.pricing.title')}</h2>
|
|
<p className="text-sm text-[var(--text-muted)]">{t('landing.pricing.body')}</p>
|
|
</Card>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|