1
 2/**
 3 * Badges
 4 * --------------------------------------------------
 5 */
 6
 7.badge {
 8  @include badge-style($badge-default-bg, $badge-default-text);
 9  z-index: $z-index-badge;
10  display: inline-block;
11  padding: 3px 8px;
12  min-width: 10px;
13  border-radius: $badge-border-radius;
14  vertical-align: baseline;
15  text-align: center;
16  white-space: nowrap;
17  font-weight: $badge-font-weight;
18  font-size: $badge-font-size;
19  line-height: $badge-line-height;
20
21  &:empty {
22    display: none;
23  }
24}
25
26//Be sure to override specificity of rule that 'badge color matches tab color by default'
27.tabs .tab-item .badge,
28.badge {
29  &.badge-light {
30    @include badge-style($badge-light-bg, $badge-light-text);
31  }
32  &.badge-stable {
33    @include badge-style($badge-stable-bg, $badge-stable-text);
34  }
35  &.badge-positive {
36    @include badge-style($badge-positive-bg, $badge-positive-text);
37  }
38  &.badge-calm {
39    @include badge-style($badge-calm-bg, $badge-calm-text);
40  }
41  &.badge-assertive {
42    @include badge-style($badge-assertive-bg, $badge-assertive-text);
43  }
44  &.badge-balanced {
45    @include badge-style($badge-balanced-bg, $badge-balanced-text);
46  }
47  &.badge-energized {
48    @include badge-style($badge-energized-bg, $badge-energized-text);
49  }
50  &.badge-royal {
51    @include badge-style($badge-royal-bg, $badge-royal-text);
52  }
53  &.badge-dark {
54    @include badge-style($badge-dark-bg, $badge-dark-text);
55  }
56}
57
58// Quick fix for labels/badges in buttons
59.button .badge {
60  position: relative;
61  top: -1px;
62}