Style: make sync mode dropdown follow dark theme

Ensure the sync mode <select> uses theme-aware background and text
colors so it matches the application's dark theme. The change adds
appearance-none, explicit light-theme surface/text classes and dark:
variants (dark:bg-surface-dark dark:text-text-dark) so the dropdown no
longer appears white in dark mode and conforms to the rest of the themed
UI.
This commit is contained in:
Tristan Michael 2026-04-01 01:10:45 -07:00
parent a7709f80cc
commit 39239fadc3

View file

@ -126,7 +126,7 @@
<select <select
value={app.syncMode} value={app.syncMode}
onchange={(e) => app.setSyncMode((e.target as HTMLSelectElement).value as "full" | "push" | "pull")} onchange={(e) => app.setSyncMode((e.target as HTMLSelectElement).value as "full" | "push" | "pull")}
class="rounded-lg border border-border-light bg-transparent px-3 py-2 text-sm outline-none focus:border-primary dark:border-border-dark" class="appearance-none rounded-lg border border-border-light bg-surface-light px-3 py-2 text-sm text-text-light outline-none focus:border-primary dark:border-border-dark dark:bg-surface-dark dark:text-text-dark"
> >
<option value="full">Sync both ways</option> <option value="full">Sync both ways</option>
<option value="push">Push only</option> <option value="push">Push only</option>