Card can be used to container a groups of related content.
Some quick example text to build on the card title and make up the bulk of the card's content.
Some quick example text to build on the card title and make up the bulk of the card's content.
bodyClass, headerClass & footerClass to correspond section.Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum
click prop to true to make cursor become pointer.Some quick example text to build on the card title and make up the bulk of the card's content.
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry.
| Prop | Description | Type | Default |
|---|---|---|---|
| header | Card header config | { content?: string | ReactNode, className?: string, bordered?: boolean, extra?: string | ReactNode } | - |
| footer | Card footer config | { content?: string | ReactNode, className?: string, bordered?: boolean } | - |
| bordered | Display Card with border (without shadow-sm) | boolean | false |
| clickable | Make cursor become pointer upon hover | boolean | false |
| bodyClass | Apply class to card body | string | - |
| onClick | Callback when Card is clicked | (e: MouseEvent) => void | - |