Skip to content

fix: standardize design system tokens and typography#198

Merged
RhysSullivan merged 3 commits intomainfrom
fix/design-system-contrast
Apr 11, 2026
Merged

fix: standardize design system tokens and typography#198
RhysSullivan merged 3 commits intomainfrom
fix/design-system-contrast

Conversation

@RhysSullivan
Copy link
Copy Markdown
Owner

Summary

Fixes the systemic contrast and readability issues across the app by addressing root causes rather than per-component patches.

Design token fixes (globals.css)

  • --muted-foreground: 0.56 → 0.65 lightness — secondary text is now readable in dark mode
  • --border: 0.235 → 0.28 — borders/cards are now visible in dark mode
  • --sidebar-foreground: 0.72 → 0.78 — sidebar text is brighter

Bulk cleanup (32 files)

  • 0 arbitrary font sizes remaining — all 44 instances of text-[0.8125rem], text-[0.75rem], text-[13px], etc. replaced with standard text-xs, text-sm, text-base
  • 0 opacity-modified muted-foreground remaining — all 46 instances of text-muted-foreground/50, /60, /70 replaced with text-muted-foreground (the token is already the correct contrast)
  • Decorative bg-muted-foreground/30 on dot indicators intentionally preserved

Test plan

  • Dark mode: verify text is readable across all pages
  • Dark mode: verify borders/cards are visible
  • Light mode: verify nothing looks too heavy
  • Sidebar text is readable
  • Billing, org, sources, secrets pages all look correct

- Bump dark mode --muted-foreground from 0.56 to 0.65 for readable secondary text
- Bump dark mode --border from 0.235 to 0.28 for visible borders
- Bump dark mode --sidebar-foreground from 0.72 to 0.78
- Replace all arbitrary font sizes with standard Tailwind scale:
  text-[0.625rem]→text-xs, text-[0.75rem]→text-xs,
  text-[0.8125rem]→text-sm, text-[0.9375rem]→text-base,
  text-[9-13px]→text-xs, text-[14-15px]→text-sm
- Remove all opacity modifiers on text-muted-foreground (46 occurrences)
  — the token itself is already the correct contrast level
@cloudflare-workers-and-pages
Copy link
Copy Markdown

cloudflare-workers-and-pages bot commented Apr 11, 2026

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
executor-marketing a7bf390 Commit Preview URL

Branch Preview URL
Apr 11 2026, 08:38 PM

Upgrade form labels, descriptions, helper text, error messages,
dialog descriptions, select triggers, and loading states from
text-xs (12px) to text-sm (14px). Keeps text-xs for badges,
tooltips, code blocks, column headers, and secondary metadata.
@RhysSullivan RhysSullivan merged commit 88b4384 into main Apr 11, 2026
3 of 5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant