Components

A container for grouping and displaying related content or actions.

Users
Manage user accounts and permissions.

Installation

npm install @mijn-ui/react-card
import {
  Card,
  CardContent,
  CardDescription,
  CardFooter,
  CardHeader,
  CardTitle,
} from "@mijn-ui/react-card"
<Card>
  <CardHeader>
    <CardTitle>Card Title</CardTitle>
    <CardDescription>Card Description</CardDescription>
  </CardHeader>
  <CardContent>
    <p>Card Content</p>
  </CardContent>
  <CardFooter>
    <p>Card Footer</p>
  </CardFooter>
</Card>

Examples

Stats Card

Total Sales
$75,890.75

+128% from June


API Reference

Standard element attributes are forwarded to the underlying component in addition to the props below.

PropTypeDefaultDescription
unstyledbooleanfalseOpt out of the default styles to fully customize the component.
classNamesobjectOverride classes per slot (see Style Slots below).
classNamestringAdditional classes for the root element.

Card Style Slots

Slot NameTargeted ComponentPurpose
baseCardStyles the root card component.
headerCardHeaderStyles the card header.
contentCardContentStyles the card content area.
footerCardFooterStyles the card footer.
titleCardTitleStyles the card title.
descriptionCardDescriptionStyles the card description text.