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

StoryCarousel / Custom Heading

Carousel with a custom heading

Layout
Properties
JSON format (e.g., [{"LinkText":"Home","LinkUrl":"/"}])
JSON format (e.g., [{"LinkText":"Home","LinkUrl":"/"}])
Component Code
@await Html.PartialAsync("~/Components/Organisms/StoryCarousel/StoryCarousel.cshtml", new StoryCarouselProps
{
"Heading": "Real Stories of Hope",
"Stories": [
{
"Title": "David\u0027s Story",
"Description": "I had no idea men could get breast cancer",
"ImageHtml": {},
"LinkText": "Read David\u0027s story",
"LinkUrl": "#david-story",
"LinkTarget": null,
"IsActive": false
},
{
"Title": "Kreena\u0027s Story",
"Description": "The next few months were a blur of biopsies",
"ImageHtml": {},
"LinkText": "Read Kreena\u0027s story",
"LinkUrl": "#kreena-story",
"LinkTarget": null,
"IsActive": false
}
],
"CtaButton": {
"Variant": "primary",
"Type": null,
"Disabled": false,
"AriaLabel": null,
"Name": null,
"Value": null,
"Action": null,
"LinkText": "View all stories",
"LinkUrl": "#all-stories",
"LinkTarget": null,
"IsActive": false
}
})
♿ Accessibility