From f1c55e127c10b776a93031cfc3006fd00e35d65a Mon Sep 17 00:00:00 2001
From: SethBurkart123 <seth.burkart@hills.adventist.edu.au>
Date: Wed, 18 Mar 2026 10:21:37 +1100
Subject: [PATCH] fix: adaptive theme colour looking all wonky

---
 src/interface/pages/settings/general.svelte | 42 +++++++++++----------
 1 file changed, 22 insertions(+), 20 deletions(-)

diff --git a/src/interface/pages/settings/general.svelte b/src/interface/pages/settings/general.svelte
index e16c793d..59406ac1 100644
--- a/src/interface/pages/settings/general.svelte
+++ b/src/interface/pages/settings/general.svelte
@@ -225,33 +225,35 @@
     {@render Setting(option)}
   {/each}
 
-  <div class="p-1 my-1 bg-gradient-to-br from-white rounded-xl border shadow-sm to-zinc-100 border-zinc-200/50 dark:border-zinc-700/40 dark:to-zinc-900/50 dark:from-zinc-900/40">
-    <div class="flex justify-between items-center px-4 py-3">
-      <div class="pr-4">
-        <h2 class="text-sm font-bold">Adaptive Theme Colour</h2>
-        <p class="text-xs">Change the theme colour based on the current class (e.g. when viewing a course or assessments page).</p>
-      </div>
-      <div>
-        <Switch
-          state={$settingsState.adaptiveThemeColour ?? false}
-          onChange={(isOn: boolean) => settingsState.adaptiveThemeColour = isOn}
-        />
-      </div>
-    </div>
-    {#if $settingsState.adaptiveThemeColour}
-      <div class="flex justify-between items-center px-4 py-3 pl-6 border-t border-zinc-100 dark:border-zinc-700/50">
+  <div class="border-none">
+    <div class="p-1 my-1 from-white to-zinc-100 bg-gradient-to-br rounded-xl border shadow-sm border-zinc-200/50 dark:border-zinc-700/40 dark:to-zinc-900/50 dark:from-zinc-900/40">
+      <div class="flex justify-between items-center px-4 py-3">
         <div class="pr-4">
-          <h2 class="text-sm font-bold">Soft Gradient</h2>
-          <p class="text-xs">Use a soft gradient instead of a solid colour when viewing a class.</p>
+          <h2 class="text-sm font-bold">Adaptive Theme Colour</h2>
+          <p class="text-xs">Change the theme colour based on the current class (e.g. when viewing a course or assessments page).</p>
         </div>
         <div>
           <Switch
-            state={$settingsState.adaptiveThemeGradient ?? false}
-            onChange={(isOn: boolean) => settingsState.adaptiveThemeGradient = isOn}
+            state={$settingsState.adaptiveThemeColour ?? false}
+            onChange={(isOn: boolean) => settingsState.adaptiveThemeColour = isOn}
           />
         </div>
       </div>
-    {/if}
+      {#if $settingsState.adaptiveThemeColour}
+        <div class="flex justify-between items-center px-4 py-3 pl-6 border-t border-zinc-100 dark:border-zinc-700/50">
+          <div class="pr-4">
+            <h2 class="text-sm font-bold">Soft Gradient</h2>
+            <p class="text-xs">Use a soft gradient instead of a solid colour when viewing a class.</p>
+          </div>
+          <div>
+            <Switch
+              state={$settingsState.adaptiveThemeGradient ?? false}
+              onChange={(isOn: boolean) => settingsState.adaptiveThemeGradient = isOn}
+            />
+          </div>
+        </div>
+      {/if}
+    </div>
   </div>
 
   {#each pluginSettings as plugin}