mirror of
https://github.com/olehomelchenko/astrolabe.git
synced 2026-08-08 02:02:33 +00:00
44 lines
876 B
CSS
44 lines
876 B
CSS
/* ColorField — token-styled native color swatch (+ optional hex field). */
|
|
|
|
.field {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--space-2);
|
|
}
|
|
|
|
/* Native color input, sized to a swatch and stripped of its OS chrome. */
|
|
.swatch {
|
|
width: var(--control-height);
|
|
height: var(--control-height);
|
|
padding: 0;
|
|
border: var(--border-width) solid var(--border-strong);
|
|
background: none;
|
|
cursor: pointer;
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
}
|
|
|
|
/* Compact: sits inside the 24px-tall Chart Builder constant pill. */
|
|
.sm {
|
|
width: 28px;
|
|
height: 22px;
|
|
}
|
|
|
|
.swatch::-webkit-color-swatch-wrapper {
|
|
padding: 2px;
|
|
}
|
|
.swatch::-webkit-color-swatch {
|
|
border: none;
|
|
}
|
|
.swatch::-moz-color-swatch {
|
|
border: none;
|
|
}
|
|
|
|
.hex {
|
|
width: 8ch;
|
|
height: var(--control-height);
|
|
padding: 0 var(--space-2);
|
|
font-family: var(--font-mono);
|
|
font-size: 12px;
|
|
}
|