Files
web/components/TempDesignSystem/Chip/chip.module.css
2025-02-25 10:45:45 +01:00

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-Small);
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);
}