Improve this doc View source

pfAggregateStatusCard
directive in module patternfly.card

Deprecated API {boolean=} alt-layout Display the aggregate status card in a 'alternate tall' layout. false (default) displays normal layout, true displays tall layout

Description

Directive for easily displaying status information

Usage

as attribute
<ANY pf-aggregate-status-card
     status="{object}"
     [show-top-border="{boolean}"]
     [layout="{string}"]>
   ...
</ANY>

Parameters

ParamTypeDetails
statusobject

Status configuration information

  • .title - the main title of the aggregate status card
  • .count - the number count of the main statuses
  • .href - the href to navigate to if one clicks on the title or count
  • .iconClass - an icon to display to the left of the count
  • .iconImage - an image to display to the left of the count
  • .notifications - an array of status icons & counts
    • .iconClass - an icon to display to the right of the notification count
    • .iconImage - an image to display to the left of the notification count
    • .count - the number count of the notification status
    • .href - href to navigate to if one clicks on the notification status icon or count
When layout='mini', only one notification can be specified:
  • ...
  • .notification - an object of containing a single notification icon & count
    • .iconClass - an icon to display to the right of the notification count
    • .iconImage - an image to display to the left of the notification count
    • .count - the number count of the notification status
    • .href - href to navigate to if one clicks on the notification status icon or count
show-top-border
(optional)
boolean

Show/hide the top border, true shows top border, false (default) hides top border

layout
(optional)
string

Various alternative layouts the aggregate status card may have:

  • 'mini' displays a mini aggregate status card. Note: when using 'mini' layout, only one notification can be specified in the status object
  • 'tall' displays a tall aggregate status card. This equals the depreciated 'alt-layout' param.

Example

Source





Demo