From 9d2fd68606a9cabd85a8ccfaf8a398fc23393c9f Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Wed, 22 Apr 2026 08:53:19 -0500
Subject: [PATCH] change unsaved color to orange

avoids confusion with validation errors (red)
---
 .../sectionExtras/CameraReviewClassification.tsx            | 4 ++--
 web/src/components/config-form/sections/BaseSection.tsx     | 4 ++--
 .../config-form/theme/fields/KnownPlatesField.tsx           | 2 +-
 .../config-form/theme/fields/ReplaceRulesField.tsx          | 2 +-
 .../config-form/theme/templates/FieldTemplate.tsx           | 6 +++---
 .../config-form/theme/templates/ObjectFieldTemplate.tsx     | 2 +-
 web/src/pages/Settings.tsx                                  | 2 +-
 web/src/views/settings/Go2RtcStreamsSettingsView.tsx        | 4 +++-
 web/tailwind.config.cjs                                     | 1 +
 9 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/web/src/components/config-form/sectionExtras/CameraReviewClassification.tsx b/web/src/components/config-form/sectionExtras/CameraReviewClassification.tsx
index ffe9b19b2a..86f363aec7 100644
--- a/web/src/components/config-form/sectionExtras/CameraReviewClassification.tsx
+++ b/web/src/components/config-form/sectionExtras/CameraReviewClassification.tsx
@@ -218,7 +218,7 @@ export default function CameraReviewClassification({
                 <Label
                   className={cn(
                     "flex flex-row items-center text-base",
-                    alertsZonesModified && "text-danger",
+                    alertsZonesModified && "text-unsaved",
                   )}
                 >
                   <Trans ns="views/settings">cameraReview.review.alerts</Trans>
@@ -286,7 +286,7 @@ export default function CameraReviewClassification({
                 <Label
                   className={cn(
                     "flex flex-row items-center text-base",
-                    detectionsZonesModified && "text-danger",
+                    detectionsZonesModified && "text-unsaved",
                   )}
                 >
                   <Trans ns="views/settings">
diff --git a/web/src/components/config-form/sections/BaseSection.tsx b/web/src/components/config-form/sections/BaseSection.tsx
index cc1448703d..897b5f262e 100644
--- a/web/src/components/config-form/sections/BaseSection.tsx
+++ b/web/src/components/config-form/sections/BaseSection.tsx
@@ -1012,7 +1012,7 @@ export function ConfigSection({
         >
           {hasChanges && (
             <div className="flex items-center gap-2">
-              <span className="text-sm text-danger">
+              <span className="text-sm text-unsaved">
                 {t("unsavedChanges", {
                   ns: "views/settings",
                   defaultValue: "You have unsaved changes",
@@ -1299,7 +1299,7 @@ export function ConfigSection({
                 {hasChanges && (
                   <Badge
                     variant="secondary"
-                    className="cursor-default bg-danger text-xs text-white hover:bg-danger"
+                    className="cursor-default bg-unsaved text-xs text-black hover:bg-unsaved"
                   >
                     {t("button.modified", {
                       ns: "common",
diff --git a/web/src/components/config-form/theme/fields/KnownPlatesField.tsx b/web/src/components/config-form/theme/fields/KnownPlatesField.tsx
index f710dcd11d..e47c298674 100644
--- a/web/src/components/config-form/theme/fields/KnownPlatesField.tsx
+++ b/web/src/components/config-form/theme/fields/KnownPlatesField.tsx
@@ -154,7 +154,7 @@ export function KnownPlatesField(props: FieldProps) {
             <div className="flex items-center justify-between">
               <div>
                 <CardTitle
-                  className={cn("text-sm", isModified && "text-danger")}
+                  className={cn("text-sm", isModified && "text-unsaved")}
                 >
                   {title}
                 </CardTitle>
diff --git a/web/src/components/config-form/theme/fields/ReplaceRulesField.tsx b/web/src/components/config-form/theme/fields/ReplaceRulesField.tsx
index 6724854c9e..08c5c781fb 100644
--- a/web/src/components/config-form/theme/fields/ReplaceRulesField.tsx
+++ b/web/src/components/config-form/theme/fields/ReplaceRulesField.tsx
@@ -142,7 +142,7 @@ export function ReplaceRulesField(props: FieldProps) {
             <div className="flex items-center justify-between">
               <div>
                 <CardTitle
-                  className={cn("text-sm", isModified && "text-danger")}
+                  className={cn("text-sm", isModified && "text-unsaved")}
                 >
                   {title}
                 </CardTitle>
diff --git a/web/src/components/config-form/theme/templates/FieldTemplate.tsx b/web/src/components/config-form/theme/templates/FieldTemplate.tsx
index f65348d88e..1c5e801dc3 100644
--- a/web/src/components/config-form/theme/templates/FieldTemplate.tsx
+++ b/web/src/components/config-form/theme/templates/FieldTemplate.tsx
@@ -497,7 +497,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
         htmlFor={id}
         className={cn(
           "text-sm font-medium",
-          isModified && "text-danger",
+          isModified && "text-unsaved",
           hasFieldErrors && "text-destructive",
         )}
       >
@@ -516,7 +516,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
     return (
       <Label
         htmlFor={id}
-        className={cn("text-sm font-medium", isModified && "text-danger")}
+        className={cn("text-sm font-medium", isModified && "text-unsaved")}
       >
         {finalLabel}
         {required && <span className="ml-1 text-destructive">*</span>}
@@ -535,7 +535,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
         htmlFor={id}
         className={cn(
           "text-sm font-medium",
-          isModified && "text-danger",
+          isModified && "text-unsaved",
           hasFieldErrors && "text-destructive",
         )}
       >
diff --git a/web/src/components/config-form/theme/templates/ObjectFieldTemplate.tsx b/web/src/components/config-form/theme/templates/ObjectFieldTemplate.tsx
index 4b588d62b1..f1d8ae14a0 100644
--- a/web/src/components/config-form/theme/templates/ObjectFieldTemplate.tsx
+++ b/web/src/components/config-form/theme/templates/ObjectFieldTemplate.tsx
@@ -467,7 +467,7 @@ export function ObjectFieldTemplate(props: ObjectFieldTemplateProps) {
                 <CardTitle
                   className={cn(
                     "flex items-center text-sm",
-                    hasModifiedDescendants && "text-danger",
+                    hasModifiedDescendants && "text-unsaved",
                   )}
                 >
                   {inferredLabel}
diff --git a/web/src/pages/Settings.tsx b/web/src/pages/Settings.tsx
index 3c6e4d83fe..afa003f94f 100644
--- a/web/src/pages/Settings.tsx
+++ b/web/src/pages/Settings.tsx
@@ -1435,7 +1435,7 @@ export default function Settings() {
                 />
               )}
               {showUnsavedDot && (
-                <span className="inline-block size-2 rounded-full bg-danger" />
+                <span className="inline-block size-2 rounded-full bg-unsaved" />
               )}
             </div>
           )}
diff --git a/web/src/views/settings/Go2RtcStreamsSettingsView.tsx b/web/src/views/settings/Go2RtcStreamsSettingsView.tsx
index dc6f1533c9..fbc55a24b5 100644
--- a/web/src/views/settings/Go2RtcStreamsSettingsView.tsx
+++ b/web/src/views/settings/Go2RtcStreamsSettingsView.tsx
@@ -380,7 +380,9 @@ export default function Go2RtcStreamsSettingsView({
         >
           {hasChanges && (
             <div className="flex items-center gap-2">
-              <span className="text-sm text-danger">{t("unsavedChanges")}</span>
+              <span className="text-sm text-unsaved">
+                {t("unsavedChanges")}
+              </span>
             </div>
           )}
           <div className="flex w-full items-center gap-2 md:w-auto">
diff --git a/web/tailwind.config.cjs b/web/tailwind.config.cjs
index 435b6cb1a9..83a61a248c 100644
--- a/web/tailwind.config.cjs
+++ b/web/tailwind.config.cjs
@@ -65,6 +65,7 @@ module.exports = {
         ring: "hsl(var(--ring))",
         danger: "#ef4444",
         success: "#22c55e",
+        unsaved: "#f59e0b",
         background: "hsl(var(--background))",
         background_alt: "hsl(var(--background-alt))",
         foreground: "hsl(var(--foreground))",