From 2f85ec5806f519098fbd9f0c9fd572bac7d5c5de Mon Sep 17 00:00:00 2001
From: Jake <jake@corbel.consulting>
Date: Thu, 7 May 2026 09:01:41 +0100
Subject: [PATCH] fix(settings): rename text-error/border-error to text-danger
 so error states actually render

The Tailwind v4 @theme block defines --color-danger as the semantic error
token, and 15+ files across the codebase use text-danger consistently.
SettingsPage was the lone outlier with five text-error / border-error
sites (audio devices, profile delete, vocabulary, term delete, diagnostic
report). Without a --color-error token, those utilities resolved to the
default text colour, so error messages rendered in warm cream instead of
red. Verified live via Playwright probe before and after.
---
 src/lib/pages/SettingsPage.svelte | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/lib/pages/SettingsPage.svelte b/src/lib/pages/SettingsPage.svelte
index ac175b9..b7ca500 100644
--- a/src/lib/pages/SettingsPage.svelte
+++ b/src/lib/pages/SettingsPage.svelte
@@ -1009,7 +1009,7 @@
                 >Refresh</button>
               </div>
               {#if audioDevicesError}
-                <p class="text-[11px] text-error mt-2">{audioDevicesError}</p>
+                <p class="text-[11px] text-danger mt-2">{audioDevicesError}</p>
               {:else if visibleAudioDevices.length === 0}
                 <p class="text-[11px] text-text-tertiary mt-2">No input devices detected. Check that a microphone is connected and PulseAudio/PipeWire is running.</p>
               {:else}
@@ -1061,7 +1061,7 @@
                 <button
                   type="button"
                   class="px-3 py-2 text-[12px] text-text-secondary border border-border rounded-lg
-                         hover:border-error hover:text-error
+                         hover:border-danger hover:text-danger
                          disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:border-border disabled:hover:text-text-secondary"
                   disabled={profilesStore.activeProfileId === DEFAULT_PROFILE_ID}
                   onclick={deleteActiveProfile}
@@ -1212,7 +1212,7 @@
               </div>
 
               {#if vocabularyError}
-                <p class="text-[11px] text-error mb-3">{vocabularyError}</p>
+                <p class="text-[11px] text-danger mb-3">{vocabularyError}</p>
               {/if}
 
               {#if vocabulary.length === 0}
@@ -1230,7 +1230,7 @@
                       <button
                         type="button"
                         onclick={() => deleteVocabTerm(entry.id)}
-                        class="text-[12px] text-text-tertiary hover:text-error border border-border hover:border-error rounded px-2 py-1"
+                        class="text-[12px] text-text-tertiary hover:text-danger border border-border hover:border-danger rounded px-2 py-1"
                         aria-label="Delete {entry.term}"
                       >Remove</button>
                     </li>
@@ -2241,7 +2241,7 @@
                 {/if}
               </div>
               {#if diagnosticReportError}
-                <p class="text-[11px] text-error mb-2">{diagnosticReportError}</p>
+                <p class="text-[11px] text-danger mb-2">{diagnosticReportError}</p>
               {/if}
               {#if diagnosticReportSavedTo}
                 <p class="text-[11px] text-success mb-2">{diagnosticReportSavedTo}</p>