mirror of
https://github.com/zap-proto/zap-proto.github.io.git
synced 2026-10-30 15:02:56 +00:00
zeekay
7bf80b399b
Single static deploy serves three custom domains; brand swaps client-side
on first effect:
zap-proto.io → developer brand ("Infinitely faster.")
zap-proto.dev → developer brand
zerocopy.app → marketing brand (ZApps, "future of I/O is here")
zap-protocol.github.io → developer (legacy fallback, 301-target zap-proto.io)
Adds:
- lib/brand.ts: hostname → brand resolver + per-brand copy
- components/brand-hero.tsx: hero swaps tagline/headline/CTA per brand
- components/zapps-pillars.tsx: less-memory / lower-latency / future-proof
- components/protocol-family.tsx: zap-{http,ws,fix,rns,mcp,acp,a2a,base}
showcase, status badges, links to github.com/zap-proto/<slug>
- public/CNAME: zap-proto.io (canonical apex)
Repo references migrated zap-protocol → zap-proto throughout site code,
docs, MDX. Old org redirects automatically; explicit stub READMEs land
via migration/migrate.sh once org membership is in place.
Build verified: pnpm build → 13 static pages, no errors.
67 lines
2.5 KiB
TypeScript
67 lines
2.5 KiB
TypeScript
'use client';
|
|
|
|
// Brand-aware hero. Same visual frame; copy swaps based on which custom
|
|
// domain serves the request (zap-proto.io = developer, zerocopy.app =
|
|
// marketing). Brand detection lives in lib/brand.ts.
|
|
|
|
import Link from 'next/link';
|
|
import { ArrowRight } from 'lucide-react';
|
|
import { useBrand, brandCopy } from '@/lib/brand';
|
|
|
|
export function BrandHero() {
|
|
const brand = useBrand();
|
|
const copy = brandCopy[brand];
|
|
|
|
return (
|
|
<section className="relative flex flex-col items-center justify-center px-6 py-28 text-center bg-gradient-to-b from-fd-background to-fd-card">
|
|
<div className="absolute inset-0 overflow-hidden pointer-events-none">
|
|
<div className="absolute top-1/4 left-1/4 w-96 h-96 bg-blue-500/10 rounded-full blur-3xl" />
|
|
<div className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-blue-500/5 rounded-full blur-3xl" />
|
|
</div>
|
|
|
|
<div className="relative z-10 max-w-4xl mx-auto">
|
|
<div className="flex items-center justify-center gap-3 mb-6">
|
|
<span className="text-6xl rotate-[-15deg] inline-block">⚡</span>
|
|
<h1 className="text-5xl font-bold tracking-tight md:text-7xl">{copy.name}</h1>
|
|
</div>
|
|
|
|
<p className="text-2xl md:text-3xl text-blue-400 font-semibold mb-6">
|
|
{copy.tagline}
|
|
</p>
|
|
|
|
<p className="text-xl text-fd-muted-foreground max-w-3xl mx-auto mb-4">
|
|
{copy.headline}
|
|
</p>
|
|
|
|
<p className="text-lg text-fd-muted-foreground max-w-2xl mx-auto mb-8">
|
|
{copy.subheadline}
|
|
</p>
|
|
|
|
<div className="flex flex-wrap items-center justify-center gap-4">
|
|
<Link
|
|
href={copy.ctaPrimary.href}
|
|
className="inline-flex items-center gap-2 px-6 py-3 text-lg font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-500 transition-colors"
|
|
>
|
|
{copy.ctaPrimary.label}
|
|
<ArrowRight className="w-5 h-5" />
|
|
</Link>
|
|
<Link
|
|
href={copy.ctaSecondary.href}
|
|
className="inline-flex items-center gap-2 px-6 py-3 text-lg font-medium border border-fd-border rounded-lg hover:bg-fd-accent transition-colors"
|
|
>
|
|
{copy.ctaSecondary.label}
|
|
</Link>
|
|
<a
|
|
href={copy.githubUrl}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="inline-flex items-center gap-2 px-6 py-3 text-lg font-medium border border-fd-border rounded-lg hover:bg-fd-accent transition-colors"
|
|
>
|
|
GitHub
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|