Use .card-action class with .card class to create action card. Use .card-action-title for action card title and .card-action-element to warp the actions icons.
.card-action
.card
.card-action-title
.card-action-element
To create a collapsible card, use .card-collapsible class with action item. To show the collapsible content default use .show class with .collapse.
.card-collapsible
.show
.collapse
Click on to see card collapse in action.
To create a card with refresh action, use .card-reload class with action item. Use .card-alert class to show custom response message.
.card-reload
.card-alert
Click on icon to see refresh card content in action.
To create a card with expand(fullscreen) action, use .card-expand class with action item. Use ESC key to exit from the fullscreen mode.
.card-expand
Click on icon to see expand card in action.
Remove card action hide the card, use .card-close class with action item.
.card-close
Click on icon to see remove card in action.
Sample card header with badge.
Sample card title with outline badge.
Sample card header with extra small button.
Sample card title with small icon button.
Sample card header with extra search input box.
Sample card title with switch.
Sample card header with text.
Sample card title with text.
Sample card header with badge and dropdown.
Sample card title with switch, select box & button.
Some quick example text to build on the card title and make up.