Skip to content

chore(coreTheme + platformTheme): updating and adding color tokens#3112

Merged
codecademydev merged 26 commits intomainfrom
kl-gm-1153-platform-theme-updates
Jul 17, 2025
Merged

chore(coreTheme + platformTheme): updating and adding color tokens#3112
codecademydev merged 26 commits intomainfrom
kl-gm-1153-platform-theme-updates

Conversation

@LinKCoding
Copy link
Copy Markdown
Contributor

@LinKCoding LinKCoding commented Jun 20, 2025

Overview

Updates + Additions to the core theme red swatches:

  • Updates red-0 to red-300 and red-100 to red-400
  • Adds a new red-100 and red-900
  • Uses the new red-100 and red-900 for background-error

Updates the Platform Theme to:

  • change the background-primary light mode color from beige to blue-0
  • update editor-comment — light: navy-300 => navy-500 (#686C7B), dark: gray-600 => white-500 (#84868D)
  • update editor-key — light: teal-500's HEX value from 027E97 to 006D82
  • update editor-ui-indent-active — light: navy-900 => navy-300 (#BCBDC4), dark: gray:900 => white-300 (#3B3D49)
  • update editor-ui-indent-inactive — light: navy-600 => navy-400 (#8E919D), dark: gray:800 => white-400 (#5F616B)
  • add editor-ui-line-number-active — light: navy-700 (#31374C), dark: white-700 (#CECFD2)
  • rename and update editor-ui-line-number to editor-ui-line-number-inactive — light: navy-300 => navy-500 (#686C7B), dark: gray:600 => white-500 (#84868D)

PR Checklist

Testing Instructions

You can see the approved PRs:

  1. Red swatches: chore(coreTheme): update and add red color tokens #3113
  2. Yellow/Green swatches: chore(color tokens): added yellow-900, green-900 and used it for background-warning and background-success #3114
  3. PlatformTheme related: chore(platformTheme): update color tokens #3115
  4. Check over the new hex colors in the platform theme page
    ...
  5. Finish and do a celebratory dance

PR Links and Envs

Repository PR Link
Monolith Monolith PR
Mono Mono PR

@nx-cloud
Copy link
Copy Markdown

nx-cloud bot commented Jun 20, 2025

View your CI Pipeline Execution ↗ for commit e42a8bc


☁️ Nx Cloud last updated this comment at 2025-07-17 18:00:30 UTC

@LinKCoding LinKCoding changed the title chore(platformTheme): updating and adding color tokens chore(coreTheme + platformTheme): updating and adding color tokens Jun 20, 2025
* updated red-0 to red-300 and red-100 to red-400

* updated snapshot

* formatted and updated paleRed

* update other left swatch colors and snapshot

* updated comment

* added new red-0 and red-900 and new background-error which uses the new red tokens

* fixed red-0

* updated snapshots
…ground-warning and background-success (#3114)

* added green-900 and yellow-900 and used it for background-success and background-warning

* updated snapshots
* updated platformTheme colorTokens

* updated snapshots

* formatted
@LinKCoding LinKCoding marked this pull request as ready for review June 30, 2025 18:20
@LinKCoding LinKCoding requested a review from a team as a code owner June 30, 2025 18:20
Copy link
Copy Markdown
Contributor

@dreamwasp dreamwasp left a comment

Choose a reason for hiding this comment

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

🌈

Copy link
Copy Markdown
Contributor

@aresnik11 aresnik11 left a comment

Choose a reason for hiding this comment

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

LGTM! Just one suggestion

@codecademydev
Copy link
Copy Markdown
Collaborator

📬Published Alpha Packages:

@codecademy/gamut@66.0.1-alpha.e42a8b.0
@codecademy/gamut-icons@9.46.2-alpha.e42a8b.0
@codecademy/gamut-illustrations@0.54.6-alpha.e42a8b.0
@codecademy/gamut-kit@0.6.523-alpha.e42a8b.0
@codecademy/gamut-patterns@0.10.12-alpha.e42a8b.0
@codecademy/gamut-styles@17.6.5-alpha.e42a8b.0
@codecademy/gamut-tests@5.2.11-alpha.e42a8b.0
@codecademy/styleguide@77.0.3-alpha.e42a8b.0

@codecademydev
Copy link
Copy Markdown
Collaborator

🚀 Styleguide deploy preview ready!

https://68793a549dc6ff8a8b859d3e--gamut-preview.netlify.app

Deploy Logs

@LinKCoding LinKCoding added the Ship It :shipit: Ready 2 ship label Jul 17, 2025
@codecademydev codecademydev merged commit 18c4693 into main Jul 17, 2025
21 of 22 checks passed
@codecademydev codecademydev removed the Ship It :shipit: Ready 2 ship label Jul 17, 2025
@codecademydev codecademydev deleted the kl-gm-1153-platform-theme-updates branch July 17, 2025 18:56
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.

4 participants