overleaf/services/web/frontend/stylesheets/bootstrap-5/components/badge.scss
ilkin-overleaf cccd0f06d7 Merge pull request #17908 from overleaf/ii-bs5-badge
[web] Create Bootstrap 5 badges

GitOrigin-RevId: 72355c7cf7dca2a5d16bc890d7cfa4a432dd15ba
2024-04-22 08:04:07 +00:00

35 lines
709 B
SCSS

.badge {
display: inline-flex;
align-items: center;
overflow: hidden;
line-height: var(--line-height-01);
}
.badge-prepend {
margin-left: calc($spacing-01 / -2);
margin-right: $spacing-01;
}
.badge-close {
@include reset-button();
display: flex;
align-items: center;
justify-content: center;
// a random number that would cause the close button to expand enough
// so that it won't be affected by badge's padding
$expand: 100px;
padding: $expand $spacing-01;
margin: (-$expand) (-$spacing-02) (-$expand) $spacing-02;
user-select: none;
color: inherit;
.badge-close-icon {
font-size: $font-size-base;
}
&:hover {
background-color: var(--neutral-40);
}
}