fix: prevent WebKit/GTK system theme from overriding input text colors on Linux
Some checks failed
Test / frontend-typecheck (push) Waiting to run
Test / frontend-tests (push) Waiting to run
Test / rust-fmt-check (push) Successful in 1m8s
Test / rust-clippy (push) Successful in 7m37s
Test / rust-tests (push) Has been cancelled
Release / build-linux-amd64 (push) Failing after 30s
Release / build-linux-arm64 (push) Waiting to run
Release / build-windows-amd64 (push) Has been cancelled

On Linux, WebKit inherits GTK system text colors for form controls,
causing dark-on-dark text in dark mode. Explicitly set color and
-webkit-text-fill-color on inputs/textareas/buttons, and add
color-scheme: dark to .dark so WebKit uses the correct system UI
color scheme.

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Shaun Arman 2026-03-29 21:14:28 -05:00
parent 5d29f7fb61
commit 9c3f924f27

View File

@ -51,4 +51,21 @@
@layer base {
* { @apply border-border; }
body { @apply bg-background text-foreground; }
/* Prevent WebKit/GTK from overriding form control colors with system theme */
input, textarea, select, button {
color: hsl(var(--foreground));
background-color: hsl(var(--background));
-webkit-text-fill-color: hsl(var(--foreground));
}
input::placeholder, textarea::placeholder {
color: hsl(var(--muted-foreground));
-webkit-text-fill-color: hsl(var(--muted-foreground));
opacity: 1;
}
}
/* Tell WebKit which color scheme is active so system UI elements match */
:root { color-scheme: light; }
.dark { color-scheme: dark; }