Skip to content

fix(tokens): add missing core color tokens and fix incorrect values #11924

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
Apr 11, 2025

Conversation

matgalla
Copy link
Contributor

@matgalla matgalla commented Apr 10, 2025

Related Issue: #11581

Summary

Adds low-saturation colors that are missing when compared to the original Calcite Colors repo:

image

Adds medium-saturation colors that are missing when compared to the original Calcite Colors repo:

image

Fixes incorrect value for --calcite-color-vibrant-blue-v-bb-180:

image

Fixes incorrect value for --calcite-color-dark-green-d-gg-430:

image

NOTE: In this PR, Tokens Studio changed some minor formatting for all otherwise unchanged token JSON files. This is due to Tokens Studio bypassing the linting process. Addressed in @jcfranco's recent PR here: #11918

This PR is a part of a series of updates that address token-related issues and set them up for use with Tokens Studio.

Criteria for completion

  • change --calcite-color-vibrant-blue-v-bb-180 token value to #0089DE
  • change --calcite-color-dark-green-d-gg-430 token value to #11AD1D
  • add all low-saturation color tokens
  • add all medium-saturation color tokens

Previous steps

Next steps

@matgalla matgalla added the bug Bug reports for broken functionality. Issues should include a reproduction of the bug. label Apr 10, 2025
@matgalla matgalla added this to the 2025-04-29 - Apr Milestone milestone Apr 10, 2025
@matgalla matgalla requested review from jcfranco and ashetland April 10, 2025 19:10
@matgalla matgalla self-assigned this Apr 10, 2025
@jcfranco jcfranco marked this pull request as ready for review April 10, 2025 20:06
@jcfranco jcfranco requested a review from alisonailea as a code owner April 10, 2025 20:06
@jcfranco jcfranco added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label Apr 10, 2025
@matgalla
Copy link
Contributor Author

matgalla commented Apr 11, 2025

Found some other discrepancies. Auditing the remaining tokens to account for all differences with the Calcite Colors repo. cc @ashetland

Copy link
Contributor

@ashetland ashetland left a comment

Choose a reason for hiding this comment

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

LGTM!

@jcfranco jcfranco added skip visual snapshots Pull requests that do not need visual regression testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Apr 11, 2025
@matgalla matgalla merged commit a8bad7e into dev Apr 11, 2025
17 checks passed
@matgalla matgalla deleted the matgalla/add-missing-core-color-tokens branch April 11, 2025 16:22
benelan pushed a commit that referenced this pull request May 14, 2025
…11924)

**Related Issue:** #11581 

## Summary
Adds `low-saturation` colors that are missing when compared to the
original [Calcite Colors](https://github.com/Esri/calcite-colors) repo:


![image](https://github.com/user-attachments/assets/9fd59ef8-ead2-43be-b80f-9a6cd8e89f14)


Adds `medium-saturation` colors that are missing when compared to the
original [Calcite Colors](https://github.com/Esri/calcite-colors) repo:


![image](https://github.com/user-attachments/assets/89f58c96-7f25-40b6-a6ae-1efd998c100f)


Fixes incorrect value for `--calcite-color-vibrant-blue-v-bb-180`:


![image](https://github.com/user-attachments/assets/f250cf04-b0de-48b8-9e99-581541ec7b68)


Fixes incorrect value for `--calcite-color-dark-green-d-gg-430`:


![image](https://github.com/user-attachments/assets/80eef2e1-26d7-4311-b9d8-69353cf83b1a)


NOTE: In this PR, Tokens Studio changed some minor formatting for all
otherwise unchanged token JSON files. This is due to Tokens Studio
bypassing the linting process. Addressed in @jcfranco's recent PR here:
#11918

This PR is a part of a series of updates that address token-related
issues and set them up for use with Tokens Studio.

## Criteria for completion
- [x] change `--calcite-color-vibrant-blue-v-bb-180` token value to
#0089DE
- [x] change `--calcite-color-dark-green-d-gg-430` token value to
#11AD1D
- [x] add all `low-saturation` color tokens
- [x] add all `medium-saturation` color tokens

## Previous steps
- [x] #11655 
- [x] #11852 

## Next steps
- Audit the structural differences between tokens and Figma variables
- Restructure tokens to align with Figma variables where necessary
- Address #10050 
- Address #11565 
- Address #11725 
- Address #11903 
- Audit the value differences between tokens and Figma variables (mainly
for percentages and typography)
- Finalize token and Figma variable values with Calcite designers and
developers
- Update token values to align with Figma variables where necessary
- Document the new token creation and modification process

---------

Co-authored-by: JC Franco <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Bug reports for broken functionality. Issues should include a reproduction of the bug. skip visual snapshots Pull requests that do not need visual regression testing.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants