Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Addressing a few lingering bugs with v8 #789

Merged
merged 5 commits into from
Dec 5, 2023
Merged

Addressing a few lingering bugs with v8 #789

merged 5 commits into from
Dec 5, 2023

Conversation

langermank
Copy link
Contributor

  • Fix foreground color for ToggleSwitch in dark high contrast
  • Bring borderColor-muted closer to the existing color

@langermank langermank requested a review from a team as a code owner December 5, 2023 01:25
@langermank langermank requested review from a team, lukasoppermann and siddharthkp December 5, 2023 01:25
@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Dec 5, 2023 •
edited
Loading

🦋 Changeset detected

Latest commit: d4803b0

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/primitives Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 5, 2023 •
edited
Loading

Variables changed 
No variables changed

@langermank langermank added the update snapshots Update visual regression test snapshots label Dec 5, 2023
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 5, 2023 •
edited
Loading

Design Token Diff

/css/functional/themes/dark-colorblind.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/dark-colorblind.css	2023-12-05 08:18:03.341659221 +0000
@@ -41,7 +41,7 @@
 --headerSearch-bgColor: #0d1117;
 --headerSearch-borderColor: #30363d;
 --avatar-bgColor: #ffffff1a;
-  --avatar-borderColor: #30363d66;
+  --avatar-borderColor: #30363d80;
 --avatar-shadow: 0px 0px 0px 2px #0d1117;
 --avatarStack-fade-bgColor-default: #30363d;
 --avatarStack-fade-bgColor-muted: #21262d;
@@ -244,7 +244,7 @@
 --bgColor-sponsors-muted: #db61a21a;
 --bgColor-sponsors-emphasis: #bf4b8a;
 --borderColor-default: #30363d;
-  --borderColor-muted: #30363d66;
+  --borderColor-muted: #30363d80;
 --borderColor-emphasis: #484f58;
 --borderColor-disabled: #161b22;
 --borderColor-transparent: #00000000;
@@ -461,7 +461,7 @@
   --headerSearch-bgColor: #0d1117;
   --headerSearch-borderColor: #30363d;
   --avatar-bgColor: #ffffff1a;
-    --avatar-borderColor: #30363d66;
+    --avatar-borderColor: #30363d80;
   --avatar-shadow: 0px 0px 0px 2px #0d1117;
   --avatarStack-fade-bgColor-default: #30363d;
   --avatarStack-fade-bgColor-muted: #21262d;
@@ -664,7 +664,7 @@
   --bgColor-sponsors-muted: #db61a21a;
   --bgColor-sponsors-emphasis: #bf4b8a;
   --borderColor-default: #30363d;
-    --borderColor-muted: #30363d66;
+    --borderColor-muted: #30363d80;
   --borderColor-emphasis: #484f58;
   --borderColor-disabled: #161b22;
   --borderColor-transparent: #00000000;

/css/functional/themes/dark-dimmed.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/dark-dimmed.css	2023-12-05 08:18:02.721653621 +0000
@@ -41,7 +41,7 @@
 --headerSearch-bgColor: #22272e;
 --headerSearch-borderColor: #444c56;
 --avatar-bgColor: #cdd9e51a;
-  --avatar-borderColor: #444c5666;
+  --avatar-borderColor: #444c5680;
 --avatar-shadow: 0px 0px 0px 2px #22272e;
 --avatarStack-fade-bgColor-default: #444c56;
 --avatarStack-fade-bgColor-muted: #373e47;
@@ -244,7 +244,7 @@
 --bgColor-sponsors-muted: #c961981a;
 --bgColor-sponsors-emphasis: #ae4c82;
 --borderColor-default: #444c56;
-  --borderColor-muted: #444c5666;
+  --borderColor-muted: #444c5680;
 --borderColor-emphasis: #545d68;
 --borderColor-disabled: #2d333b;
 --borderColor-transparent: #00000000;
@@ -461,7 +461,7 @@
   --headerSearch-bgColor: #22272e;
   --headerSearch-borderColor: #444c56;
   --avatar-bgColor: #cdd9e51a;
-    --avatar-borderColor: #444c5666;
+    --avatar-borderColor: #444c5680;
   --avatar-shadow: 0px 0px 0px 2px #22272e;
   --avatarStack-fade-bgColor-default: #444c56;
   --avatarStack-fade-bgColor-muted: #373e47;
@@ -664,7 +664,7 @@
   --bgColor-sponsors-muted: #c961981a;
   --bgColor-sponsors-emphasis: #ae4c82;
   --borderColor-default: #444c56;
-    --borderColor-muted: #444c5666;
+    --borderColor-muted: #444c5680;
   --borderColor-emphasis: #545d68;
   --borderColor-disabled: #2d333b;
   --borderColor-transparent: #00000000;

