Patterns
CTA Section
The closing call-to-action panel with a radial wash blooming from its top edge.
The closing call-to-action band: a large rounded panel with a soft radial wash blooming from its top edge, a headline, a line of copy and the action.
Extracted from Yunxin, where the same panel closes both the landing page and the Fellows page.
Import
tsx
1import { CTASection } from "@yuhuanowo/yunui/patterns";Basic
CTA
Ready when you are.
Install the package, wire the adapter, ship the first screen this afternoon.
With an eyebrow
With eyebrow
Fellows
Applications close in April.
Six weeks, fully funded.
Props
CTASection also forwards any <div> HTML attributes.
| Prop | Type | Default | Description |
|---|---|---|---|
| actions | ReactNode | — | The call to action — a Button, or a pair of them. |
| animate | boolean | true | Play the staggered entrance animation. |
| body | ReactNode | — | Supporting line under the headline. |
| eyebrow | ReactNode | — | Small label above the headline (an {@link Eyebrow }, a badge). |
| title* | ReactNode | — | Headline. |