Skip to content

Commit

Permalink
Update success color (#731)
Browse files Browse the repository at this point in the history 
* Deprecate old green colors and add new palette

* Update success colors

* Add changeset

* Update notification

* Revert for now

* Revert

* Update score-high
  • Loading branch information
@homing1
homing1 authored Dec 4, 2024
1 parent 0c61b76 commit a9f36c4
Show file tree
Hide file tree
Showing 3 changed files with 68 additions and 37 deletions.
5 changes: 5 additions & 0 deletions .changeset/lazy-files-bow.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@microsoft/atlas-css': minor
---

Update success colors to match Fluent 2 colors.
46 changes: 36 additions & 10 deletions css/src/tokens/palette.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,16 +146,42 @@ $palette-turqoise-opacity-70-deprecated: hsl(189deg 52% 12% / 70%) !default;

// Green

$palette-green-10: #dff6dd !default;
$palette-green-20: #acd7aa !default;
$palette-green-30: #7cbb7b !default;
$palette-green-40: #489d48 !default;
$palette-green-50: #2a8b2a !default;
$palette-green-60: #107c10 !default;
$palette-green-70: #0b6413 !default;
$palette-green-80: #054b16 !default;
$palette-green-90: #05350c !default;
$palette-green-100: #061a00 !default;
$palette-green-10-deprecated: #dff6dd !default;
$palette-green-20-deprecated: #acd7aa !default;
$palette-green-30-deprecated: #7cbb7b !default;
$palette-green-40-deprecated: #489d48 !default;
$palette-green-50-deprecated: #2a8b2a !default;
$palette-green-60-deprecated: #107c10 !default;
$palette-green-70-deprecated: #0b6413 !default;
$palette-green-80-deprecated: #054b16 !default;
$palette-green-90-deprecated: #05350c !default;
$palette-green-100-deprecated: #061a00 !default;

$palette-green-10: #f1faf1 !default;
$palette-green-20: #bdd99b !default;
$palette-green-30: #a8f0cd !default;
$palette-green-40: #a7e3a5 !default;
$palette-green-50: #9fd89f !default;
$palette-green-60: #9ad29a !default;
$palette-green-70: #5ae0a0 !default;
$palette-green-80: #5ec75a !default;
$palette-green-90: #54b054 !default;
$palette-green-100: #3db838 !default;
$palette-green-110: #00cc6a !default;
$palette-green-120: #4da64d !default;
$palette-green-130: #13a10e !default;
$palette-green-140: #359b35 !default;
$palette-green-150: #498205 !default;
$palette-green-160: #11910d !default;
$palette-green-170: #2a8b2a !default;
$palette-green-180: #107c10 !default;
$palette-green-190: #00723b !default;
$palette-green-200: #0e700e !default;
$palette-green-210: #0b5a08 !default;
$palette-green-220: #294903 !default;
$palette-green-230: #094509 !default;
$palette-green-240: #063b06 !default;
$palette-green-250: #052505 !default;

$palette-green-opacity-30: hsl(120deg 37% 45% / 30%) !default;
$palette-green-opacity-70: hsl(120deg 37% 45% / 70%) !default;
Expand Down
54 changes: 27 additions & 27 deletions css/src/tokens/themes.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ $themes: (
'score-medium-off': $palette-yellow-opacity-30,
'score-medium': $palette-yellow-50,
'score-high-off': $palette-green-opacity-30,
'score-high': $palette-green-50,
'score-high': $palette-green-170,
'hyperlink': $palette-blue-60-deprecated,
'primary-base': $palette-blue-110,
'primary-background': $palette-blue-10,
Expand Down Expand Up @@ -73,14 +73,14 @@ $themes: (
'tertiary-active': $palette-navy-50,
'tertiary-box-shadow': $palette-navy-opacity-30,
'tertiary-invert': $palette-white,
'success-base': $palette-green-60,
'success-base': $palette-green-180,
'success-background': $palette-green-10,
'success-background-hover': $palette-navy-30,
'success-background-hover': $palette-green-50,
'success-background-glow-high-contrast': $palette-green-10,
'success-dark': $palette-green-80,
'success-dark-hover': $palette-navy-50,
'success-hover': $palette-green-70,
'success-active': $palette-green-80,
'success-dark': $palette-green-200,
'success-dark-hover': $palette-green-130,
'success-hover': $palette-green-210,
'success-active': $palette-green-50,
'success-box-shadow': $palette-green-opacity-30,
'success-invert': $palette-white,
'info-base': $palette-purple-60,
Expand Down Expand Up @@ -153,14 +153,14 @@ $themes: (
'control-border': $palette-grey-40,
'control-border-bottom': $palette-grey-30,
'inline-code': $palette-grey-100,
'code-highlight-background': $palette-green-70,
'code-highlight-background': $palette-green-70-deprecated,
'visited': $palette-purple-40,
'score-low-off': $palette-red-opacity-70,
'score-low': $palette-red-50,
'score-medium-off': $palette-yellow-opacity-30,
'score-medium': $palette-yellow-40,
'score-high-off': $palette-green-opacity-70,
'score-high': $palette-green-40,
'score-high': $palette-green-40-deprecated,
'hyperlink': $palette-blue-30-deprecated,
'primary-base': $palette-blue-30-deprecated,
'primary-background': $palette-blue-80-deprecated,
Expand Down Expand Up @@ -192,14 +192,14 @@ $themes: (
'tertiary-active': $palette-grey-80,
'tertiary-box-shadow': $palette-blue-opacity-30,
'tertiary-invert': $palette-white,
'success-base': $palette-green-30,
'success-background': $palette-green-80,
'success-background-hover': $palette-green-60,
'success-background-glow-high-contrast': $palette-green-80,
'success-dark': $palette-green-10,
'success-dark-hover': $palette-green-30,
'success-hover': $palette-green-40,
'success-active': $palette-green-30,
'success-base': $palette-green-30-deprecated,
'success-background': $palette-green-80-deprecated,
'success-background-hover': $palette-green-60-deprecated,
'success-background-glow-high-contrast': $palette-green-80-deprecated,
'success-dark': $palette-green-10-deprecated,
'success-dark-hover': $palette-green-30-deprecated,
'success-hover': $palette-green-40-deprecated,
'success-active': $palette-green-30-deprecated,
'success-box-shadow': $palette-green-opacity-70,
'success-invert': $palette-black,
'info-base': $palette-purple-50,
Expand Down Expand Up @@ -272,14 +272,14 @@ $themes: (
'control-border': $palette-white,
'control-border-bottom': $palette-white,
'inline-code': $palette-grey-110,
'code-highlight-background': $palette-green-70,
'code-highlight-background': $palette-green-70-deprecated,
'visited': $palette-visited-high-contrast,
'score-low-off': $palette-red-60,
'score-low': $palette-red-10,
'score-medium-off': $palette-yellow-opacity-70,
'score-medium': $palette-yellow-20,
'score-high-off': $palette-green-60,
'score-high': $palette-green-10,
'score-high-off': $palette-green-60-deprecated,
'score-high': $palette-green-10-deprecated,
'hyperlink': $palette-yellow-high-contrast,
'primary-base': $palette-yellow-high-contrast,
'primary-background': $palette-black,
Expand Down Expand Up @@ -311,14 +311,14 @@ $themes: (
'tertiary-active': $palette-grey-30,
'tertiary-box-shadow': $palette-white,
'tertiary-invert': $palette-black,
'success-base': $palette-green-30,
'success-base': $palette-green-30-deprecated,
'success-background': $palette-black,
'success-background-hover': $palette-green-20,
'success-background-glow-high-contrast': $palette-green-30,
'success-dark': $palette-green-20,
'success-dark-hover': $palette-green-30,
'success-hover': $palette-green-20,
'success-active': $palette-green-20,
'success-background-hover': $palette-green-20-deprecated,
'success-background-glow-high-contrast': $palette-green-30-deprecated,
'success-dark': $palette-green-20-deprecated,
'success-dark-hover': $palette-green-30-deprecated,
'success-hover': $palette-green-20-deprecated,
'success-active': $palette-green-20-deprecated,
'success-box-shadow': $palette-white,
'success-invert': $palette-black,
'info-base': $palette-purple-20,
Expand Down

0 comments on commit a9f36c4

Please sign in to comment.