/css/functional/themes/dark-high-contrast.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/dark-high-contrast.css	2023-12-05 08:18:03.649662004 +0000
@@ -87,7 +87,7 @@
 --controlTrack-bgColor-hover: #383c45;
 --controlTrack-bgColor-active: #484e57;
 --controlTrack-bgColor-disabled: #bdc4cc;
-  --controlTrack-fgColor-rest: #0a0c10;
+  --controlTrack-fgColor-rest: #fbfcfd;
 --controlTrack-fgColor-disabled: #0a0c10;
 --controlTrack-borderColor-rest: #00000000;
 --controlTrack-borderColor-disabled: #bdc4cc;
@@ -507,7 +507,7 @@
   --controlTrack-bgColor-hover: #383c45;
   --controlTrack-bgColor-active: #484e57;
   --controlTrack-bgColor-disabled: #bdc4cc;
-    --controlTrack-fgColor-rest: #0a0c10;
+    --controlTrack-fgColor-rest: #fbfcfd;
   --controlTrack-fgColor-disabled: #0a0c10;
   --controlTrack-borderColor-rest: #00000000;
   --controlTrack-borderColor-disabled: #bdc4cc;

/css/functional/themes/dark-tritanopia.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/dark-tritanopia.css	2023-12-05 08:18:03.017656294 +0000
@@ -41,7 +41,7 @@
 --headerSearch-bgColor: #0d1117;
 --headerSearch-borderColor: #30363d;
 --avatar-bgColor: #ffffff1a;
-  --avatar-borderColor: #30363d66;
+  --avatar-borderColor: #30363d80;
 --avatar-shadow: 0px 0px 0px 2px #0d1117;
 --avatarStack-fade-bgColor-default: #30363d;
 --avatarStack-fade-bgColor-muted: #21262d;
@@ -244,7 +244,7 @@
 --bgColor-sponsors-muted: #db61a21a;
 --bgColor-sponsors-emphasis: #bf4b8a;
 --borderColor-default: #30363d;
-  --borderColor-muted: #30363d66;
+  --borderColor-muted: #30363d80;
 --borderColor-emphasis: #484f58;
 --borderColor-disabled: #161b22;
 --borderColor-transparent: #00000000;
@@ -461,7 +461,7 @@
   --headerSearch-bgColor: #0d1117;
   --headerSearch-borderColor: #30363d;
   --avatar-bgColor: #ffffff1a;
-    --avatar-borderColor: #30363d66;
+    --avatar-borderColor: #30363d80;
   --avatar-shadow: 0px 0px 0px 2px #0d1117;
   --avatarStack-fade-bgColor-default: #30363d;
   --avatarStack-fade-bgColor-muted: #21262d;
@@ -664,7 +664,7 @@
   --bgColor-sponsors-muted: #db61a21a;
   --bgColor-sponsors-emphasis: #bf4b8a;
   --borderColor-default: #30363d;
-    --borderColor-muted: #30363d66;
+    --borderColor-muted: #30363d80;
   --borderColor-emphasis: #484f58;
   --borderColor-disabled: #161b22;
   --borderColor-transparent: #00000000;

/css/functional/themes/dark.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/dark.css	2023-12-05 08:18:02.325650042 +0000
@@ -41,7 +41,7 @@
 --headerSearch-bgColor: #0d1117;
 --headerSearch-borderColor: #30363d;
 --avatar-bgColor: #ffffff1a;
-  --avatar-borderColor: #30363d66;
+  --avatar-borderColor: #30363d80;
 --avatar-shadow: 0px 0px 0px 2px #0d1117;
 --avatarStack-fade-bgColor-default: #30363d;
 --avatarStack-fade-bgColor-muted: #21262d;
@@ -244,7 +244,7 @@
 --bgColor-sponsors-muted: #db61a21a;
 --bgColor-sponsors-emphasis: #bf4b8a;
 --borderColor-default: #30363d;
-  --borderColor-muted: #30363d66;
+  --borderColor-muted: #30363d80;
 --borderColor-emphasis: #484f58;
 --borderColor-disabled: #161b22;
 --borderColor-transparent: #00000000;
@@ -461,7 +461,7 @@
   --headerSearch-bgColor: #0d1117;
   --headerSearch-borderColor: #30363d;
   --avatar-bgColor: #ffffff1a;
-    --avatar-borderColor: #30363d66;
+    --avatar-borderColor: #30363d80;
   --avatar-shadow: 0px 0px 0px 2px #0d1117;
   --avatarStack-fade-bgColor-default: #30363d;
   --avatarStack-fade-bgColor-muted: #21262d;
@@ -664,7 +664,7 @@
   --bgColor-sponsors-muted: #db61a21a;
   --bgColor-sponsors-emphasis: #bf4b8a;
   --borderColor-default: #30363d;
