Fix deck config input's background color in Qt5 (#3243)

ankitects · Jun 22, 2024 · 9dc3b10 · 9dc3b10
1 parent e41c457
commit 9dc3b10
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 2 deletions.
diff --git a/ts/lib/components/ConfigInput.svelte b/ts/lib/components/ConfigInput.svelte
@@ -3,6 +3,8 @@
     License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
 <script lang="ts">
+    import { pageTheme } from "$lib/sveltelib/theme";
+
     const rtl: boolean = window.getComputedStyle(document.body).direction == "rtl";
 
     export let grow = true;
@@ -11,6 +13,7 @@
 <div
     class="config-input position-relative justify-content-end"
     class:flex-grow-1={grow}
+    class:nightMode={$pageTheme.isDark}
 >
     <div class="revert" class:rtl>
         <slot name="revert" />
@@ -39,5 +42,9 @@
         .revert:hover {
             color: var(--fg);
         }
+        &.nightMode :global(input),
+        &.nightMode :global(textarea) {
+            background-color: rgb(59, 59, 59);
+        }
     }
 </style>
diff --git a/ts/routes/deck-options/FsrsOptions.svelte b/ts/routes/deck-options/FsrsOptions.svelte
@@ -27,6 +27,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import SpinBoxRow from "./SpinBoxRow.svelte";
     import Warning from "./Warning.svelte";
     import WeightsInputRow from "./WeightsInputRow.svelte";
+    import WeightsSearchRow from "./WeightsSearchRow.svelte";
 
     export let state: DeckOptionsState;
     export let openHelpModal: (String) => void;
@@ -281,11 +282,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         </SettingTitle>
     </WeightsInputRow>
 
-    <input
+    <WeightsSearchRow
         bind:value={$config.weightSearch}
         placeholder={defaultWeightSearch}
-        class="w-100 mb-1"
     />
+
     <DateInput bind:date={$config.ignoreRevlogsBeforeDate}>
         <SettingTitle on:click={() => openHelpModal("ignoreBefore")}>
             {tr.deckConfigIgnoreBefore()}

diff --git a/ts/routes/deck-options/WeightsSearchRow.svelte b/ts/routes/deck-options/WeightsSearchRow.svelte
@@ -0,0 +1,14 @@
+<!--
+Copyright: Ankitects Pty Ltd and contributors
+License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
+-->
+<script lang="ts">
+    import ConfigInput from "$lib/components/ConfigInput.svelte";
+
+    export let value: string;
+    export let placeholder: string;
+</script>
+
+<ConfigInput>
+    <input bind:value {placeholder} class="w-100 mb-1" />
+</ConfigInput>