rename web/ to admin/, along with the web-named build and cli identifiers
This commit is contained in:
@@ -0,0 +1,193 @@
|
||||
/*
|
||||
* The CSS entry (milestone 23, ruling 1). The StyleX plugin emits the compiled
|
||||
* atomic rules into their own layers; what is left here is the element reset
|
||||
* those rules are written against.
|
||||
*
|
||||
* The reset is not optional and not cosmetic. Tailwind's preflight used to
|
||||
* supply it, so every StyleX style in `admin/src` is written assuming border-box
|
||||
* sizing, no default margins, unstyled lists and form controls that inherit
|
||||
* their font. Deleting this block does not restore browser defaults — it
|
||||
* silently changes the meaning of every size and spacing value in the app.
|
||||
* Rules are limited to what this app renders; it is not a general reset.
|
||||
*
|
||||
* The reset lives in its own cascade layer, declared here before StyleX emits
|
||||
* its own. Layer order is priority order, and unlayered author CSS outranks
|
||||
* every layer: leaving these rules unlayered silently beat every StyleX rule in
|
||||
* the app, whatever the selector said.
|
||||
*/
|
||||
|
||||
@layer reset {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* This is not a reproduction of Tailwind's default stack, which is gone with
|
||||
* the package; text metrics drift here, which ruling 7 accepts. The symbol
|
||||
* families at the end are not decoration: `Select.tsx` renders U+25BE for its
|
||||
* chevron, and Segoe UI does not carry that glyph, so on Windows the stack
|
||||
* has to reach a font that does before it falls back to a substitute box.
|
||||
*/
|
||||
html {
|
||||
line-height: 1.5;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
font-family:
|
||||
system-ui,
|
||||
-apple-system,
|
||||
"Segoe UI",
|
||||
Roboto,
|
||||
"Helvetica Neue",
|
||||
Arial,
|
||||
sans-serif,
|
||||
"Segoe UI Symbol",
|
||||
"Noto Sans Symbols 2";
|
||||
}
|
||||
|
||||
/* Headings carry their scale from StyleX, not from the user agent. */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol,
|
||||
menu {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
/* Links opt into colour and underline; the shell's nav wants neither. */
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp,
|
||||
pre {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/* Without this the spinner stretches a number input taller than its row. */
|
||||
::-webkit-inner-spin-button,
|
||||
::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Firefox draws a red glow on an invalid field; the form shows its own error. */
|
||||
:-moz-ui-invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
text-indent: 0;
|
||||
border-color: inherit;
|
||||
}
|
||||
|
||||
/*
|
||||
* Form controls: inherit type and colour, drop the user-agent chrome, and keep
|
||||
* `appearance: button` so iOS Safari honours a button's border radius.
|
||||
*/
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
optgroup,
|
||||
textarea {
|
||||
font: inherit;
|
||||
letter-spacing: inherit;
|
||||
color: inherit;
|
||||
background-color: transparent;
|
||||
border: 0 solid;
|
||||
border-radius: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
button,
|
||||
input[type="button"],
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
appearance: button;
|
||||
}
|
||||
|
||||
/* A checkbox keeps its native chrome; the rules above would erase it. */
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
appearance: auto;
|
||||
}
|
||||
|
||||
/*
|
||||
* WebKit lays a date/time input out from its own pseudo-elements, and an
|
||||
* empty one comes out shorter than a filled one without these. The query log
|
||||
* filters are two `datetime-local` inputs sitting in a row of controls, so
|
||||
* the height has to hold whether or not a value is set.
|
||||
*/
|
||||
::-webkit-date-and-time-value {
|
||||
min-height: 1lh;
|
||||
text-align: inherit;
|
||||
}
|
||||
|
||||
::-webkit-datetime-edit {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
::-webkit-datetime-edit-fields-wrapper {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
::-webkit-datetime-edit,
|
||||
::-webkit-datetime-edit-year-field,
|
||||
::-webkit-datetime-edit-month-field,
|
||||
::-webkit-datetime-edit-day-field,
|
||||
::-webkit-datetime-edit-hour-field,
|
||||
::-webkit-datetime-edit-minute-field,
|
||||
::-webkit-datetime-edit-second-field,
|
||||
::-webkit-datetime-edit-millisecond-field,
|
||||
::-webkit-datetime-edit-meridiem-field {
|
||||
padding-block: 0;
|
||||
}
|
||||
|
||||
::placeholder {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Safari below 16.4 resolves `color-mix` against the wrong colour here and
|
||||
* renders the placeholder invisible. The guard admits every engine that
|
||||
* supports either a non-WebKit feature or one Safari only gained afterwards.
|
||||
*/
|
||||
@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
|
||||
::placeholder {
|
||||
color: color-mix(in oklab, currentcolor 50%, transparent);
|
||||
}
|
||||
}
|
||||
|
||||
/* An inline SVG leaves a baseline gap under a full-width chart. */
|
||||
svg,
|
||||
img,
|
||||
video,
|
||||
canvas {
|
||||
display: block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img,
|
||||
video {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
[hidden]:not([hidden="until-found"]) {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user