Responsive
Atoms
FormLabel
Default
Molecules
ContactDetails
Default
Organisms
HeaderMinimal
Default
ServicesGroupFinderBlock
With Results No Results

SupportCtaBlock / Two Cards With Image Promo

2 standard cards with 1 image promo card below

Layout
Properties
JSON format (e.g., [{"LinkText":"Home","LinkUrl":"/"}])
Component Code
@await Html.PartialAsync("~/Components/Organisms/SupportCtaBlock/SupportCtaBlock.cshtml", new SupportCtaBlockProps
{
"Title": "Support for you",
"Cards": [
{
"Type": 0,
"Theme": "purple",
"Title": "Call our free helpline",
"HeadingLevel": 3,
"CssModifier": null,
"Description": {},
"Icon": null,
"ImageHtml": null,
"Button": {
"Variant": "secondary",
"Type": null,
"Disabled": false,
"AriaLabel": null,
"Name": null,
"Value": null,
"Action": null,
"LinkText": "About breast cancer",
"LinkUrl": "#",
"LinkTarget": null,
"IsActive": false
},
"TelephoneNumber": null,
"TelephoneDisplay": null,
"AdditionalText": "Lines open: Monday to Friday - 9am to 4pm; Saturday - 9am to 1pm",
"OpeningHours": null
},
{
"Type": 0,
"Theme": "cream",
"Title": "Call our free helpline",
"HeadingLevel": 3,
"CssModifier": null,
"Description": {},
"Icon": null,
"ImageHtml": null,
"Button": {
"Variant": "secondary",
"Type": null,
"Disabled": false,
"AriaLabel": null,
"Name": null,
"Value": null,
"Action": null,
"LinkText": "About breast cancer",
"LinkUrl": "#",
"LinkTarget": null,
"IsActive": false
},
"TelephoneNumber": null,
"TelephoneDisplay": null,
"AdditionalText": "Lines open: Monday to Friday - 9am to 4pm; Saturday - 9am to 1pm",
"OpeningHours": null
},
{
"Type": 2,
"Theme": "pink",
"Title": "Find support near you",
"HeadingLevel": 3,
"CssModifier": null,
"Description": {},
"Icon": null,
"ImageHtml": {},
"Button": {
"Variant": "primary",
"Type": null,
"Disabled": false,
"AriaLabel": null,
"Name": null,
"Value": null,
"Action": null,
"LinkText": "Find local support",
"LinkUrl": "#",
"LinkTarget": null,
"IsActive": false
},
"TelephoneNumber": null,
"TelephoneDisplay": null,
"AdditionalText": null,
"OpeningHours": null
}
]
})
♿ Accessibility