components/sass/badge.scss
2019-10-31 13:41:34 -04:00

35 lines
734 B
SCSS

.badge {
height: var(--height-badge);
border-radius: var(--border-radius);
font-size: var(--font-small);
padding-right: var(--spacing-xs);
padding: var(--spacing-xs) var(--spacing-s);
white-space: nowrap;
user-select: none;
cursor: pointer;
align-items: center;
}
.badge--tag {
@extend .badge;
background-color: var(--color-primary-alt);
color: var(--color-primary);
}
.badge--tag-mature {
@extend .badge;
background-color: var(--color-tertiary-alt);
color: var(--color-tertiary);
}
.badge--cost {
@extend .badge;
background-color: var(--color-warning);
color: var(--color-black);
}
.badge--alert {
@extend .badge;
background-color: var(--color-danger-alt);
color: var(--color-danger);
}