ouyangbo/EvoScientist-WebUI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(webui): deepen light brand to cyan-700 for WCAG AA contrast

Browse Source 
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
m4
2026-08-10 21:00:37 +08:00
parent c388fa4838
commit 535d1b4955
3 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/superpowers/specs/2026-08-10-ui-polish-bright-design.md
+6 -6
View File
@@ -36,9 +36,9 @@ Decisions locked in during brainstorming:
| Text primary | `#18181b` (zinc-900) | |
| Text secondary | `#52525b` (zinc-600) | |
| Text tertiary | `#a1a1aa` (zinc-400) | |
| Brand (links, text accents) | `#0891b2` (cyan-600) | AA on white |
| Brand hover | `#0e7490` (cyan-700) | |
| Brand solid (button fill) | gradient `cyan-500 #06b6d4` → `cyan-600 #0891b2` | see Button spec |
| Brand (links, text accents) | `#0e7490` (cyan-700) | AA on white |
| Brand hover | `#155e75` (cyan-800) | |
| Brand solid (button fill) | gradient `cyan-700 #0e7490` → `cyan-800 #155e75` | see Button spec |
| Active/selected bg | `#ecfeff` (cyan-50) | paired with cyan-700 text |
| User message bubble bg | `#ecfeff` | unified with selection color |
| Success / warning / error | keep hues, shift to zinc-compatible: `#16a34a` / `#d97706` / `#dc2626` | |
@@ -89,9 +89,9 @@ reference the same color tokens.
## Layer 3 — `ui/` primitives (all consumers inherit)
- **Button** (`src/components/ui/button.tsx`):
- `default`: vertical micro-gradient `from-[#06b6d4] to-[#0891b2]` (dark:
- `default`: vertical micro-gradient `from-[#0e7490] to-[#155e75]` (dark:
flat `#0e7490`), white text, `shadow-sm`, hover deepens
(`to-[#0e7490]`), focus-visible ring `cyan-500/30`.
(`to-[#164e63]`), focus-visible ring `cyan-500/30`.
- `outline`: white bg, zinc-200 border, hover zinc-50.
- `ghost`: hover zinc-100.
- `link`: cyan-600.
@@ -138,7 +138,7 @@ caught by the per-layer manual verification gates below.
2. After Layer 3: every dialog + button/input/dropdown state (hover,
focus, disabled) in both modes.
3. After Layer 4: chat, thread list, workspace panel, login in both modes.
- Contrast: cyan-600 on white (4.5:1+), cyan-700 on cyan-50, dark-mode
- Contrast: cyan-700 on white (5.2:1), cyan-700 on cyan-50, dark-mode
equivalents must pass WCAG AA for text.
## Out of scope