Wrap dark input defaults in @layer base so utilities can override
This commit is contained in:
parent
c7dad445b5
commit
f0c7459980
1 changed files with 14 additions and 12 deletions
|
|
@ -31,18 +31,20 @@ body {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Form inputs in dark mode — the forms plugin defaults to a white background,
|
@layer base {
|
||||||
which would punch holes through panels. Override at the element level so we
|
/* Form inputs in dark mode — the forms plugin defaults to a white background,
|
||||||
don't have to add `dark:bg-neutral-800` to every <input>/<textarea>. */
|
which would punch holes through panels. Override at the element level so we
|
||||||
:where(.dark) input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="reset"]):not([type="button"]),
|
don't have to add `dark:bg-neutral-800` to every <input>/<textarea>. */
|
||||||
:where(.dark) textarea,
|
:where(.dark) input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="reset"]):not([type="button"]),
|
||||||
:where(.dark) select {
|
:where(.dark) textarea,
|
||||||
background-color: var(--color-neutral-800);
|
:where(.dark) select {
|
||||||
color: var(--color-neutral-100);
|
background-color: var(--color-neutral-800);
|
||||||
}
|
color: var(--color-neutral-100);
|
||||||
:where(.dark) input::placeholder,
|
}
|
||||||
:where(.dark) textarea::placeholder {
|
:where(.dark) input::placeholder,
|
||||||
color: var(--color-neutral-500);
|
:where(.dark) textarea::placeholder {
|
||||||
|
color: var(--color-neutral-500);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Tighter heading rhythm for all rendered (prose) content. Overrides the
|
/* Tighter heading rhythm for all rendered (prose) content. Overrides the
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue