39b95c2ede
Pure `nix fmt` output from the commit before this one — no hand edits. 203 files: 52 md, 42 tsx, 32 js, 32 css, 21 ts, 13 html, 8 json, 3 mjs. Reproduce with `nix develop -c nix fmt` on the parent commit; the result should be byte-identical to this tree. None of the 13 `.prettierignore` entries appears here — verified by intersecting the changed-file list against the ignore file, with a control proving the intersection finds a match when one exists.
52 lines
1.5 KiB
CSS
52 lines
1.5 KiB
CSS
/* hive-btn.css — shadow-DOM stylesheet for the <hive-btn> autonomous
|
|
custom element (hive-btn.js). Loaded as raw text at build time
|
|
(esbuild's `text` loader) and adopted into each instance's own shadow
|
|
root. `:host` is an invisible wrapper (`display: contents`) — the
|
|
real box is the plain `button` selector below, targeting the actual
|
|
`<button>` the shadow root wraps (scope-isolated by the shadow
|
|
boundary already, no clash risk with anything outside). `variant` is
|
|
an attribute on the HOST (how callers set it, and where hive-dialog's
|
|
own selectors read it back); `:host([variant="…"])` sets `color`,
|
|
which then inherits down into the shadow tree the normal way. */
|
|
|
|
:host {
|
|
display: contents;
|
|
}
|
|
:host([variant="cancel"]) {
|
|
color: var(--subtext0);
|
|
}
|
|
:host([variant="confirm"]) {
|
|
color: var(--green);
|
|
}
|
|
:host([variant="danger"]) {
|
|
color: var(--red);
|
|
}
|
|
|
|
button {
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1em;
|
|
background: transparent;
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
border: 1px solid;
|
|
padding: 0.25em 0.8em;
|
|
cursor: pointer;
|
|
color: inherit;
|
|
text-shadow: 0 0 4px currentColor;
|
|
box-shadow: 0 0 0 0 currentColor;
|
|
transition: box-shadow 0.15s ease;
|
|
}
|
|
button:hover {
|
|
background: color-mix(in srgb, var(--fg) 6%, transparent);
|
|
text-shadow: 0 0 10px currentColor;
|
|
box-shadow: 0 0 10px -2px currentColor;
|
|
}
|
|
button:disabled {
|
|
opacity: 0.32;
|
|
cursor: not-allowed;
|
|
text-shadow: none;
|
|
box-shadow: none;
|
|
}
|