ZacharyZhang-NY
c0f677ccc9
- navbar: sticky, transparent to blur-on-scroll, wordmark + mono nav links + theme toggle + Download CTA, Reicon Menu/Xmark icons (components/layout) - theme-toggle: Reicon Sun/Moon icons - hero: meadow badge, tight Instrument Sans headline, Download + How-it-works CTAs, availability line, framed dashboard shot (components/sections) - features: five stacked heading-over-panel sections mapping the org chart, office, messages, connectors and cost-control screens - ui/media-frame: shared framed product-shot panel - reveal: progressive enhancement — content is visible without JS and only hidden once the js class is present, then revealed on scroll - remove the superseded flat navbar/hero/features components Verified: next build green; desktop + mobile screenshots reviewed.
19 lines
757 B
TypeScript
19 lines
757 B
TypeScript
import { Reveal } from "../ui/reveal";
|
|
import { SectionHeading } from "../ui/section-heading";
|
|
import { MediaFrame } from "../ui/media-frame";
|
|
import type { FeatureSection as FeatureSectionData } from "../../lib/landing-content";
|
|
|
|
/** One feature: heading + subhead above a full-width product panel (adaline rhythm). */
|
|
export function FeatureSection({ feature }: { feature: FeatureSectionData }) {
|
|
return (
|
|
<div id={feature.id} className="flex scroll-mt-24 flex-col gap-8 md:gap-10">
|
|
<Reveal>
|
|
<SectionHeading eyebrow={feature.eyebrow} title={feature.title} description={feature.description} />
|
|
</Reveal>
|
|
<Reveal delay={90}>
|
|
<MediaFrame src={feature.image} alt={feature.imageAlt} />
|
|
</Reveal>
|
|
</div>
|
|
);
|
|
}
|