mirror of
https://github.com/caiwx86/small-packages.git
synced 2026-10-31 15:45:13 +08:00
73 lines
1.9 KiB
CSS
73 lines
1.9 KiB
CSS
@layer base {
|
|
/* .btn/.cbi-button are interchangeable in LuCI markup. Paint (box, fill, radius) is
|
|
* theme/55-buttons.css's; --on-color stays here because base/95-luci.css masks the spinner
|
|
* glyph with it, so it must track the variant regardless of layer. */
|
|
.btn,
|
|
.cbi-button {
|
|
--on-color: var(--fs-text);
|
|
|
|
cursor: pointer;
|
|
font-size: var(--fs-type);
|
|
white-space: pre;
|
|
}
|
|
|
|
/* border-color: theme/60-inputs.css — absorbed. */
|
|
.cbi-input-invalid,
|
|
.cbi-input-invalid.cbi-dropdown:not(.btn):not(.cbi-button),
|
|
.cbi-input-invalid.cbi-dropdown:not([open]) > ul > li,
|
|
.cbi-value-error input {
|
|
color: var(--fs-danger);
|
|
}
|
|
|
|
/* --on-color only: docs/css.md "Buttons: --on-color survives the absorption into theme". */
|
|
.cbi-button-positive,
|
|
.cbi-button-fieldadd,
|
|
.cbi-button-add,
|
|
.cbi-button-save {
|
|
--on-color: var(--fs-good);
|
|
}
|
|
|
|
.btn.primary,
|
|
.cbi-button-action,
|
|
.cbi-button-apply,
|
|
.cbi-button-reload,
|
|
.cbi-button-edit {
|
|
--on-color: var(--fs-accent);
|
|
}
|
|
|
|
.cbi-button-negative,
|
|
.cbi-section-remove .cbi-button,
|
|
.cbi-button-reset,
|
|
.cbi-button-remove {
|
|
--on-color: var(--fs-danger);
|
|
}
|
|
|
|
/* Not a clearfix — flex container, nothing floats: docs/css.md "Buttons: the flex clearfix,
|
|
* and why float is dead on .cbi-page-actions". */
|
|
.cbi-page-actions::after {
|
|
display: table;
|
|
content: "";
|
|
clear: both;
|
|
}
|
|
|
|
.cbi-page-actions > :not([method="post"]):not(.cbi-button-apply):not(.cbi-button-negative):not(.cbi-button-save):not(.cbi-button-reset) {
|
|
margin-inline-end: var(--fs-space-1);
|
|
}
|
|
|
|
/* fills/borders absorbed (theme/55-buttons.css); Save/Apply's --on-color is re-set there too
|
|
* regardless of layer, so no base copy is needed for that pair. */
|
|
.btn.primary,
|
|
.cbi-button-action.important,
|
|
.cbi-section-actions .cbi-button-edit {
|
|
--on-color: var(--fs-on-accent);
|
|
}
|
|
|
|
.cbi-button-positive.important {
|
|
--on-color: var(--fs-on-good);
|
|
}
|
|
|
|
.cbi-button-negative.important {
|
|
--on-color: var(--fs-on-danger);
|
|
}
|
|
}
|