CardFooter

Available Variants

CardFooter is available in a few variants. Be sure to use the appropriate variant for your intent.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis pretium massa. Aliquam erat volutpat. Nulla facilisi.

Success Footer Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis pretium massa. Aliquam erat volutpat. Nulla facilisi.

Warning Footer Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis pretium massa. Aliquam erat volutpat. Nulla facilisi.

Danger Footer Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis pretium massa. Aliquam erat volutpat. Nulla facilisi.

<DemoLayout>
  <Card>
    <CardBlock>{loremIpsum}</CardBlock>
    <CardFooter title="Success Footer Title" variant="success">
      <CardBlock>{loremIpsum}</CardBlock>
    </CardFooter>
  </Card>

  <Card>
    <CardBlock>{loremIpsum}</CardBlock>
    <CardFooter title="Warning Footer Title" variant="warning">
      <CardBlock>{loremIpsum}</CardBlock>
    </CardFooter>
  </Card>

  <Card>
    <CardBlock>{loremIpsum}</CardBlock>
    <CardFooter title="Danger Footer Title" variant="danger">
      <CardBlock>{loremIpsum}</CardBlock>
    </CardFooter>
  </Card>
</DemoLayout>