Card Actions

Action Icon Details
Collapse Collapse card content using collapse action.
Expand Card Maximize your card using expand action
Refresh Content Refresh your card content using refresh action.
Remove Card Remove card from page using remove card action


You can create a collapsible content by by adding [data-action="collapse"] and wrapping it up with .heading-elements in .card-header

Click on to see card collapse in action

Refresh Content

To create a card with refresh action use [data-action="reload"] inside of .heading-element

Click on icon to see refresh card content in action.

Remove Card

You can create a closeable card by using [data-action="close"] inside .heading-element

Click on icon to see closeable card in action.

Expand Card

Use [data-action="expand"] insdie of .heading-elements to maximize your card.

Click on icon to see close card in action.