Sha256: 342a4237728766d27ad5c2e6ac004fe3890810441398d465aa60e38bbdaf5db5
Contents?: true
Size: 1.65 KB
Versions: 27
Compression:
Stored size: 1.65 KB
Contents
@import "../tokens/colors";
@import "../utilities/colors";
@import "../tokens/opacity";
@import "../pb_avatar/avatar";
$pb_multiple_users_overlap: -9px;
$pb_multiple_users_border_size: 1px;
$pb_multiple_users_size: map-get($avatar-sizes, "xs");
$pb_multiple_users_size_xxs: map-get($avatar-sizes, "xxs");
[class^=pb_multiple_users_kit] {
display: inline-flex;
.multiple_users_badge_xs,
.multiple_users_badge_xxs {
display: flex;
align-items: center;
justify-content: center;
width: $pb_multiple_users_size;
height: $pb_multiple_users_size;
border-radius: $pb_multiple_users_size / 2 + 2;
background: tint($primary, 90%);
border: $pb_multiple_users_border_size solid $white;
color: $primary;
font-weight: $bold;
font-size: $font_smallest - 1;
&.dark {
border: $pb_multiple_users_border_size solid $bg_dark;
}
}
.multiple_users_badge_xxs {
width: $pb_multiple_users_size_xxs;
height: $pb_multiple_users_size_xxs;
}
.pb_multiple_users_item {
margin-left: $pb_multiple_users_overlap;
margin-right: 0;
&:first-of-type {
margin-left: 0;
}
&.dark {
.avatar_wrapper {
border: $pb_multiple_users_border_size solid $bg_dark;
}
}
.avatar_wrapper {
border: $pb_multiple_users_border_size solid $white;
}
@each $item in [1, 2, 3, 4, 5] {
&:nth-child(#{$item}) {
z-index: #{$item - 1};
}
}
}
&[class*=_reverse] {
flex-direction: row-reverse;
.pb_multiple_users_item {
margin-left: 0;
margin-right: $pb_multiple_users_overlap;
&:first-of-type {
margin-right: 0;
}
}
}
}
Version data entries
27 entries across 27 versions & 1 rubygems