fix: adaptive theme colour looking all wonky

This commit is contained in:
SethBurkart123
2026-03-18 10:21:37 +11:00
parent 2f6e551e22
commit f1c55e127c
+22 -20
View File
@@ -225,33 +225,35 @@
{@render Setting(option)} {@render Setting(option)}
{/each} {/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="border-none">
<div class="flex justify-between items-center px-4 py-3"> <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="pr-4"> <div class="flex justify-between items-center px-4 py-3">
<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="pr-4"> <div class="pr-4">
<h2 class="text-sm font-bold">Soft Gradient</h2> <h2 class="text-sm font-bold">Adaptive Theme Colour</h2>
<p class="text-xs">Use a soft gradient instead of a solid colour when viewing a class.</p> <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>
<div> <div>
<Switch <Switch
state={$settingsState.adaptiveThemeGradient ?? false} state={$settingsState.adaptiveThemeColour ?? false}
onChange={(isOn: boolean) => settingsState.adaptiveThemeGradient = isOn} onChange={(isOn: boolean) => settingsState.adaptiveThemeColour = isOn}
/> />
</div> </div>
</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> </div>
{#each pluginSettings as plugin} {#each pluginSettings as plugin}