change unsaved color to orange

avoids confusion with validation errors (red)
This commit is contained in:
Josh Hawkins 2026-04-22 08:53:19 -05:00
parent 07d1d46158
commit 9d2fd68606
9 changed files with 15 additions and 12 deletions

View File

@ -218,7 +218,7 @@ export default function CameraReviewClassification({
<Label <Label
className={cn( className={cn(
"flex flex-row items-center text-base", "flex flex-row items-center text-base",
alertsZonesModified && "text-danger", alertsZonesModified && "text-unsaved",
)} )}
> >
<Trans ns="views/settings">cameraReview.review.alerts</Trans> <Trans ns="views/settings">cameraReview.review.alerts</Trans>
@ -286,7 +286,7 @@ export default function CameraReviewClassification({
<Label <Label
className={cn( className={cn(
"flex flex-row items-center text-base", "flex flex-row items-center text-base",
detectionsZonesModified && "text-danger", detectionsZonesModified && "text-unsaved",
)} )}
> >
<Trans ns="views/settings"> <Trans ns="views/settings">

View File

@ -1012,7 +1012,7 @@ export function ConfigSection({
> >
{hasChanges && ( {hasChanges && (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span className="text-sm text-danger"> <span className="text-sm text-unsaved">
{t("unsavedChanges", { {t("unsavedChanges", {
ns: "views/settings", ns: "views/settings",
defaultValue: "You have unsaved changes", defaultValue: "You have unsaved changes",
@ -1299,7 +1299,7 @@ export function ConfigSection({
{hasChanges && ( {hasChanges && (
<Badge <Badge
variant="secondary" 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", { {t("button.modified", {
ns: "common", ns: "common",

View File

@ -154,7 +154,7 @@ export function KnownPlatesField(props: FieldProps) {
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div> <div>
<CardTitle <CardTitle
className={cn("text-sm", isModified && "text-danger")} className={cn("text-sm", isModified && "text-unsaved")}
> >
{title} {title}
</CardTitle> </CardTitle>

View File

@ -142,7 +142,7 @@ export function ReplaceRulesField(props: FieldProps) {
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div> <div>
<CardTitle <CardTitle
className={cn("text-sm", isModified && "text-danger")} className={cn("text-sm", isModified && "text-unsaved")}
> >
{title} {title}
</CardTitle> </CardTitle>

View File

@ -497,7 +497,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
htmlFor={id} htmlFor={id}
className={cn( className={cn(
"text-sm font-medium", "text-sm font-medium",
isModified && "text-danger", isModified && "text-unsaved",
hasFieldErrors && "text-destructive", hasFieldErrors && "text-destructive",
)} )}
> >
@ -516,7 +516,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
return ( return (
<Label <Label
htmlFor={id} htmlFor={id}
className={cn("text-sm font-medium", isModified && "text-danger")} className={cn("text-sm font-medium", isModified && "text-unsaved")}
> >
{finalLabel} {finalLabel}
{required && <span className="ml-1 text-destructive">*</span>} {required && <span className="ml-1 text-destructive">*</span>}
@ -535,7 +535,7 @@ export function FieldTemplate(props: FieldTemplateProps) {
htmlFor={id} htmlFor={id}
className={cn( className={cn(
"text-sm font-medium", "text-sm font-medium",
isModified && "text-danger", isModified && "text-unsaved",
hasFieldErrors && "text-destructive", hasFieldErrors && "text-destructive",
)} )}
> >

View File

@ -467,7 +467,7 @@ export function ObjectFieldTemplate(props: ObjectFieldTemplateProps) {
<CardTitle <CardTitle
className={cn( className={cn(
"flex items-center text-sm", "flex items-center text-sm",
hasModifiedDescendants && "text-danger", hasModifiedDescendants && "text-unsaved",
)} )}
> >
{inferredLabel} {inferredLabel}

View File

@ -1435,7 +1435,7 @@ export default function Settings() {
/> />
)} )}
{showUnsavedDot && ( {showUnsavedDot && (
<span className="inline-block size-2 rounded-full bg-danger" /> <span className="inline-block size-2 rounded-full bg-unsaved" />
)} )}
</div> </div>
)} )}

View File

@ -380,7 +380,9 @@ export default function Go2RtcStreamsSettingsView({
> >
{hasChanges && ( {hasChanges && (
<div className="flex items-center gap-2"> <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>
)} )}
<div className="flex w-full items-center gap-2 md:w-auto"> <div className="flex w-full items-center gap-2 md:w-auto">

View File

@ -65,6 +65,7 @@ module.exports = {
ring: "hsl(var(--ring))", ring: "hsl(var(--ring))",
danger: "#ef4444", danger: "#ef4444",
success: "#22c55e", success: "#22c55e",
unsaved: "#f59e0b",
background: "hsl(var(--background))", background: "hsl(var(--background))",
background_alt: "hsl(var(--background-alt))", background_alt: "hsl(var(--background-alt))",
foreground: "hsl(var(--foreground))", foreground: "hsl(var(--foreground))",