PUI.Card (pui v1.0.0)

Copy Markdown

Card primitives for grouping related content.

The Card family is composed from a container and optional header, title, description, action, content, and footer sections.

Examples

<.card>
  <.card_header>
    <.card_title>Profile</.card_title>
    <.card_description>Manage your account details.</.card_description>
  </.card_header>
  <.card_content>Card content.</.card_content>
  <.card_footer>
    <.button>Save</.button>
  </.card_footer>
</.card>

Attributes

ComponentAttributes
card/1class, global HTML attributes
card_title/1, card_description/1class
card_footer/1class
card_header/1, card_description/1, card_action/1, card_content/1none

Slots

All Card family components accept an inner_block slot.

Summary

Functions

card(assigns)

Attributes

  • class (:string) - Defaults to "".
  • Global attributes are accepted.

Slots

  • inner_block

card_action(assigns)

Slots

  • inner_block

card_content(assigns)

Slots

  • inner_block

card_description(assigns)

Attributes

  • class (:string) - Defaults to "".

Slots

  • inner_block

card_footer(assigns)

Attributes

  • class (:string) - Defaults to "".

Slots

  • inner_block

card_header(assigns)

Slots

  • inner_block

card_title(assigns)

Attributes

  • class (:string) - Defaults to "".

Slots

  • inner_block