CTA Split
No description available
---
import CtaSplit from "@components/page-sections/ctas/cta-split.astro";
import Button from "@components/building-blocks/core-elements/button.astro";
---
<CtaSplit
buttonSections={
[
{
"_component": "building-blocks/core-elements/button",
"text": "Create workspace",
"variant": "primary",
"size": "md",
"link": "/workspace"
},
{
"_component": "building-blocks/core-elements/button",
"text": "Invite team",
"variant": "secondary",
"size": "md",
"link": "/invite"
}
]
} heading="Keep your team aligned" imageAlt="Sunset." imageSource="/src/assets/images/component-library/sunset.jpg" subtext="Drop structured CTAs between sections to reinforce the next step."
/> ---
blocks:
_component: page-sections/ctas/cta-split
heading: Keep your team aligned
subtext: Drop structured CTAs between sections to reinforce the next step.
imageSource: /src/assets/images/component-library/sunset.jpg
imageAlt: Sunset.
buttonSections:
- _component: building-blocks/core-elements/button
text: Create workspace
variant: primary
size: md
link: /workspace
- _component: building-blocks/core-elements/button
text: Invite team
variant: secondary
size: md
link: /invite
--- Overview
Use when you need the headline and supporting text to stay readable while giving the buttons their own column, with colorScheme and backgroundColor props to blend into different sections.
Properties
No properties available. Make sure the component has a valid .cloudcannon.structure-value.yml file.