Interactive Cards
Expandable Card
The ExpandableCard component allows you to create a card that can be expanded to show more content. This is useful for displaying additional information without overwhelming the user with too much content at once.
To use the ExpandableCard component, simply wrap your content inside the ExpandableCard tags. You can customize the height of the card when it is collapsed and the width of the expand/collapse button.
Default expandable card
Lorem ipsum, consectetur adipiscing elit. Nullam pulvinar risus non risus hendrerit venenatis. Pellentesque sit amet hendrerit risus, sed porttitor quam. ipsum dolor sit amet, consectetur adipiscing elit. Nullam pulvinar risus non risus hendrerit venenatis. Pellentesque sit amet hendrerit risus, sed porttitor quam. Magna exercitation reprehenderit magna cillum tempor amet aliquip ullamco.Customize the height & button width
Lorem ipsum, consectetur adipiscing elit. Nullam pulvinar risus non risus hendrerit venenatis. Pellentesque sit amet hendrerit risus, sed porttitor quam. ipsum dolor sit amet, consectetur adipiscing elit. Nullam pulvinar risus non risus hendrerit venenatis. Pellentesque sit amet hendrerit risus, sed porttitor quam. Magna exercitation reprehenderit magna cillum tempor amet aliquip ullamco.Expandable Card Props
| Prop | Type | Default |
|---|---|---|
height | css value | 8rem |
wide | boolean | false |
className | string | empty string |