// Requires one of the contextual, color modifier classes for `color` and
// `background-color`.
- .label {
+ .tag {
display: inline-block;
- padding: $label-padding-y $label-padding-x;
- font-size: $label-font-size;
- font-weight: $label-font-weight;
- padding: .25em .4em;
- font-size: 75%;
++ padding: $tag-padding-y $tag-padding-x;
++ font-size: $tag-font-size;
+ font-weight: $tag-font-weight;
line-height: 1;
- color: $label-color;
+ color: $tag-color;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
//
// Make them extra rounded with a modifier to replace v3's badges.
- .label-pill {
- padding-right: $label-pill-padding-x;
- padding-left: $label-pill-padding-x;
- @include border-radius($label-pill-border-radius);
+ .tag-pill {
- padding-right: .6em;
- padding-left: .6em;
- // Use a higher than normal value to ensure completely rounded edges when
- // customizing padding or font-size on labels.
- @include border-radius(10rem);
++ padding-right: $tag-pill-padding-x;
++ padding-left: $tag-pill-padding-x;
++ @include border-radius($tag-pill-border-radius);
}
// Colors
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
- // Labels
-
- $label-default-bg: $gray-light !default;
- $label-primary-bg: $brand-primary !default;
- $label-success-bg: $brand-success !default;
- $label-info-bg: $brand-info !default;
- $label-warning-bg: $brand-warning !default;
- $label-danger-bg: $brand-danger !default;
-
- $label-color: #fff !default;
- $label-link-hover-color: #fff !default;
- $label-font-size: 75% !default;
- $label-font-weight: bold !default;
- $label-padding-x: .4em !default;
- $label-padding-y: .25em !default;
-
- $label-pill-padding-x: .6em !default;
+ // Tags
+
-$tag-default-bg: $gray-light !default;
-$tag-primary-bg: $brand-primary !default;
-$tag-success-bg: $brand-success !default;
-$tag-info-bg: $brand-info !default;
-$tag-warning-bg: $brand-warning !default;
-$tag-danger-bg: $brand-danger !default;
-
-$tag-color: #fff !default;
-$tag-link-hover-color: #fff !default;
-$tag-font-weight: bold !default;
-
++$tag-default-bg: $gray-light !default;
++$tag-primary-bg: $brand-primary !default;
++$tag-success-bg: $brand-success !default;
++$tag-info-bg: $brand-info !default;
++$tag-warning-bg: $brand-warning !default;
++$tag-danger-bg: $brand-danger !default;
++
++$tag-color: #fff !default;
++$tag-link-hover-color: #fff !default;
++$tag-font-size: 75% !default;
++$tag-font-weight: bold !default;
++$tag-padding-x: .4em !default;
++$tag-padding-y: .25em !default;
++
++$tag-pill-padding-x: .6em !default;
+// Use a higher than normal value to ensure completely rounded edges when
+// customizing padding or font-size on labels.
- $label-pill-border-radius: 10rem !default;
++$tag-pill-border-radius: 10rem !default;
// Modals