Page MenuHomePhabricator

Codex component tokens should only reference decision tokens, not option tokens
Open, Needs TriagePublic

Description

From @Jdlrobson in Slack:

In Minerva we were using #D73333 for red links in day theme and #E45D52 for red links in dark theme. The new Codex build uses the same #D73333 for both night and day theme. This causes an accessibility issue: T363778

Cause of problem

This problem is caused by the fact that the component-specific tokens (which is where the red link colors are defined) are directly referencing option tokens like { color.red600 } directly. If the tokens in this file pointed to decision tokens instead (like { color.destructive }, etc) then they would automatically be updated when the dark mode tokens are loaded. No "components-dark" file would be necessary.

Proposed solution

I suggest that the components.json file should be updated to ensure that all "color" option tokens (anything with color in the name) should be updated to use appropriate tokens in the application.json file. So for red links, the destructive color tokens could be used, etc.

Alternatively, tokens to represent things like red link colors could be moved into the application.json file (they would also need corresponding overrides defined in the dark mode tokens file) – this is a better solution if the red link colors need to be truly independent of the destructive colors.

Event Timeline

Adding @Volker_E as a subscriber to comment on the proposed solutions so we can tackle this in the current sprint

We should decide if this task is about correcting all component tokens, or just the color ones. T363911 seems to already addresses the references for color tokens in order to fix the issue with red links, so if all we care about are the color tokens then I think this task is a duplicate.