From 7e805491b5f9a54f3c569d9d56ff0c6f84c48061 Mon Sep 17 00:00:00 2001
From: Cho Young-Hwi <cyh76507707@gmail.com>
Date: Tue, 14 Jul 2026 22:30:39 +0000
Subject: [PATCH] [#169] Fix remaining status-chip contrast (final/connected +
 edited/pending)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Token-only change in tokens.css so `.chip-ok` and `.chip-warn` text clears
WCAG AA (≥4.5:1) on their soft backgrounds in the light theme; the dark theme
already passed and is untouched. Component CSS and the landed #153 draft-token
fix are unchanged.

Light `:root`:
- --state-final / --state-connected: teal-500 #0fa896 (2.60:1 on #d7f6f1) →
  deep teal #0a7266 (5.08:1).
- --state-edited / --state-pending: amber-500 #f4ce42 (1.38:1 on #fdf4d2) →
  deep gold #8a6a00 (4.60:1 — the value already proven for --color-warning on
  the same soft).

Soft backgrounds, the raw color ramps, and the dark-theme overrides (teal-400
/amber-400 on their translucent softs, which measure ≥5.5:1) are all unchanged,
so `--color-success`/`--color-warning` and every other ramp consumer are
unaffected. The chip dot (`currentColor`) and border (`color-mix`) track the
darker text color; both remain within spec.

Closes #169.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/studio/src/app/tokens.css | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/apps/studio/src/app/tokens.css b/apps/studio/src/app/tokens.css
index e51b6dc..b3b304c 100644
--- a/apps/studio/src/app/tokens.css
+++ b/apps/studio/src/app/tokens.css
@@ -103,16 +103,23 @@
      this token nor its neutrals are dark-overridden, so this fixes both themes. */
   --state-draft: var(--neutral-600);
   --state-draft-soft: var(--neutral-100);
-  --state-edited: var(--amber-500);
+  /* Edited/pending chip text must stay ≥4.5:1 on --state-edited-soft (#fdf4d2).
+     --amber-500 (#f4ce42) was only 1.38:1; the deep gold #8a6a00 measures
+     4.60:1 — the same value proven for --color-warning on this soft. The
+     saturated amber stays for dark theme (see below) and non-text uses. */
+  --state-edited: #8a6a00;
   --state-edited-soft: var(--color-highlight-soft);
-  --state-final: var(--teal-500);
+  /* Final/connected chip text must stay ≥4.5:1 on --state-final-soft (#d7f6f1).
+     --teal-500 (#0fa896) was only 2.60:1; the deep teal #0a7266 measures
+     5.08:1. Soft background and the saturated dark-theme teal are unchanged. */
+  --state-final: #0a7266;
   --state-final-soft: #d7f6f1;
 
-  --state-connected: var(--teal-500);
+  --state-connected: #0a7266;
   --state-connected-soft: #d7f6f1;
   --state-disconnected: var(--coral-600);
   --state-disconnected-soft: var(--coral-50);
-  --state-pending: var(--amber-500);
+  --state-pending: #8a6a00;
   --state-pending-soft: var(--color-highlight-soft);
 
   --color-success: var(--teal-500);