1234567891011121314151617181920212223242526272829303132333435363738 |
- // Base class
- //
- // Requires one of the contextual, color modifier classes for `color` and
- // `background-color`.
-
- .badge {
- // scss-docs-start badge-css-vars
- --#{$prefix}badge-padding-x: #{$badge-padding-x};
- --#{$prefix}badge-padding-y: #{$badge-padding-y};
- @include rfs($badge-font-size, --#{$prefix}badge-font-size);
- --#{$prefix}badge-font-weight: #{$badge-font-weight};
- --#{$prefix}badge-color: #{$badge-color};
- --#{$prefix}badge-border-radius: #{$badge-border-radius};
- // scss-docs-end badge-css-vars
-
- display: inline-block;
- padding: var(--#{$prefix}badge-padding-y) var(--#{$prefix}badge-padding-x);
- @include font-size(var(--#{$prefix}badge-font-size));
- font-weight: var(--#{$prefix}badge-font-weight);
- line-height: 1;
- color: var(--#{$prefix}badge-color);
- text-align: center;
- white-space: nowrap;
- vertical-align: baseline;
- @include border-radius(var(--#{$prefix}badge-border-radius));
- @include gradient-bg();
-
- // Empty badges collapse automatically
- &:empty {
- display: none;
- }
- }
-
- // Quick fix for badges in buttons
- .btn .badge {
- position: relative;
- top: -1px;
- }
|