67a7a0d571
feat(SW-3271): Move Chip to design-system * Move Chip to design-system Approved-by: Joakim Jäderberg
44 lines
1.0 KiB
CSS
44 lines
1.0 KiB
CSS
div.chip {
|
|
--chip-text-color: var(--Base-Text-High-contrast);
|
|
--chip-background-color: var(--Base-Surface-Primary-light-Normal);
|
|
align-items: center;
|
|
color: var(--chip-text-color);
|
|
background-color: var(--chip-background-color);
|
|
border-radius: var(--Corner-radius-sm);
|
|
display: flex;
|
|
gap: var(--Spacing-x-half);
|
|
justify-content: center;
|
|
}
|
|
|
|
.chip.small {
|
|
padding: var(--Spacing-x-quarter) var(--Spacing-x-half);
|
|
}
|
|
|
|
.chip.medium {
|
|
padding: var(--Spacing-x-half) var(--Spacing-x1);
|
|
}
|
|
|
|
.chip *,
|
|
.chip svg * {
|
|
fill: var(--chip-text-color);
|
|
}
|
|
|
|
.chip.burgundy {
|
|
--chip-text-color: var(--Primary-Dark-On-Surface-Text);
|
|
--chip-background-color: var(--Base-Text-High-contrast);
|
|
}
|
|
|
|
.chip.transparent {
|
|
--chip-text-color: var(--UI-Input-Controls-On-Fill-Normal);
|
|
--chip-background-color: rgba(64, 57, 55, 0.9);
|
|
}
|
|
|
|
.chip.tag {
|
|
--chip-background-color: var(--Base-Surface-Subtle-Hover);
|
|
}
|
|
|
|
.chip.uiTextHighContrast {
|
|
--chip-background-color: var(--UI-Text-High-contrast);
|
|
--chip-text-color: var(--UI-Input-Controls-On-Fill-Normal);
|
|
}
|