Skip to content

Route accessible text colors through @policyengine/design-system#15

Merged
MaxGhenis merged 1 commit intomainfrom
chore/theme-token-fallbacks
May 9, 2026
Merged

Route accessible text colors through @policyengine/design-system#15
MaxGhenis merged 1 commit intomainfrom
chore/theme-token-fallbacks

Conversation

@MaxGhenis
Copy link
Copy Markdown
Contributor

Summary

Drops the inconsistency between policybench's locally-defined accessible text colors and the upstream @policyengine/design-system tokens.

The recent a11y pass had to declare --color-danger-text and --color-success-text locally because the design system only exposed --pe-color-text-warning (no error or success companions). policyengine-app-v2#1024 adds those upstream as --pe-color-text-error and --pe-color-text-success.

This PR switches our theme.css to:

--color-warning-text: var(--pe-color-text-warning, #d9480f);
--color-danger-text:  var(--pe-color-text-error,   #b91c1c);
--color-success-text: var(--pe-color-text-success, #285e61);

So:

  • Today: identical render — the fallback hex matches the local value.
  • Once design-system v0.5+ is installed: the upstream value takes over automatically and the local hexes drop out. No second PR needed here.

Verification

  • bun run lint clean.
  • bun run build clean.
  • Computed accessible text colors stay at their AA-passing values for badges, intervals, pending notes, etc.

🤖 Generated with Claude Code

The a11y pass added local --color-danger-text and --color-success-text
because @policyengine/design-system didn't expose accessible-text
companions for error/success. Once policyengine-app-v2#1024 lands and
publishes a new design-system release, those tokens become available
upstream as --pe-color-text-error and --pe-color-text-success.

Switch the locals to var(--pe-color-text-error, #b91c1c) /
var(--pe-color-text-success, #285e61) / var(--pe-color-text-warning,
#d9480f). This keeps the page rendering identically today and silently
picks up the upstream values once the new design-system version is
installed — no second PR needed in this repo.
@vercel
Copy link
Copy Markdown

vercel Bot commented May 9, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
policybench-site Error Error May 9, 2026 4:21am

Request Review

@MaxGhenis MaxGhenis merged commit 797712c into main May 9, 2026
3 of 4 checks passed
Copy link
Copy Markdown

@policyengine policyengine Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good! This is a clean backward-compatible migration that prepares for the upstream design-system tokens.

Verified:

  • All three fallback hex values match their current computed values:
    • --color-warning-text: #d9480f matches --pe-color-text-warning (already exists upstream)
    • --color-danger-text: #b91c1c matches the previous hardcoded value
    • --color-success-text: #285e61 matches --pe-color-primary-700 (uppercase/lowercase hex equivalence)
  • The var() syntax with fallbacks is correct and will pick up the upstream tokens once design-system v0.5+ is installed
  • No other files reference these color variables directly, so the change is isolated to theme.css
  • Comment clearly explains the migration strategy

The approach is sound: renders identically today, and will automatically pick up the upstream values when the design-system package is upgraded. No follow-up PR needed in this repo.

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