Sha256: 911ac2dc4c0e327af4a3050babd137a3678694a8b58c47c7a3686fe2f19c7a41
Contents?: true
Size: 1.43 KB
Versions: 6
Compression:
Stored size: 1.43 KB
Contents
@use "sass:math";
@import "../tokens/border_radius";
@import "../tokens/colors";
@import "../tokens/opacity";
@import "../tokens/spacing";
@import "../tokens/typography";
[class^=pb_badge_kit] {
$pb_badge_height: 18px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: $border_rad_light;
padding: 0 math.div($space_xs, 2);
border-width: 1px;
border-style: solid;
border-color: $card_light;
white-space: nowrap;
span {
display: inline-block;
font-size: $font_smaller - 1;
font-weight: $bolder;
}
@each $color_name, $color_value in $status_colors {
&[class*=_#{$color_name}] {
background: rgba($color_value, $opacity_1);
color: map-get($status_color_text, $color_name);
}
}
&[class*=_rounded] {
height: $pb_badge_height;
min-height: $pb_badge_height;
min-width: $pb_badge_height;
border-radius: math.div($pb_badge_height, 2);
}
&[class*=_notification] {
background: $primary;
color: $white;
}
&[class*=_notification_error] {
background: $error;
}
&.dark {
border-width: 0;
@each $color_name, $color_value in $status_colors {
&[class*=_#{$color_name}] {
background: rgba(mix($bg_dark, $color_value, 10%), $opacity_2);
color: map-get($status_color_text_dark, $color_name);
}
}
&[class*=_notification_error] {
background: $error_dark;
color: $white;
}
}
}
Version data entries
6 entries across 6 versions & 1 rubygems