components/sass/badge.scss

47 lines
923 B
SCSS
Raw Normal View History

2019-11-22 22:04:03 +01:00
.badge {
height: var(--height-badge);
border-radius: var(--border-radius);
font-size: var(--font-small);
padding: var(--spacing-xs) var(--spacing-xs);
white-space: nowrap;
user-select: none;
cursor: pointer;
align-items: center;
}
.badge--tag {
@extend .badge;
background-color: var(--color-tag-bg);
color: var(--color-tag);
&:hover {
background-color: var(--color-tag-bg-hover);
color: var(--color-tag-hover);
}
}
.badge--tag-mature {
@extend .badge;
background-color: var(--color-tertiary-alt);
color: var(--color-tertiary);
}
.badge--cost {
@extend .badge;
background-color: var(--color-cost);
color: var(--color-black);
2019-11-23 01:45:48 +01:00
line-height: 1;
2019-11-22 22:04:03 +01:00
}
.badge--free {
@extend .badge;
background-color: var(--color-secondary-alt);
color: var(--color-secondary);
}
.badge--alert {
@extend .badge;
background-color: var(--color-danger-alt);
color: var(--color-danger);
}