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

CourseTopicBlock / Varied Content Lengths

Cards with different content lengths to test layout flexibility

Layout
Properties
JSON format (e.g., [{"LinkText":"Home","LinkUrl":"/"}])
Component Code
@await Html.PartialAsync("~/Components/Organisms/CourseTopicBlock/CourseTopicBlock.cshtml", new CourseTopicBlockProps
{
"Title": "Course topics",
"Cards": [
{
"Title": "Short",
"Category": "Module 1",
"Description": "Brief content",
"DescriptionHtml": null,
"ImageHtml": null,
"CssClass": null,
"HeadingLevel": 3,
"Type": 5,
"LinkText": null,
"LinkUrl": "/course/short",
"LinkTarget": null,
"IsActive": false
},
{
"Title": "Understanding Advanced Breast Cancer Treatment and Care",
"Category": "Module 2",
"Description": "This comprehensive module covers advanced breast cancer treatment options, including targeted therapies, immunotherapy, and palliative care approaches. You\u0027ll learn about managing symptoms, making treatment decisions, and accessing support services.",
"DescriptionHtml": null,
"ImageHtml": null,
"CssClass": null,
"HeadingLevel": 3,
"Type": 5,
"LinkText": null,
"LinkUrl": "/course/long",
"LinkTarget": null,
"IsActive": false
},
{
"Title": "Emotional Support",
"Category": "Module 3",
"Description": "Coping strategies and mental health resources",
"DescriptionHtml": null,
"ImageHtml": null,
"CssClass": null,
"HeadingLevel": 3,
"Type": 5,
"LinkText": null,
"LinkUrl": "/course/support",
"LinkTarget": null,
"IsActive": false
}
]
})
♿ Accessibility