Description
Badges are a useful way of showing some additional information about an item - its status, for example.
Standard badges
Standard badges receive the base class ipsBadge, and then one or more of the options shown below.
Badge styles
ipsBadge_new
Badge
ipsBadge_style2
Badge
ipsBadge_warning
Badge
ipsBadge_positive
Badge
ipsBadge_negative
Badge
ipsBadge_neutral
Badge
ipsBadge_intermediary
Badge
Badge sizes
ipsBadge_normal (default)
Badge
ipsBadge_medium
Badge
ipsBadge_large
Badge
Icon badges
Any of the above classes can used to create icon badges by adding the additional ipsBadge_icon class, and using a FontAwesome icon as the badge content. For example:
Status badges
"Status badges" is the term we use to denote the icons shown in datalists, record tables etc. that indicate the read/unread status of the icon to the user. They are separate to the badges described above and don't use the same classes.
The base class for status badges is ipsItemStatus, with additional options shown below.
ipsItemStatus_tiny
Shows a tiny status indicator. Include an icon (usually fa-circle) as the content of the element.
ipsItemStatus_small
Shows a small status indicator. Include an icon (usually fa-circle) as the content of the element.
ipsItemStatus_large
Shows a full status indicator. The indicator can be customized with an icon by including it as the content of the element:
<span class='ipsItemStatus ipsItemStatus_large'> <i class='fa fa-comments'></i> </span>
ipsItemStatus_read
The 'read' status of the badge, causing it to fade out (a convention for read content in the IPS Community Suite).
Report Guide