Card Component

    Card

    Basic content container component.

    Basic card example:

      Card header
      Card basic content container component.
      Footer

      Usage

      import { Card, CardBody, CardHeader, CardFooter } from '@paljs/ui/Card';

      Colored cards could be simply configured by providing a status property:

        Card header
        Card basic content container component.
        Card header
        Card basic content container component.
        Card header
        Card basic content container component.

        It is also possible to assign an accent property for a slight card highlight as well as combine it with status:

          Card header
          Card basic content container component.
          Card header
          Card basic content container component.
          Card header
          Card basic content container component.

          Multiple Sizes

            Card header
            Card basic content container component.
            Card header
            Card basic content container component.

            Card header container.

            Placeholder which contains a card header content, placed at the very top of the card outside of the scroll area. just html element

            <header></header>

            or

            <CardHeader></CardHeader>

            CardBody

            Card scroll area container.

            <CardBody>body</CardBody>

            Card footer container.

            Placeholder which contains a card footer content, placed at the very bottom of the card outside of the scroll area.

            just html element

            <footer></footer>

            or

            <CardFooter></CardFooter>