I want to ask if there are classes for adding hover and selected styles for the Card?
Would also like the card to act as one big button.
1 Answer, 1 is accepted
answered on 07 Dec 2021, 05:16 PM
It is possible to add a hover style to the Card like this:
<TelerikCardWidth="300px"Class="hoverable-card"><CardHeader><CardTitle>Tourism</CardTitle></CardHeader><CardImageSrc="https://docs.telerik.com/blazor-ui/components/card/images/rome.jpg"></CardImage><CardBody><CardTitle>Rome</CardTitle><CardSeparator></CardSeparator><CardSubTitle>Capital of Italy</CardSubTitle></CardBody><CardFooter>
However, I can't think of a way to achieve the other two requirements - a selected style and click behavior.
The Card is designed to be presentation component, not an interaction component in its core essence. Surely, the Card content can hold interaction components inside it - for example, like in the Actions and Data Cards demos.
If you want to highlight a Card action or state, I can suggest you to use custom CSS classes that change, depending on user behavior. It is also possible for the custom CSS class of a Card to affect child content inside it.