Problem
Currently we have leftover tokens (euiColorInk and euiColorGhost), that originally belong to Amsterdam and were intended to be deprecated. During Borealis update, we mapped those to old "shades" tokens (euiTheme.colors.ink and euiTheme.colors.ghost) -> the leftovers of both approaches can be currently found in the code base.
The problem is, that in order to clean up the code base and fit such usages into new color system (and reflect this similarly in Figma) we need to align on consistent approach to that. The proposal is based on this discussion.
Proposed Solution
-
Create text-ghost and text-ink color tokens in Borealis theme, which will be used for text and icons; check the usages of those and replace with proper tokens.
- The ones that are known are EuiLink (ghost color) and EuiBadge (for customized badges), but maybe there are some more.
-
Use plainLight and plainDark instead in all other cases (meaning in all cases that are not icons or text, but rather background or border, for example) — we don't envision a lot of such usages, so we don't introduce 3rd level tokens for those specifically.
- These usages might include contrast mode borders (black/white), for example.
Notes
- We still keep the approach of using the enforced color mode when possible: e.g. in EuiTooltip we don't use any other color tokens, but rather enforce the component to eb in a dark mode, and use regular text-paragraph there, for example.
- The change is already used in Figma, since we needed this tokens to apply them to respective elements, so we only need to clean up the code. cc @JoseLuisGJ just fyi.
Value / Impact
Cleaning up the leftovers after transition to Borealis. Almost no visual impact.
Urgency
Not urgent, but desirable for full theme migration and code base cleanness.
Problem
Currently we have leftover tokens (
euiColorInkandeuiColorGhost), that originally belong to Amsterdam and were intended to be deprecated. During Borealis update, we mapped those to old "shades" tokens (euiTheme.colors.inkandeuiTheme.colors.ghost) -> the leftovers of both approaches can be currently found in the code base.The problem is, that in order to clean up the code base and fit such usages into new color system (and reflect this similarly in Figma) we need to align on consistent approach to that. The proposal is based on this discussion.
Proposed Solution
Create
text-ghostandtext-inkcolor tokens in Borealis theme, which will be used for text and icons; check the usages of those and replace with proper tokens.Use
plainLightandplainDarkinstead in all other cases (meaning in all cases that are not icons or text, but rather background or border, for example) — we don't envision a lot of such usages, so we don't introduce 3rd level tokens for those specifically.Notes
Value / Impact
Cleaning up the leftovers after transition to Borealis. Almost no visual impact.
Urgency
Not urgent, but desirable for full theme migration and code base cleanness.