calibrate dropdown badge colors

This commit is contained in:
Brent Schroeter 2026-03-12 18:25:13 +00:00
parent 4099a23d37
commit 1f624728c6

View file

@ -428,9 +428,9 @@
/* ======== Data Display ======== */
.dropdown-option-badge {
--badge-color-base: #f99;
--badge-color-base: #f33;
--badge-hue-rot: 0;
--badge-background: oklch(from var(--badge-color-base) l c calc(h + var(--badge-hue-rot)));
--badge-background: oklch(from var(--badge-color-base) calc(1 - (1 - l) * 0.5) c calc(h + var(--badge-hue-rot)));
background: var(--badge-background);
border-radius: 999px;
@ -443,31 +443,31 @@
}
&.dropdown-option-badge--red {
--badge-hue-rot: 50;
--badge-hue-rot: 0;
}
&.dropdown-option-badge--orange {
--badge-hue-rot: 50;
--badge-hue-rot: 45;
}
&.dropdown-option-badge--yellow {
--badge-hue-rot: 100;
--badge-background: oklch(from var(--badge-color-base) calc(1 - (1 - l) * 0.3) c calc(h + 75));
}
&.dropdown-option-badge--green {
--badge-hue-rot: 150;
--badge-hue-rot: 135;
}
&.dropdown-option-badge--blue {
--badge-hue-rot: 200;
--badge-hue-rot: 215;
}
&.dropdown-option-badge--indigo {
--badge-hue-rot: 250;
--badge-hue-rot: 240;
}
&.dropdown-option-badge--violet {
--badge-hue-rot: 300;
--badge-hue-rot: 270;
}
button {