ZacharyZhang-NY
b1e2374c7b
Foundation for the adaline-based landing rebuild: - globals.css: warm-cream light theme + Material-3 dark theme mapped onto the existing CSS-var names; CSS-keyframe entrance + IntersectionObserver reveal motion (to replace framer-motion incrementally) - layout.tsx: self-host Instrument Sans/Serif, Newsreader and JetBrains Mono via next/font/google; drop the external Google Fonts <link> - _headers: tighten CSP style/font-src to 'self' now that fonts are local - components/ui: Container, Reveal, Eyebrow, Badge, Button, SectionHeading - lib/landing-content.ts: feature-section copy for the six product screens - public/images: six product screenshots optimized to WebP - add reicon-react/reicon-brands (bundled, CSP-safe SVG icons) Business logic (D1 download counter, platform metadata, theme, SEO) unchanged.
25 lines
572 B
TypeScript
25 lines
572 B
TypeScript
import type { ReactNode } from "react";
|
|
|
|
/** Rounded meadow pill, optionally a link. */
|
|
export function Badge({
|
|
children,
|
|
href,
|
|
className = "",
|
|
}: {
|
|
children: ReactNode;
|
|
href?: string;
|
|
className?: string;
|
|
}) {
|
|
const classes = `eyebrow inline-flex items-center gap-1.5 self-start rounded-full px-3 py-1.5 text-sm bg-[var(--accent-soft)] text-[var(--accent)] transition-colors ${className}`;
|
|
|
|
if (href) {
|
|
return (
|
|
<a href={href} className={classes}>
|
|
{children}
|
|
</a>
|
|
);
|
|
}
|
|
|
|
return <span className={classes}>{children}</span>;
|
|
}
|