Badges

Global variables

$badge-class: "-badge" !global
$badge-font-weight: 600 !global
$badge-border-radius: 50px !global
$badge-border-width: 0px !global
$badge-border-style: solid !global
$badge-padding-vertical: floor($base-padding-vertical / 4)
$badge-padding-horizontal: floor($base-padding-horizontal / 2)

Use widget class -badge. Apply themes and sizes.

324 324 324 324

324 324 324 324 324

default
primary
error
warning

normal
major
big
huge
divine

Use badges inside other widgets.

Badges won't self collapse in Internet Explorer 8 because it lacks support for the :empty selector.
Inbox 12 Inbox 12 Inbox 12 Empty badge is here


Inbox 12
Inbox 12
Inbox 12
Empty badge is here