mirror of
https://github.com/logos-co/logos-web.git
synced 2026-08-31 06:01:26 +00:00
jinhojang6
2771e99d32
Move the hero and choose-your-path card sections out of sections/home so pages other than the homepage can compose them, extract the two-line statement heading, and lift CenterCtaSection out of the Movement page's private atoms module. The hero now takes an optional `background` node, defaulting to the same Logos background video the homepage has always rendered. Rendered output is unchanged: the homepage's hero, social proof, and choose-your-path markup and the Movement page body are byte-identical to develop, and the generated stylesheet loses no rules.
27 lines
1.1 KiB
TypeScript
27 lines
1.1 KiB
TypeScript
interface StatementHeadingProps {
|
|
/** Leading line, rendered in the primary text colour. */
|
|
headline: string
|
|
/** Continuation line, rendered muted so the first line reads as the claim. */
|
|
headlineMuted: string
|
|
}
|
|
|
|
/**
|
|
* Two-line display statement ("Logos is not for everyone. / Logos is for
|
|
* people who are done waiting for permission.") shared by the home social
|
|
* proof section and the /build-the-parallel page.
|
|
*
|
|
* Deliberately renders only the `<h2>`: the surrounding flex wrapper and CTA
|
|
* row differ per page, so each caller owns its own spacing.
|
|
*/
|
|
export default function StatementHeading({
|
|
headline,
|
|
headlineMuted,
|
|
}: StatementHeadingProps) {
|
|
return (
|
|
<h2 className="w-[351.5px] max-w-[calc(100vw-50.5px)] text-center font-display text-[24px] leading-none tracking-[-0.72px] whitespace-pre-wrap text-brand-dark-green [text-box-edge:cap_alphabetic] [text-box-trim:trim-both] [word-break:break-word] md:w-full md:max-w-[853px] md:text-[56px] md:tracking-[-0.03em]">
|
|
<span className="block">{headline}</span>
|
|
<span className="block text-[#848e88]">{headlineMuted}</span>
|
|
</h2>
|
|
)
|
|
}
|