From 39239fadc34105fc121e96c254102a03770234cb Mon Sep 17 00:00:00 2001
From: Tristan Michael <tristan@nerdninjas.com>
Date: Wed, 1 Apr 2026 01:10:45 -0700
Subject: [PATCH] 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.
---
 apps/tauri/src/lib/screens/SettingsScreen.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/tauri/src/lib/screens/SettingsScreen.svelte b/apps/tauri/src/lib/screens/SettingsScreen.svelte
index c27dde6..c932bc6 100644
--- a/apps/tauri/src/lib/screens/SettingsScreen.svelte
+++ b/apps/tauri/src/lib/screens/SettingsScreen.svelte
@@ -126,7 +126,7 @@
         <select
           value={app.syncMode}
           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="push">Push only</option>