-
Notifications
You must be signed in to change notification settings - Fork 54
Increased contrast in shades #277
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
Conversation
Step 6-9 have been slightly lowered in luminosity for increased contrast.
🦋 Changeset detectedLatest commit: 5e2fe73 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
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 |
|
This pull request is being automatically deployed with Vercel (learn more). 🔍 Inspect: https://vercel.com/primer/primitives/F6c8kd3Bd3JaAqeQdHPd7JxmB1T6 |
Variables changed--- base/dist/scss/colors/_light_high_contrast.scss 2021-11-25 00:52:04.919334835 +0000
+++ dist/scss/colors/_light_high_contrast.scss 2021-11-25 00:51:54.587182292 +0000
@@ -5,3 +5,3 @@
--color-marketing-icon-secondary: #368cf9;
- --color-diff-blob-addition-num-text: #24292F;
+ --color-diff-blob-addition-num-text: #0E1116;
--color-diff-blob-addition-fg: #ffffff;
@@ -10,3 +10,3 @@
--color-diff-blob-addition-word-bg: #055d20;
- --color-diff-blob-deletion-num-text: #24292F;
+ --color-diff-blob-deletion-num-text: #0E1116;
--color-diff-blob-deletion-fg: #ffffff;
@@ -16,3 +16,3 @@
--color-diff-blob-hunk-num-bg: #9cd7ff;
- --color-diff-blob-expander-icon: #24292F;
+ --color-diff-blob-expander-icon: #0E1116;
--color-diff-blob-selected-line-highlight-mix-blend-mode: multiply;
@@ -22,6 +22,6 @@
--color-search-keyword-hl: #fcf7be;
- --color-prettylights-syntax-comment: #67707A;
+ --color-prettylights-syntax-comment: #66707B;
--color-prettylights-syntax-constant: #023b95;
--color-prettylights-syntax-entity: #622cbc;
- --color-prettylights-syntax-storage-modifier-import: #24292F;
+ --color-prettylights-syntax-storage-modifier-import: #0E1116;
--color-prettylights-syntax-entity-tag: #024c1a;
@@ -38,4 +38,4 @@
--color-prettylights-syntax-markup-heading: #023b95;
- --color-prettylights-syntax-markup-italic: #24292F;
- --color-prettylights-syntax-markup-bold: #24292F;
+ --color-prettylights-syntax-markup-italic: #0E1116;
+ --color-prettylights-syntax-markup-bold: #0E1116;
--color-prettylights-syntax-markup-deleted-text: #6e011a;
@@ -49,6 +49,6 @@
--color-prettylights-syntax-meta-diff-range: #622cbc;
- --color-prettylights-syntax-brackethighlighter-angle: #4F5760;
+ --color-prettylights-syntax-brackethighlighter-angle: #4B535D;
--color-prettylights-syntax-sublimelinter-gutter-mark: #88929D;
--color-prettylights-syntax-constant-other-reference-link: #032563;
- --color-codemirror-text: #24292F;
+ --color-codemirror-text: #0E1116;
--color-codemirror-bg: #ffffff;
@@ -56,10 +56,10 @@
--color-codemirror-guttermarker-text: #ffffff;
- --color-codemirror-guttermarker-subtle-text: #67707A;
- --color-codemirror-linenumber-text: #24292F;
- --color-codemirror-cursor: #24292F;
+ --color-codemirror-guttermarker-subtle-text: #66707B;
+ --color-codemirror-linenumber-text: #0E1116;
+ --color-codemirror-cursor: #0E1116;
--color-codemirror-selection-bg: #368cf9;
--color-codemirror-activeline-bg: #E7ECF0;
- --color-codemirror-matchingbracket-text: #24292F;
+ --color-codemirror-matchingbracket-text: #0E1116;
--color-codemirror-lines-bg: #ffffff;
- --color-codemirror-syntax-comment: #24292F;
+ --color-codemirror-syntax-comment: #0E1116;
--color-codemirror-syntax-constant: #023b95;
@@ -71,3 +71,3 @@
--color-codemirror-syntax-variable: #702c00;
- --color-checks-bg: #24292F;
+ --color-checks-bg: #0E1116;
--color-checks-run-border-width: 0px;
@@ -83,3 +83,3 @@
--color-checks-input-focus-text: #88929D;
- --color-checks-input-bg: #30363D;
+ --color-checks-input-bg: #20252C;
--color-checks-input-shadow: none;
@@ -90,13 +90,13 @@
--color-checks-dropdown-text: #ACB6C0;
- --color-checks-dropdown-bg: #30363D;
- --color-checks-dropdown-border: #3D454E;
+ --color-checks-dropdown-bg: #20252C;
+ --color-checks-dropdown-border: #343B43;
--color-checks-dropdown-shadow: rgba(1,4,9,0.3);
--color-checks-dropdown-hover-text: #FFFFFF;
- --color-checks-dropdown-hover-bg: #3D454E;
+ --color-checks-dropdown-hover-bg: #343B43;
--color-checks-dropdown-btn-hover-text: #FFFFFF;
- --color-checks-dropdown-btn-hover-bg: #30363D;
- --color-checks-scrollbar-thumb-bg: #4F5760;
+ --color-checks-dropdown-btn-hover-bg: #20252C;
+ --color-checks-scrollbar-thumb-bg: #4B535D;
--color-checks-header-label-text: #CED5DC;
--color-checks-header-label-open-text: #FFFFFF;
- --color-checks-header-border: #30363D;
+ --color-checks-header-border: #20252C;
--color-checks-header-icon: #88929D;
@@ -105,6 +105,6 @@
--color-checks-line-timestamp-text: #88929D;
- --color-checks-line-hover-bg: #30363D;
+ --color-checks-line-hover-bg: #20252C;
--color-checks-line-selected-bg: rgba(17,104,227,0.15);
--color-checks-line-selected-num-text: #368cf9;
- --color-checks-line-dt-fm-text: #24292F;
+ --color-checks-line-dt-fm-text: #0E1116;
--color-checks-line-dt-fm-bg: #744500;
@@ -113,3 +113,3 @@
--color-checks-gate-waiting-text: #ACB6C0;
- --color-checks-step-header-open-bg: #30363D;
+ --color-checks-step-header-open-bg: #20252C;
--color-checks-step-error-text: #ee5a5d;
@@ -127,4 +127,4 @@
--color-checks-logline-section-text: #26a148;
- --color-checks-ansi-black: #24292F;
- --color-checks-ansi-black-bright: #30363D;
+ --color-checks-ansi-black: #0E1116;
+ --color-checks-ansi-black-bright: #20252C;
--color-checks-ansi-white: #CED5DC;
@@ -144,3 +144,3 @@
--color-checks-ansi-cyan-bright: #b3f0ff;
- --color-project-header-bg: #24292F;
+ --color-project-header-bg: #0E1116;
--color-project-sidebar-bg: #ffffff;
@@ -162,8 +162,8 @@
--color-select-menu-tap-focus-bg: #9cd7ff;
- --color-overlay-shadow: 0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(61,69,78,0.12);
+ --color-overlay-shadow: 0 1px 3px rgba(1,4,9,0.12), 0 8px 24px rgba(52,59,67,0.12);
--color-header-text: rgba(255,255,255,0.7);
- --color-header-bg: #24292F;
+ --color-header-bg: #0E1116;
--color-header-logo: #ffffff;
- --color-header-search-bg: #24292F;
- --color-header-search-border: #4F5760;
+ --color-header-search-bg: #0E1116;
+ --color-header-search-border: #4B535D;
--color-sidenav-selected-bg: #ffffff;
@@ -172,7 +172,7 @@
--color-timeline-badge-bg: #E7ECF0;
- --color-ansi-black: #24292F;
- --color-ansi-black-bright: #4F5760;
- --color-ansi-white: #67707A;
+ --color-ansi-black: #0E1116;
+ --color-ansi-black-bright: #4B535D;
+ --color-ansi-white: #66707B;
--color-ansi-white-bright: #88929D;
- --color-ansi-gray: #67707A;
+ --color-ansi-gray: #66707B;
--color-ansi-red: #a0111f;
@@ -189,3 +189,3 @@
--color-ansi-cyan-bright: #3192aa;
- --color-btn-text: #24292F;
+ --color-btn-text: #0E1116;
--color-btn-bg: #E7ECF0;
@@ -258,5 +258,5 @@
--color-btn-danger-hover-icon: #ffffff;
- --color-underlinenav-icon: #67707A;
+ --color-underlinenav-icon: #66707B;
--color-underlinenav-border-hover: rgba(172,182,192,0.2);
- --color-action-list-item-inline-divider: rgba(48,54,61,0.48);
+ --color-action-list-item-inline-divider: rgba(32,37,44,0.48);
--color-action-list-item-default-hover-bg: rgba(206,213,220,0.32);
@@ -267,5 +267,5 @@
--color-action-list-item-danger-hover-text: #a0111f;
- --color-fg-default: #24292F;
- --color-fg-muted: #24292F;
- --color-fg-subtle: #67707A;
+ --color-fg-default: #0E1116;
+ --color-fg-muted: #0E1116;
+ --color-fg-subtle: #66707B;
--color-fg-on-emphasis: #ffffff;
@@ -275,3 +275,3 @@
--color-canvas-subtle: #E7ECF0;
- --color-border-default: #30363D;
+ --color-border-default: #20252C;
--color-border-muted: #88929D;
@@ -282,4 +282,4 @@
--color-shadow-extra-large: 0 12px 28px rgba(136,146,157,0.3);
- --color-neutral-emphasis-plus: #24292F;
- --color-neutral-emphasis: #67707A;
+ --color-neutral-emphasis-plus: #0E1116;
+ --color-neutral-emphasis: #66707B;
--color-neutral-muted: rgba(172,182,192,0.2);
@@ -329,7 +329,7 @@
--color-scale-gray-4: #88929D;
- --color-scale-gray-5: #67707A;
- --color-scale-gray-6: #4F5760;
- --color-scale-gray-7: #3D454E;
- --color-scale-gray-8: #30363D;
- --color-scale-gray-9: #24292F;
+ --color-scale-gray-5: #66707B;
+ --color-scale-gray-6: #4B535D;
+ --color-scale-gray-7: #343B43;
+ --color-scale-gray-8: #20252C;
+ --color-scale-gray-9: #0E1116;
--color-scale-blue-0: #dff7ff; |
Step 6-9 have been slightly lowered in luminosity for increased contrast.
This will affect fog.default, muted, border.default and global header background.