-    --borderColor-muted: #30363d66;
+    --borderColor-muted: #30363d80;
   --borderColor-emphasis: #484f58;
   --borderColor-disabled: #161b22;
   --borderColor-transparent: #00000000;

/css/functional/themes/light-colorblind.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/light-colorblind.css	2023-12-05 08:18:01.677644188 +0000
@@ -245,7 +245,7 @@
 --bgColor-sponsors-muted: #ffeff7;
 --bgColor-sponsors-emphasis: #bf3989;
 --borderColor-default: #d0d7de;
-  --borderColor-muted: #d0d7de66;
+  --borderColor-muted: #d0d7de80;
 --borderColor-emphasis: #6e7781;
 --borderColor-disabled: #f6f8fa;
 --borderColor-transparent: #ffffff00;
@@ -665,7 +665,7 @@
   --bgColor-sponsors-muted: #ffeff7;
   --bgColor-sponsors-emphasis: #bf3989;
   --borderColor-default: #d0d7de;
-    --borderColor-muted: #d0d7de66;
+    --borderColor-muted: #d0d7de80;
   --borderColor-emphasis: #6e7781;
   --borderColor-disabled: #f6f8fa;
   --borderColor-transparent: #ffffff00;

/css/functional/themes/light-tritanopia.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/light-tritanopia.css	2023-12-05 08:18:01.285640646 +0000
@@ -245,7 +245,7 @@
 --bgColor-sponsors-muted: #ffeff7;
 --bgColor-sponsors-emphasis: #bf3989;
 --borderColor-default: #d0d7de;
-  --borderColor-muted: #d0d7de66;
+  --borderColor-muted: #d0d7de80;
 --borderColor-emphasis: #6e7781;
 --borderColor-disabled: #f6f8fa;
 --borderColor-transparent: #ffffff00;
@@ -665,7 +665,7 @@
   --bgColor-sponsors-muted: #ffeff7;
   --bgColor-sponsors-emphasis: #bf3989;
   --borderColor-default: #d0d7de;
-    --borderColor-muted: #d0d7de66;
+    --borderColor-muted: #d0d7de80;
   --borderColor-emphasis: #6e7781;
   --borderColor-disabled: #f6f8fa;
   --borderColor-transparent: #ffffff00;

/css/functional/themes/light.css

 
+++ /home/runner/work/primitives/primitives/tokens-next-private/css/functional/themes/light.css	2023-12-05 08:18:00.853636743 +0000
@@ -245,7 +245,7 @@
 --bgColor-sponsors-muted: #ffeff7;
 --bgColor-sponsors-emphasis: #bf3989;
 --borderColor-default: #d0d7de;
-  --borderColor-muted: #d0d7de66;
+  --borderColor-muted: #d0d7de80;
 --borderColor-emphasis: #6e7781;
 --borderColor-disabled: #f6f8fa;
 --borderColor-transparent: #ffffff00;
@@ -665,7 +665,7 @@
   --bgColor-sponsors-muted: #ffeff7;
   --bgColor-sponsors-emphasis: #bf3989;
   --borderColor-default: #d0d7de;
-    --borderColor-muted: #d0d7de66;
+    --borderColor-muted: #d0d7de80;
   --borderColor-emphasis: #6e7781;
   --borderColor-disabled: #f6f8fa;
   --borderColor-transparent: #ffffff00;

@github-actions github-actions bot temporarily deployed to storybook-preview December 5, 2023 01:28 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview December 5, 2023 01:29 Inactive
@github-actions github-actions bot removed the update snapshots Update visual regression test snapshots label Dec 5, 2023
@lukasoppermann
Update ten-impalas-unite.md
d4803b0 
Just added a commit to hopefully get the actions to run
@lukasoppermann
Copy link
Contributor

Just noticed the off state in Dark-HC on bgColor-muted. Do we mind or is this fine?

CleanShot 2023-12-05 at 09 18 08@2x

@github-actions github-actions bot temporarily deployed to storybook-preview December 5, 2023 08:19 Inactive
lukasoppermann
lukasoppermann approved these changes Dec 5, 2023
View reviewed changes
Copy link
Contributor

@lukasoppermann lukasoppermann left a comment

Choose a reason for hiding this comment

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

Great. Just added one comment.

@langermank
Copy link
Contributor Author

Today we learned scale gray 7 and 8 are the same color in dark high contrast, causing that toggleswitch bug. I'm merging this PR as is but we'll followup with a more global fix for that.

@langermank langermank merged commit 0f97174 into main Dec 5, 2023
25 checks passed
@langermank langermank deleted the toggleswitch-contrast-fgcolor branch December 5, 2023 16:42
@primer primer bot mentioned this pull request Nov 23, 2023
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@lukasoppermann lukasoppermann lukasoppermann approved these changes

@siddharthkp siddharthkp Awaiting requested review from siddharthkp

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@langermank @lukasoppermann