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

TEMP build script for legacy tokens #787

Closed
wants to merge 23 commits into from
Closed

TEMP build script for legacy tokens #787

wants to merge 23 commits into from

Conversation

langermank
Copy link
Contributor

Do not merge

@langermank @siddharthkp
add script
08e8069 
Co-authored-by: Siddharth Kshetrapal <siddharthkp@users.noreply.github.com>
@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Nov 28, 2023 •
edited
Loading

⚠️ No Changeset found

Latest commit: c21d21f

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Nov 28, 2023 •
edited
Loading

Variables changed 
--- base/dist/scss/colors/_light.scss	2023-11-29 21:15:20.332040780 +0000
+++ dist/scss/colors/_light.scss	2023-11-29 21:15:07.096044887 +0000
@@ -2,8 +2,8 @@
   & {
-    --color-canvas-default-transparent: rgba(255,255,255,0);
-    --color-page-header-bg: #f6f8fa;
+    --color-canvas-default-transparent: var(--bgColor-default, var(--color-canvas-default, rgba(255,255,255,0)));
+    --color-page-header-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-marketing-icon-primary: #218bff;
     --color-marketing-icon-secondary: #54aeff;
-    --color-diff-blob-addition-num-text: #1F2328;
-    --color-diff-blob-addition-fg: #1F2328;
+    --color-diff-blob-addition-num-text: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-diff-blob-addition-fg: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
     --color-diff-blob-addition-num-bg: #ccffd8;
@@ -11,13 +11,13 @@
     --color-diff-blob-addition-word-bg: #abf2bc;
-    --color-diff-blob-deletion-num-text: #1F2328;
-    --color-diff-blob-deletion-fg: #1F2328;
+    --color-diff-blob-deletion-num-text: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-diff-blob-deletion-fg: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
     --color-diff-blob-deletion-num-bg: #ffd7d5;
-    --color-diff-blob-deletion-line-bg: #ffebe9;
-    --color-diff-blob-deletion-word-bg: rgba(255,129,130,0.4);
-    --color-diff-blob-hunk-num-bg: rgba(84,174,255,0.4);
-    --color-diff-blob-expander-icon: #656d76;
+    --color-diff-blob-deletion-line-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9));
+    --color-diff-blob-deletion-word-bg: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(255,129,130,0.4)));
+    --color-diff-blob-hunk-num-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-diff-blob-expander-icon: var(--control-iconColor-rest, var(--color-fg-muted, #656d76));
     --color-diff-blob-selected-line-highlight-mix-blend-mode: multiply;
-    --color-diffstat-deletion-border: rgba(31,35,40,0.15);
-    --color-diffstat-addition-border: rgba(31,35,40,0.15);
-    --color-diffstat-addition-bg: #1f883d;
+    --color-diffstat-deletion-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
+    --color-diffstat-addition-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
+    --color-diffstat-addition-bg: var(--control-borderColor-success, var(--color-success-emphasis, #1f883d));
     --color-search-keyword-hl: #fff8c5;
@@ -53,13 +53,13 @@
     --color-prettylights-syntax-constant-other-reference-link: #0a3069;
-    --color-codemirror-text: #1F2328;
-    --color-codemirror-bg: #ffffff;
-    --color-codemirror-gutters-bg: #ffffff;
-    --color-codemirror-guttermarker-text: #ffffff;
-    --color-codemirror-guttermarker-subtle-text: #6e7781;
-    --color-codemirror-linenumber-text: #656d76;
-    --color-codemirror-cursor: #1F2328;
-    --color-codemirror-selection-bg: rgba(84,174,255,0.4);
-    --color-codemirror-activeline-bg: rgba(234,238,242,0.5);
-    --color-codemirror-matchingbracket-text: #1F2328;
-    --color-codemirror-lines-bg: #ffffff;
+    --color-codemirror-text: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-codemirror-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-gutters-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-text: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-subtle-text: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-codemirror-linenumber-text: var(--control-iconColor-rest, var(--color-fg-muted, #656d76));
+    --color-codemirror-cursor: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-codemirror-selection-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-codemirror-activeline-bg: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
+    --color-codemirror-matchingbracket-text: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-codemirror-lines-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-codemirror-syntax-comment: #24292f;
@@ -88,3 +88,3 @@
     --color-checks-donut-pending: #bf8700;
-    --color-checks-donut-success: #1f883d;
+    --color-checks-donut-success: var(--control-borderColor-success, var(--color-success-emphasis, #1f883d));
     --color-checks-donut-neutral: #afb8c1;
@@ -156,3 +156,3 @@
     --color-avatar-bg: #ffffff;
-    --color-avatar-border: rgba(31,35,40,0.15);
+    --color-avatar-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-avatar-stack-fade: #afb8c1;
@@ -175,3 +175,3 @@
     --color-menu-bg-active: rgba(0,0,0,0);
-    --color-input-disabled-bg: rgba(175,184,193,0.2);
+    --color-input-disabled-bg: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
     --color-timeline-badge-bg: #eaeef2;
@@ -196,3 +196,3 @@
     --color-btn-bg: #f6f8fa;
-    --color-btn-border: rgba(31,35,40,0.15);
+    --color-btn-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-shadow: 0 1px 0 rgba(31,35,40,0.04);
@@ -200,5 +200,5 @@
     --color-btn-hover-bg: #f3f4f6;
-    --color-btn-hover-border: rgba(31,35,40,0.15);
+    --color-btn-hover-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-active-bg: hsla(220,14%,93%,1);
-    --color-btn-active-border: rgba(31,35,40,0.15);
+    --color-btn-active-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-selected-bg: hsla(220,14%,94%,1);
@@ -206,4 +206,4 @@
     --color-btn-primary-text: #ffffff;
-    --color-btn-primary-bg: #1f883d;
-    --color-btn-primary-border: rgba(31,35,40,0.15);
+    --color-btn-primary-bg: var(--control-borderColor-success, var(--color-success-emphasis, #1f883d));
+    --color-btn-primary-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-primary-shadow: 0 1px 0 rgba(31,35,40,0.1);
@@ -211,3 +211,3 @@
     --color-btn-primary-hover-bg: #1a7f37;
-    --color-btn-primary-hover-border: rgba(31,35,40,0.15);
+    --color-btn-primary-hover-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-primary-selected-bg: hsla(137,66%,28%,1);
@@ -216,3 +216,3 @@
     --color-btn-primary-disabled-bg: #94d3a2;
-    --color-btn-primary-disabled-border: rgba(31,35,40,0.15);
+    --color-btn-primary-disabled-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-primary-icon: rgba(255,255,255,0.8);
@@ -222,3 +222,3 @@
     --color-btn-outline-hover-bg: #0969da;
-    --color-btn-outline-hover-border: rgba(31,35,40,0.15);
+    --color-btn-outline-hover-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-outline-hover-shadow: 0 1px 0 rgba(31,35,40,0.1);
@@ -228,3 +228,3 @@
     --color-btn-outline-selected-bg: hsla(212,92%,42%,1);
-    --color-btn-outline-selected-border: rgba(31,35,40,0.15);
+    --color-btn-outline-selected-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-outline-selected-shadow: inset 0 1px 0 rgba(0,33,85,0.2);
@@ -240,3 +240,3 @@
     --color-btn-danger-hover-bg: #a40e26;
-    --color-btn-danger-hover-border: rgba(31,35,40,0.15);
+    --color-btn-danger-hover-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-danger-hover-shadow: 0 1px 0 rgba(31,35,40,0.1);
@@ -246,3 +246,3 @@
     --color-btn-danger-selected-bg: hsla(356,72%,44%,1);
-    --color-btn-danger-selected-border: rgba(31,35,40,0.15);
+    --color-btn-danger-selected-border: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
     --color-btn-danger-selected-shadow: inset 0 1px 0 rgba(76,0,20,0.2);
@@ -259,5 +259,5 @@
     --color-btn-inactive-text: #57606a;
-    --color-underlinenav-icon: #6e7781;
-    --color-underlinenav-border-hover: rgba(175,184,193,0.2);
-    --color-action-list-item-inline-divider: rgba(208,215,222,0.48);
+    --color-underlinenav-icon: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-underlinenav-border-hover: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-action-list-item-inline-divider: var(--borderColor-default, var(--color-border-default, rgba(208,215,222,0.48)));
     --color-action-list-item-default-hover-bg: rgba(208,215,222,0.32);
@@ -267,5 +267,5 @@
     --color-action-list-item-default-selected-bg: rgba(208,215,222,0.24);
-    --color-action-list-item-danger-hover-bg: rgba(255,235,233,0.64);
-    --color-action-list-item-danger-active-bg: #ffebe9;
-    --color-action-list-item-danger-hover-text: #d1242f;
+    --color-action-list-item-danger-hover-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(255,235,233,0.64)));
+    --color-action-list-item-danger-active-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9));
+    --color-action-list-item-danger-hover-text: var(--control-danger-fgColor-rest, var(--color-danger-fg, #d1242f));
     --color-switch-track-bg: #eaeef2;
@@ -274,19 +274,19 @@
     --color-switch-track-disabled-bg: #8c959f;
-    --color-switch-track-fg: #656d76;
-    --color-switch-track-disabled-fg: #ffffff;
+    --color-switch-track-fg: var(--control-iconColor-rest, var(--color-fg-muted, #656d76));
+    --color-switch-track-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-border: rgba(0,0,0,0);
-    --color-switch-track-checked-bg: #0969da;
+    --color-switch-track-checked-bg: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-switch-track-checked-hover-bg: #0860CA;
     --color-switch-track-checked-active-bg: #0757BA;
-    --color-switch-track-checked-fg: #ffffff;
-    --color-switch-track-checked-disabled-fg: #ffffff;
+    --color-switch-track-checked-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-checked-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-checked-border: rgba(0,0,0,0);
-    --color-switch-knob-bg: #ffffff;
-    --color-switch-knob-disabled-bg: #f6f8fa;
+    --color-switch-knob-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-switch-knob-border: #858F99;
-    --color-switch-knob-checked-bg: #ffffff;
-    --color-switch-knob-checked-disabled-bg: #f6f8fa;
-    --color-switch-knob-checked-border: #0969da;
+    --color-switch-knob-checked-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-checked-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-switch-knob-checked-border: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-segmented-control-bg: #eaeef2;
-    --color-segmented-control-button-bg: #ffffff;
+    --color-segmented-control-button-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-segmented-control-button-hover-bg: rgba(175,184,193,0.2);
@@ -296,64 +296,64 @@
     --color-tree-view-item-directory-fill: #54aeff;
-    --color-fg-default: #1F2328;
-    --color-fg-muted: #656d76;
-    --color-fg-subtle: #6e7781;
-    --color-fg-on-emphasis: #ffffff;
-    --color-canvas-default: #ffffff;
-    --color-canvas-overlay: #ffffff;
-    --color-canvas-inset: #f6f8fa;
-    --color-canvas-subtle: #f6f8fa;
-    --color-border-default: #d0d7de;
-    --color-border-muted: hsla(210,18%,87%,1);
-    --color-border-subtle: rgba(31,35,40,0.15);
-    --color-shadow-small: 0 1px 0 rgba(31,35,40,0.04);
-    --color-shadow-medium: 0 3px 6px rgba(140,149,159,0.15);
-    --color-shadow-large: 0 8px 24px rgba(140,149,159,0.2);
-    --color-shadow-extra-large: 0 12px 28px rgba(140,149,159,0.3);
-    --color-neutral-emphasis-plus: #24292f;
-    --color-neutral-emphasis: #6e7781;
-    --color-neutral-muted: rgba(175,184,193,0.2);
-    --color-neutral-subtle: rgba(234,238,242,0.5);
-    --color-accent-fg: #0969da;
-    --color-accent-emphasis: #0969da;
-    --color-accent-muted: rgba(84,174,255,0.4);
-    --color-accent-subtle: #ddf4ff;
-    --color-success-fg: #1a7f37;
-    --color-success-emphasis: #1f883d;
-    --color-success-muted: rgba(74,194,107,0.4);
-    --color-success-subtle: #dafbe1;
-    --color-attention-fg: #9a6700;
-    --color-attention-emphasis: #9a6700;
-    --color-attention-muted: rgba(212,167,44,0.4);
-    --color-attention-subtle: #fff8c5;
-    --color-severe-fg: #bc4c00;
-    --color-severe-emphasis: #bc4c00;
-    --color-severe-muted: rgba(251,143,68,0.4);
-    --color-severe-subtle: #fff1e5;
-    --color-danger-fg: #d1242f;
-    --color-danger-emphasis: #cf222e;
-    --color-danger-muted: rgba(255,129,130,0.4);
-    --color-danger-subtle: #ffebe9;
-    --color-open-fg: #1a7f37;
-    --color-open-emphasis: #1f883d;
-    --color-open-muted: rgba(74,194,107,0.4);
-    --color-open-subtle: #dafbe1;
-    --color-closed-fg: #d1242f;
-    --color-closed-emphasis: #cf222e;
-    --color-closed-muted: rgba(255,129,130,0.4);
-    --color-closed-subtle: #ffebe9;
-    --color-done-fg: #8250df;
-    --color-done-emphasis: #8250df;
-    --color-done-muted: rgba(194,151,255,0.4);
-    --color-done-subtle: #fbefff;
-    --color-sponsors-fg: #bf3989;
-    --color-sponsors-emphasis: #bf3989;
-    --color-sponsors-muted: rgba(255,128,200,0.4);
-    --color-sponsors-subtle: #ffeff7;
-    --color-primer-fg-disabled: #8c959f;
-    --color-primer-canvas-backdrop: rgba(31,35,40,0.5);
-    --color-primer-canvas-sticky: rgba(255,255,255,0.95);
-    --color-primer-border-active: #fd8c73;
-    --color-primer-border-contrast: rgba(31,35,40,0.1);
-    --color-primer-shadow-highlight: inset 0 1px 0 rgba(255,255,255,0.25);
-    --color-primer-shadow-inset: inset 0 1px 0 rgba(208,215,222,0.2);
+    --color-fg-default: var(--control-fgColor-rest, var(--color-fg-default, #1F2328));
+    --color-fg-muted: var(--control-iconColor-rest, var(--color-fg-muted, #656d76));
+    --color-fg-subtle: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-fg-on-emphasis: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-canvas-default: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-canvas-overlay: var(--overlay-bgColor, var(--color-canvas-overlay, #ffffff));
+    --color-canvas-inset: var(--bgColor-inset, var(--color-canvas-inset, #f6f8fa));
+    --color-canvas-subtle: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-border-default: var(--borderColor-default, var(--color-border-default, #d0d7de));
+    --color-border-muted: var(--borderColor-muted, var(--color-border-muted, hsla(210,18%,87%,1)));
+    --color-border-subtle: var(undefined, var(--color-border-subtle, rgba(31,35,40,0.15)));
+    --color-shadow-small: var(--shadow-resting-small, var(--color-shadow-small, 0 1px 0 rgba(31,35,40,0.04)));
+    --color-shadow-medium: var(--shadow-resting-medium, var(--color-shadow-medium, 0 3px 6px rgba(140,149,159,0.15)));
+    --color-shadow-large: var(--shadow-floating-large, var(--color-shadow-large, 0 8px 24px rgba(140,149,159,0.2)));
+    --color-shadow-extra-large: var(--shadow-floating-xlarge, var(--color-shadow-extra-large, 0 12px 28px rgba(140,149,159,0.3)));
+    --color-neutral-emphasis-plus: var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #24292f));
+    --color-neutral-emphasis: var(undefined, var(--color-neutral-emphasis, #6e7781));
+    --color-neutral-muted: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-neutral-subtle: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
+    --color-accent-fg: var(--focus-outlineColor, var(--color-accent-fg, #0969da));
+    --color-accent-emphasis: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
+    --color-accent-muted: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-accent-subtle: var(--bgColor-accent-muted, var(--color-accent-subtle, #ddf4ff));
+    --color-success-fg: var(--fgColor-success, var(--color-success-fg, #1a7f37));
+    --color-success-emphasis: var(--control-borderColor-success, var(--color-success-emphasis, #1f883d));
+    --color-success-muted: var(--borderColor-success-muted, var(--color-success-muted, rgba(74,194,107,0.4)));
+    --color-success-subtle: var(--bgColor-success-muted, var(--color-success-subtle, #dafbe1));
+    --color-attention-fg: var(--fgColor-attention, var(--color-attention-fg, #9a6700));
+    --color-attention-emphasis: var(--control-borderColor-warning, var(--color-attention-emphasis, #9a6700));
+    --color-attention-muted: var(--borderColor-attention-muted, var(--color-attention-muted, rgba(212,167,44,0.4)));
+    --color-attention-subtle: var(--bgColor-attention-muted, var(--color-attention-subtle, #fff8c5));
+    --color-severe-fg: var(--fgColor-severe, var(--color-severe-fg, #bc4c00));
+    --color-severe-emphasis: var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #bc4c00));
+    --color-severe-muted: var(--borderColor-severe-muted, var(--color-severe-muted, rgba(251,143,68,0.4)));
+    --color-severe-subtle: var(--bgColor-severe-muted, var(--color-severe-subtle, #fff1e5));
+    --color-danger-fg: var(--control-danger-fgColor-rest, var(--color-danger-fg, #d1242f));
+    --color-danger-emphasis: var(--control-borderColor-danger, var(--color-danger-emphasis, #cf222e));
+    --color-danger-muted: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(255,129,130,0.4)));
+    --color-danger-subtle: var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9));
+    --color-open-fg: var(--fgColor-open, var(--color-open-fg, #1a7f37));
+    --color-open-emphasis: var(--bgColor-open-emphasis, var(--color-open-emphasis, var(--control-borderColor-success, var(--color-success-emphasis, #1f883d))));
+    --color-open-muted: var(--borderColor-open-muted, var(--color-open-muted, rgba(74,194,107,0.4)));
+    --color-open-subtle: var(--bgColor-open-muted, var(--color-open-subtle, #dafbe1));
+    --color-closed-fg: var(--fgColor-closed, var(--color-closed-fg, var(--control-danger-fgColor-rest, var(--color-danger-fg, #d1242f))));
+    --color-closed-emphasis: var(--bgColor-closed-emphasis, var(--color-closed-emphasis, #cf222e));
+    --color-closed-muted: var(--borderColor-closed-muted, var(--color-closed-muted, rgba(255,129,130,0.4)));
+    --color-closed-subtle: var(--bgColor-closed-muted, var(--color-closed-subtle, #ffebe9));
+    --color-done-fg: var(--fgColor-done, var(--color-done-fg, #8250df));
+    --color-done-emphasis: var(--bgColor-done-emphasis, var(--color-done-emphasis, #8250df));
+    --color-done-muted: var(--borderColor-done-muted, var(--color-done-muted, rgba(194,151,255,0.4)));
+    --color-done-subtle: var(--bgColor-done-muted, var(--color-done-subtle, #fbefff));
+    --color-sponsors-fg: var(--fgColor-sponsors, var(--color-sponsors-fg, #bf3989));
+    --color-sponsors-emphasis: var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #bf3989));
+    --color-sponsors-muted: var(--borderColor-sponsors-muted, var(--color-sponsors-muted, rgba(255,128,200,0.4)));
+    --color-sponsors-subtle: var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, #ffeff7));
+    --color-primer-fg-disabled: var(undefined, var(--color-fg-disabled, #8c959f));
+    --color-primer-canvas-backdrop: var(undefined, var(--color-canvas-backdrop, rgba(31,35,40,0.5)));
+    --color-primer-canvas-sticky: var(undefined, var(--color-canvas-sticky, rgba(255,255,255,0.95)));
+    --color-primer-border-active: var(undefined, var(--color-border-active, #fd8c73));
+    --color-primer-border-contrast: var(undefined, var(--color-border-contrast, rgba(31,35,40,0.1)));
+    --color-primer-shadow-highlight: var(undefined, var(--color-shadow-highlight, inset 0 1px 0 rgba(255,255,255,0.25)));
+    --color-primer-shadow-inset: var(undefined, var(--color-shadow-inset, inset 0 1px 0 rgba(208,215,222,0.2)));
     --color-scale-black: #1F2328;
--- base/dist/scss/colors/_light_colorblind.scss	2023-11-29 21:15:20.348040774 +0000
+++ dist/scss/colors/_light_colorblind.scss	2023-11-29 21:15:07.112044881 +0000
@@ -2,4 +2,4 @@
   & {
-    --color-canvas-default-transparent: rgba(255,255,255,0);
-    --color-page-header-bg: #f6f8fa;
+    --color-canvas-default-transparent: var(--bgColor-default, var(--color-canvas-default, rgba(255,255,255,0)));
+    --color-page-header-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-marketing-icon-primary: #218bff;
@@ -8,15 +8,15 @@
     --color-diff-blob-addition-fg: #24292f;
-    --color-diff-blob-addition-num-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-addition-num-bg: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-addition-line-bg: rgba(221,244,255,0.5);
-    --color-diff-blob-addition-word-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-addition-word-bg: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-deletion-num-text: #24292f;
     --color-diff-blob-deletion-fg: #24292f;
-    --color-diff-blob-deletion-num-bg: rgba(247,153,57,0.4);
+    --color-diff-blob-deletion-num-bg: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(247,153,57,0.4)));
     --color-diff-blob-deletion-line-bg: rgba(255,245,232,0.5);
     --color-diff-blob-deletion-word-bg: rgba(255,188,109,0.5);
-    --color-diff-blob-hunk-num-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-hunk-num-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-expander-icon: #57606a;
     --color-diff-blob-selected-line-highlight-mix-blend-mode: multiply;
-    --color-diffstat-deletion-border: rgba(27,31,36,0.15);
-    --color-diffstat-addition-border: rgba(27,31,36,0.15);
+    --color-diffstat-deletion-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
+    --color-diffstat-addition-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-diffstat-addition-bg: #0969da;
@@ -54,12 +54,12 @@
     --color-codemirror-text: #24292f;
-    --color-codemirror-bg: #ffffff;
-    --color-codemirror-gutters-bg: #ffffff;
-    --color-codemirror-guttermarker-text: #ffffff;
-    --color-codemirror-guttermarker-subtle-text: #6e7781;
+    --color-codemirror-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-gutters-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-text: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-subtle-text: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
     --color-codemirror-linenumber-text: #57606a;
     --color-codemirror-cursor: #24292f;
-    --color-codemirror-selection-bg: rgba(84,174,255,0.4);
-    --color-codemirror-activeline-bg: rgba(234,238,242,0.5);
+    --color-codemirror-selection-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-codemirror-activeline-bg: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
     --color-codemirror-matchingbracket-text: #24292f;
-    --color-codemirror-lines-bg: #ffffff;
+    --color-codemirror-lines-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-codemirror-syntax-comment: #24292f;
@@ -156,3 +156,3 @@
     --color-avatar-bg: #ffffff;
-    --color-avatar-border: rgba(27,31,36,0.15);
+    --color-avatar-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-avatar-stack-fade: #afb8c1;
@@ -175,3 +175,3 @@
     --color-menu-bg-active: rgba(0,0,0,0);
-    --color-input-disabled-bg: rgba(175,184,193,0.2);
+    --color-input-disabled-bg: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
     --color-timeline-badge-bg: #eaeef2;
@@ -196,3 +196,3 @@
     --color-btn-bg: #f6f8fa;
-    --color-btn-border: rgba(27,31,36,0.15);
+    --color-btn-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-shadow: 0 1px 0 rgba(27,31,36,0.04);
@@ -200,5 +200,5 @@
     --color-btn-hover-bg: #f3f4f6;
-    --color-btn-hover-border: rgba(27,31,36,0.15);
+    --color-btn-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-active-bg: hsla(220,14%,93%,1);
-    --color-btn-active-border: rgba(27,31,36,0.15);
+    --color-btn-active-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-selected-bg: hsla(220,14%,94%,1);
@@ -207,3 +207,3 @@
     --color-btn-primary-bg: #0969da;
-    --color-btn-primary-border: rgba(27,31,36,0.15);
+    --color-btn-primary-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -211,3 +211,3 @@
     --color-btn-primary-hover-bg: #0969da;
-    --color-btn-primary-hover-border: rgba(27,31,36,0.15);
+    --color-btn-primary-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-selected-bg: hsla(212,92%,43%,1);
@@ -216,3 +216,3 @@
     --color-btn-primary-disabled-bg: #80ccff;
-    --color-btn-primary-disabled-border: rgba(27,31,36,0.15);
+    --color-btn-primary-disabled-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-icon: rgba(255,255,255,0.8);
@@ -222,3 +222,3 @@
     --color-btn-outline-hover-bg: #0969da;
-    --color-btn-outline-hover-border: rgba(27,31,36,0.15);
+    --color-btn-outline-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-outline-hover-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -228,3 +228,3 @@
     --color-btn-outline-selected-bg: hsla(212,92%,42%,1);
-    --color-btn-outline-selected-border: rgba(27,31,36,0.15);
+    --color-btn-outline-selected-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-outline-selected-shadow: inset 0 1px 0 rgba(0,33,85,0.2);
@@ -240,3 +240,3 @@
     --color-btn-danger-hover-bg: #8a4600;
-    --color-btn-danger-hover-border: rgba(27,31,36,0.15);
+    --color-btn-danger-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-danger-hover-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -246,3 +246,3 @@
     --color-btn-danger-selected-bg: hsla(30,100%,32%,1);
-    --color-btn-danger-selected-border: rgba(27,31,36,0.15);
+    --color-btn-danger-selected-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-danger-selected-shadow: inset 0 1px 0 rgba(65,32,0,0.2);
@@ -259,5 +259,5 @@
     --color-btn-inactive-text: #57606a;
-    --color-underlinenav-icon: #6e7781;
-    --color-underlinenav-border-hover: rgba(175,184,193,0.2);
-    --color-action-list-item-inline-divider: rgba(208,215,222,0.48);
+    --color-underlinenav-icon: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-underlinenav-border-hover: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-action-list-item-inline-divider: var(--borderColor-default, var(--color-border-default, rgba(208,215,222,0.48)));
     --color-action-list-item-default-hover-bg: rgba(208,215,222,0.32);
@@ -267,4 +267,4 @@
     --color-action-list-item-default-selected-bg: rgba(208,215,222,0.24);
-    --color-action-list-item-danger-hover-bg: rgba(255,245,232,0.64);
-    --color-action-list-item-danger-active-bg: #fff5e8;
+    --color-action-list-item-danger-hover-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(255,245,232,0.64)));
+    --color-action-list-item-danger-active-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, #fff5e8));
     --color-action-list-item-danger-hover-text: #b35900;
@@ -275,18 +275,18 @@
     --color-switch-track-fg: #57606a;
-    --color-switch-track-disabled-fg: #ffffff;
+    --color-switch-track-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-border: rgba(0,0,0,0);
-    --color-switch-track-checked-bg: #0969da;
+    --color-switch-track-checked-bg: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-switch-track-checked-hover-bg: #0860CA;
     --color-switch-track-checked-active-bg: #0757BA;
-    --color-switch-track-checked-fg: #ffffff;
-    --color-switch-track-checked-disabled-fg: #ffffff;
+    --color-switch-track-checked-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-checked-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-checked-border: rgba(0,0,0,0);
-    --color-switch-knob-bg: #ffffff;
-    --color-switch-knob-disabled-bg: #f6f8fa;
+    --color-switch-knob-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-switch-knob-border: #858F99;
-    --color-switch-knob-checked-bg: #ffffff;
-    --color-switch-knob-checked-disabled-bg: #f6f8fa;
-    --color-switch-knob-checked-border: #0969da;
+    --color-switch-knob-checked-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-checked-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-switch-knob-checked-border: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-segmented-control-bg: #eaeef2;
-    --color-segmented-control-button-bg: #ffffff;
+    --color-segmented-control-button-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-segmented-control-button-hover-bg: rgba(175,184,193,0.2);
@@ -298,39 +298,39 @@
     --color-fg-muted: #57606a;
-    --color-fg-subtle: #6e7781;
-    --color-fg-on-emphasis: #ffffff;
-    --color-canvas-default: #ffffff;
-    --color-canvas-overlay: #ffffff;
-    --color-canvas-inset: #f6f8fa;
-    --color-canvas-subtle: #f6f8fa;
-    --color-border-default: #d0d7de;
-    --color-border-muted: hsla(210,18%,87%,1);
-    --color-border-subtle: rgba(27,31,36,0.15);
-    --color-shadow-small: 0 1px 0 rgba(27,31,36,0.04);
-    --color-shadow-medium: 0 3px 6px rgba(140,149,159,0.15);
-    --color-shadow-large: 0 8px 24px rgba(140,149,159,0.2);
-    --color-shadow-extra-large: 0 12px 28px rgba(140,149,159,0.3);
-    --color-neutral-emphasis-plus: #24292f;
-    --color-neutral-emphasis: #6e7781;
-    --color-neutral-muted: rgba(175,184,193,0.2);
-    --color-neutral-subtle: rgba(234,238,242,0.5);
-    --color-accent-fg: #0969da;
-    --color-accent-emphasis: #0969da;
-    --color-accent-muted: rgba(84,174,255,0.4);
-    --color-accent-subtle: #ddf4ff;
-    --color-success-fg: #0969da;
+    --color-fg-subtle: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-fg-on-emphasis: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-canvas-default: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-canvas-overlay: var(--overlay-bgColor, var(--color-canvas-overlay, #ffffff));
+    --color-canvas-inset: var(--bgColor-inset, var(--color-canvas-inset, #f6f8fa));
+    --color-canvas-subtle: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-border-default: var(--borderColor-default, var(--color-border-default, #d0d7de));
+    --color-border-muted: var(--borderColor-muted, var(--color-border-muted, hsla(210,18%,87%,1)));
+    --color-border-subtle: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
+    --color-shadow-small: var(--shadow-resting-small, var(--color-shadow-small, 0 1px 0 rgba(27,31,36,0.04)));
+    --color-shadow-medium: var(--shadow-resting-medium, var(--color-shadow-medium, 0 3px 6px rgba(140,149,159,0.15)));
+    --color-shadow-large: var(--shadow-floating-large, var(--color-shadow-large, 0 8px 24px rgba(140,149,159,0.2)));
+    --color-shadow-extra-large: var(--shadow-floating-xlarge, var(--color-shadow-extra-large, 0 12px 28px rgba(140,149,159,0.3)));
+    --color-neutral-emphasis-plus: var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #24292f));
+    --color-neutral-emphasis: var(undefined, var(--color-neutral-emphasis, #6e7781));
+    --color-neutral-muted: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-neutral-subtle: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
+    --color-accent-fg: var(--focus-outlineColor, var(--color-accent-fg, #0969da));
+    --color-accent-emphasis: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
+    --color-accent-muted: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-accent-subtle: var(--bgColor-accent-muted, var(--color-accent-subtle, #ddf4ff));
+    --color-success-fg: var(--fgColor-success, var(--color-success-fg, #0969da));
     --color-success-emphasis: #0969da;
-    --color-success-muted: rgba(84,174,255,0.4);
-    --color-success-subtle: #ddf4ff;
-    --color-attention-fg: #9a6700;
-    --color-attention-emphasis: #9a6700;
-    --color-attention-muted: rgba(212,167,44,0.4);
-    --color-attention-subtle: #fff8c5;
-    --color-severe-fg: #b35900;
-    --color-severe-emphasis: #b35900;
-    --color-severe-muted: rgba(247,153,57,0.4);
-    --color-severe-subtle: #fff5e8;
+    --color-success-muted: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
+    --color-success-subtle: var(--bgColor-success-muted, var(--color-success-subtle, #ddf4ff));
+    --color-attention-fg: var(--fgColor-attention, var(--color-attention-fg, #9a6700));
+    --color-attention-emphasis: var(--control-borderColor-warning, var(--color-attention-emphasis, #9a6700));
+    --color-attention-muted: var(--borderColor-attention-muted, var(--color-attention-muted, rgba(212,167,44,0.4)));
+    --color-attention-subtle: var(--bgColor-attention-muted, var(--color-attention-subtle, #fff8c5));
+    --color-severe-fg: var(--fgColor-severe, var(--color-severe-fg, #b35900));
+    --color-severe-emphasis: var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #b35900));
+    --color-severe-muted: var(--borderColor-severe-muted, var(--color-severe-muted, rgba(247,153,57,0.4)));
+    --color-severe-subtle: var(--bgColor-severe-muted, var(--color-severe-subtle, #fff5e8));
     --color-danger-fg: #b35900;
-    --color-danger-emphasis: #b35900;
-    --color-danger-muted: rgba(247,153,57,0.4);
-    --color-danger-subtle: #fff5e8;
+    --color-danger-emphasis: var(--control-borderColor-danger, var(--color-danger-emphasis, #b35900));
+    --color-danger-muted: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(247,153,57,0.4)));
+    --color-danger-subtle: var(--bgColor-danger-muted, var(--color-danger-subtle, #fff5e8));
     --color-open-fg: #b35900;
@@ -343,17 +343,17 @@
     --color-closed-subtle: #f6f8fa;
-    --color-done-fg: #8250df;
-    --color-done-emphasis: #8250df;
-    --color-done-muted: rgba(194,151,255,0.4);
-    --color-done-subtle: #fbefff;
-    --color-sponsors-fg: #bf3989;
-    --color-sponsors-emphasis: #bf3989;
-    --color-sponsors-muted: rgba(255,128,200,0.4);
-    --color-sponsors-subtle: #ffeff7;
-    --color-primer-fg-disabled: #8c959f;
-    --color-primer-canvas-backdrop: rgba(27,31,36,0.5);
-    --color-primer-canvas-sticky: rgba(255,255,255,0.95);
-    --color-primer-border-active: #fd8c73;
-    --color-primer-border-contrast: rgba(27,31,36,0.1);
-    --color-primer-shadow-highlight: inset 0 1px 0 rgba(255,255,255,0.25);
-    --color-primer-shadow-inset: inset 0 1px 0 rgba(208,215,222,0.2);
+    --color-done-fg: var(--fgColor-done, var(--color-done-fg, #8250df));
+    --color-done-emphasis: var(--bgColor-done-emphasis, var(--color-done-emphasis, #8250df));
+    --color-done-muted: var(--borderColor-done-muted, var(--color-done-muted, rgba(194,151,255,0.4)));
+    --color-done-subtle: var(--bgColor-done-muted, var(--color-done-subtle, #fbefff));
+    --color-sponsors-fg: var(--fgColor-sponsors, var(--color-sponsors-fg, #bf3989));
+    --color-sponsors-emphasis: var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #bf3989));
+    --color-sponsors-muted: var(--borderColor-sponsors-muted, var(--color-sponsors-muted, rgba(255,128,200,0.4)));
+    --color-sponsors-subtle: var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, #ffeff7));
+    --color-primer-fg-disabled: var(undefined, var(--color-fg-disabled, #8c959f));
+    --color-primer-canvas-backdrop: var(undefined, var(--color-canvas-backdrop, rgba(27,31,36,0.5)));
+    --color-primer-canvas-sticky: var(undefined, var(--color-canvas-sticky, rgba(255,255,255,0.95)));
+    --color-primer-border-active: var(undefined, var(--color-border-active, #fd8c73));
+    --color-primer-border-contrast: var(undefined, var(--color-border-contrast, rgba(27,31,36,0.1)));
+    --color-primer-shadow-highlight: var(undefined, var(--color-shadow-highlight, inset 0 1px 0 rgba(255,255,255,0.25)));
+    --color-primer-shadow-inset: var(undefined, var(--color-shadow-inset, inset 0 1px 0 rgba(208,215,222,0.2)));
     --color-scale-black: #1b1f24;
--- base/dist/scss/colors/_light_high_contrast.scss	2023-11-29 21:15:20.340040777 +0000
+++ dist/scss/colors/_light_high_contrast.scss	2023-11-29 21:15:07.104044884 +0000
@@ -2,4 +2,4 @@
   & {
-    --color-canvas-default-transparent: rgba(255,255,255,0);
-    --color-page-header-bg: #ffffff;
+    --color-canvas-default-transparent: var(--bgColor-default, var(--color-canvas-default, rgba(255,255,255,0)));
+    --color-page-header-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-marketing-icon-primary: #1168e3;
@@ -7,3 +7,3 @@
     --color-diff-blob-addition-num-text: #0e1116;
-    --color-diff-blob-addition-fg: #ffffff;
+    --color-diff-blob-addition-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-diff-blob-addition-num-bg: #ccffd8;
@@ -12,6 +12,6 @@
     --color-diff-blob-deletion-num-text: #0e1116;
-    --color-diff-blob-deletion-fg: #ffffff;
+    --color-diff-blob-deletion-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-diff-blob-deletion-num-bg: #ffd7d5;
-    --color-diff-blob-deletion-line-bg: #fff0ee;
-    --color-diff-blob-deletion-word-bg: #a0111f;
+    --color-diff-blob-deletion-line-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, #fff0ee));
+    --color-diff-blob-deletion-word-bg: var(--control-borderColor-danger, var(--color-danger-emphasis, #a0111f));
     --color-diff-blob-hunk-num-bg: #9cd7ff;
@@ -54,6 +54,6 @@
     --color-codemirror-text: #0e1116;
-    --color-codemirror-bg: #ffffff;
-    --color-codemirror-gutters-bg: #ffffff;
-    --color-codemirror-guttermarker-text: #ffffff;
-    --color-codemirror-guttermarker-subtle-text: #66707b;
+    --color-codemirror-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-gutters-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-text: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-subtle-text: var(--control-fgColor-placeholder, var(--color-fg-subtle, #66707b));
     --color-codemirror-linenumber-text: #0e1116;
@@ -63,3 +63,3 @@
     --color-codemirror-matchingbracket-text: #0e1116;
-    --color-codemirror-lines-bg: #ffffff;
+    --color-codemirror-lines-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-codemirror-syntax-comment: #0e1116;
@@ -160,3 +160,3 @@
     --color-avatar-child-shadow: 0 0 0 2px rgba(255,255,255,0.8);
-    --color-topic-tag-border: #0349b4;
+    --color-topic-tag-border: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4));
     --color-counter-border: #20252c;
@@ -175,3 +175,3 @@
     --color-menu-bg-active: rgba(0,0,0,0);
-    --color-input-disabled-bg: rgba(172,182,192,0.2);
+    --color-input-disabled-bg: var(--bgColor-disabled, var(--color-neutral-muted, rgba(172,182,192,0.2)));
     --color-timeline-badge-bg: #e7ecf0;
@@ -221,3 +221,3 @@
     --color-btn-outline-hover-text: #ffffff;
-    --color-btn-outline-hover-bg: #0349b4;
+    --color-btn-outline-hover-bg: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4));
     --color-btn-outline-hover-border: #022f7a;
@@ -239,3 +239,3 @@
     --color-btn-danger-hover-text: #ffffff;
-    --color-btn-danger-hover-bg: #a0111f;
+    --color-btn-danger-hover-bg: var(--control-borderColor-danger, var(--color-danger-emphasis, #a0111f));
     --color-btn-danger-hover-border: #6e011a;
@@ -259,4 +259,4 @@
     --color-btn-inactive-text: #4b535d;
-    --color-underlinenav-icon: #66707b;
-    --color-underlinenav-border-hover: rgba(172,182,192,0.2);
+    --color-underlinenav-icon: var(--control-fgColor-placeholder, var(--color-fg-subtle, #66707b));
+    --color-underlinenav-border-hover: var(--bgColor-disabled, var(--color-neutral-muted, rgba(172,182,192,0.2)));
     --color-action-list-item-inline-divider: #88929d;
@@ -267,26 +267,26 @@
     --color-action-list-item-default-selected-bg: #ced5dc;
-    --color-action-list-item-danger-hover-bg: #a0111f;
+    --color-action-list-item-danger-hover-bg: var(--control-borderColor-danger, var(--color-danger-emphasis, #a0111f));
     --color-action-list-item-danger-active-bg: #6e011a;
-    --color-action-list-item-danger-hover-text: #ffffff;
-    --color-switch-track-bg: #66707b;
-    --color-switch-track-hover-bg: hsla(211,9%,47%,1);
-    --color-switch-track-active-bg: hsla(211,9%,49%,1);
+    --color-action-list-item-danger-hover-text: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-bg: var(undefined, var(--color-neutral-emphasis, #66707b));
+    --color-switch-track-hover-bg: var(undefined, var(--color-neutral-emphasis, hsla(211,9%,47%,1)));
+    --color-switch-track-active-bg: var(undefined, var(--color-neutral-emphasis, hsla(211,9%,49%,1)));
     --color-switch-track-disabled-bg: #88929d;
-    --color-switch-track-fg: #ffffff;
-    --color-switch-track-disabled-fg: #ffffff;
+    --color-switch-track-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-border: rgba(0,0,0,0);
-    --color-switch-track-checked-bg: #0349b4;
+    --color-switch-track-checked-bg: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4));
     --color-switch-track-checked-hover-bg: #0860CA;
     --color-switch-track-checked-active-bg: #0757BA;
-    --color-switch-track-checked-fg: #ffffff;
-    --color-switch-track-checked-disabled-fg: #ffffff;
+    --color-switch-track-checked-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-checked-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-checked-border: rgba(0,0,0,0);
-    --color-switch-knob-bg: #ffffff;
+    --color-switch-knob-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-switch-knob-disabled-bg: #e7ecf0;
     --color-switch-knob-border: #20252c;
-    --color-switch-knob-checked-bg: #ffffff;
+    --color-switch-knob-checked-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-switch-knob-checked-disabled-bg: #e7ecf0;
-    --color-switch-knob-checked-border: #0349b4;
+    --color-switch-knob-checked-border: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4));
     --color-segmented-control-bg: #e7ecf0;
-    --color-segmented-control-button-bg: #ffffff;
+    --color-segmented-control-button-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-segmented-control-button-hover-bg: rgba(172,182,192,0.2);
@@ -298,6 +298,6 @@
     --color-fg-muted: #0e1116;
-    --color-fg-subtle: #66707b;
-    --color-fg-on-emphasis: #ffffff;
-    --color-canvas-default: #ffffff;
-    --color-canvas-overlay: #ffffff;
+    --color-fg-subtle: var(--control-fgColor-placeholder, var(--color-fg-subtle, #66707b));
+    --color-fg-on-emphasis: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-canvas-default: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-canvas-overlay: var(--overlay-bgColor, var(--color-canvas-overlay, #ffffff));
     --color-canvas-inset: #ffffff;
@@ -307,53 +307,53 @@
     --color-border-subtle: rgba(1,4,9,0.8);
-    --color-shadow-small: 0 1px 0 rgba(1,4,9,0.04);
-    --color-shadow-medium: 0 3px 6px rgba(136,146,157,0.15);
-    --color-shadow-large: 0 8px 24px rgba(136,146,157,0.2);
-    --color-shadow-extra-large: 0 12px 28px rgba(136,146,157,0.3);
-    --color-neutral-emphasis-plus: #0e1116;
-    --color-neutral-emphasis: #66707b;
-    --color-neutral-muted: rgba(172,182,192,0.2);
+    --color-shadow-small: var(--shadow-resting-small, var(--color-shadow-small, 0 1px 0 rgba(1,4,9,0.04)));
+    --color-shadow-medium: var(--shadow-resting-medium, var(--color-shadow-medium, 0 3px 6px rgba(136,146,157,0.15)));
+    --color-shadow-large: var(--shadow-floating-large, var(--color-shadow-large, 0 8px 24px rgba(136,146,157,0.2)));
+    --color-shadow-extra-large: var(--shadow-floating-xlarge, var(--color-shadow-extra-large, 0 12px 28px rgba(136,146,157,0.3)));
+    --color-neutral-emphasis-plus: var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #0e1116));
+    --color-neutral-emphasis: var(undefined, var(--color-neutral-emphasis, #66707b));
+    --color-neutral-muted: var(--bgColor-disabled, var(--color-neutral-muted, rgba(172,182,192,0.2)));
     --color-neutral-subtle: #e7ecf0;
-    --color-accent-fg: #0349b4;
-    --color-accent-emphasis: #0349b4;
+    --color-accent-fg: var(--focus-outlineColor, var(--color-accent-fg, #0349b4));
+    --color-accent-emphasis: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4));
     --color-accent-muted: #368cf9;
-    --color-accent-subtle: #dff7ff;
-    --color-success-fg: #055d20;
+    --color-accent-subtle: var(--bgColor-accent-muted, var(--color-accent-subtle, #dff7ff));
+    --color-success-fg: var(--fgColor-success, var(--color-success-fg, #055d20));
     --color-success-emphasis: #055d20;
     --color-success-muted: #26a148;
-    --color-success-subtle: #d2fedb;
-    --color-attention-fg: #744500;
+    --color-success-subtle: var(--bgColor-success-muted, var(--color-success-subtle, #d2fedb));
+    --color-attention-fg: var(--fgColor-attention, var(--color-attention-fg, #744500));
     --color-attention-emphasis: #744500;
     --color-attention-muted: #b58407;
-    --color-attention-subtle: #fcf7be;
-    --color-severe-fg: #873800;
-    --color-severe-emphasis: #873800;
+    --color-attention-subtle: var(--bgColor-attention-muted, var(--color-attention-subtle, #fcf7be));
+    --color-severe-fg: var(--fgColor-severe, var(--color-severe-fg, #873800));
+    --color-severe-emphasis: var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #873800));
     --color-severe-muted: #dc6d1a;
-    --color-severe-subtle: #fff2d5;
-    --color-danger-fg: #d1242f;
-    --color-danger-emphasis: #a0111f;
+    --color-severe-subtle: var(--bgColor-severe-muted, var(--color-severe-subtle, #fff2d5));
+    --color-danger-fg: var(--control-danger-fgColor-rest, var(--color-danger-fg, #d1242f));
+    --color-danger-emphasis: var(--control-borderColor-danger, var(--color-danger-emphasis, #a0111f));
     --color-danger-muted: #ee5a5d;
-    --color-danger-subtle: #fff0ee;
-    --color-open-fg: #055d20;
-    --color-open-emphasis: #055d20;
-    --color-open-muted: rgba(38,161,72,0.4);
-    --color-open-subtle: #d2fedb;
-    --color-closed-fg: #d1242f;
-    --color-closed-emphasis: #a0111f;
-    --color-closed-muted: rgba(238,90,93,0.4);
-    --color-closed-subtle: #fff0ee;
-    --color-done-fg: #622cbc;
-    --color-done-emphasis: #622cbc;
+    --color-danger-subtle: var(--bgColor-danger-muted, var(--color-danger-subtle, #fff0ee));
+    --color-open-fg: var(--fgColor-open, var(--color-open-fg, #055d20));
+    --color-open-emphasis: var(--bgColor-open-emphasis, var(--color-open-emphasis, (obj) => (0, get_1.default)(obj, path)));
+    --color-open-muted: var(--borderColor-open-muted, var(--color-open-muted, rgba(38,161,72,0.4)));
+    --color-open-subtle: var(--bgColor-open-muted, var(--color-open-subtle, #d2fedb));
+    --color-closed-fg: var(--fgColor-closed, var(--color-closed-fg, var(--control-danger-fgColor-rest, var(--color-danger-fg, #d1242f))));
+    --color-closed-emphasis: var(--bgColor-closed-emphasis, var(--color-closed-emphasis, #a0111f));
+    --color-closed-muted: var(--borderColor-closed-muted, var(--color-closed-muted, rgba(238,90,93,0.4)));
+    --color-closed-subtle: var(--bgColor-closed-muted, var(--color-closed-subtle, #fff0ee));
+    --color-done-fg: var(--fgColor-done, var(--color-done-fg, #622cbc));
+    --color-done-emphasis: var(--bgColor-done-emphasis, var(--color-done-emphasis, #622cbc));
     --color-done-muted: #a371f7;
-    --color-done-subtle: #faf0fe;
-    --color-sponsors-fg: #971368;
-    --color-sponsors-emphasis: #971368;
+    --color-done-subtle: var(--bgColor-done-muted, var(--color-done-subtle, #faf0fe));
+    --color-sponsors-fg: var(--fgColor-sponsors, var(--color-sponsors-fg, #971368));
+    --color-sponsors-emphasis: var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #971368));
     --color-sponsors-muted: #ed4baf;
-    --color-sponsors-subtle: #feeff7;
-    --color-primer-fg-disabled: #88929d;
-    --color-primer-canvas-backdrop: rgba(1,4,9,0.5);
-    --color-primer-canvas-sticky: rgba(255,255,255,0.95);
-    --color-primer-border-active: #ef5b48;
-    --color-primer-border-contrast: rgba(1,4,9,0.1);
-    --color-primer-shadow-highlight: inset 0 1px 0 rgba(255,255,255,0.25);
-    --color-primer-shadow-inset: inset 0 1px 0 rgba(206,213,220,0.2);
+    --color-sponsors-subtle: var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, #feeff7));
+    --color-primer-fg-disabled: var(undefined, var(--color-fg-disabled, #88929d));
+    --color-primer-canvas-backdrop: var(undefined, var(--color-canvas-backdrop, rgba(1,4,9,0.5)));
+    --color-primer-canvas-sticky: var(undefined, var(--color-canvas-sticky, rgba(255,255,255,0.95)));
+    --color-primer-border-active: var(undefined, var(--color-border-active, #ef5b48));
+    --color-primer-border-contrast: var(undefined, var(--color-border-contrast, rgba(1,4,9,0.1)));
+    --color-primer-shadow-highlight: var(undefined, var(--color-shadow-highlight, inset 0 1px 0 rgba(255,255,255,0.25)));
+    --color-primer-shadow-inset: var(undefined, var(--color-shadow-inset, inset 0 1px 0 rgba(206,213,220,0.2)));
     --color-scale-black: #010409;
--- base/dist/scss/colors/_light_tritanopia.scss	2023-11-29 21:15:20.352040772 +0000
+++ dist/scss/colors/_light_tritanopia.scss	2023-11-29 21:15:07.116044879 +0000
@@ -2,4 +2,4 @@
   & {
-    --color-canvas-default-transparent: rgba(255,255,255,0);
-    --color-page-header-bg: #f6f8fa;
+    --color-canvas-default-transparent: var(--bgColor-default, var(--color-canvas-default, rgba(255,255,255,0)));
+    --color-page-header-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-marketing-icon-primary: #218bff;
@@ -8,15 +8,15 @@
     --color-diff-blob-addition-fg: #24292f;
-    --color-diff-blob-addition-num-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-addition-num-bg: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-addition-line-bg: rgba(221,244,255,0.5);
-    --color-diff-blob-addition-word-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-addition-word-bg: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-deletion-num-text: #24292f;
     --color-diff-blob-deletion-fg: #24292f;
-    --color-diff-blob-deletion-num-bg: rgba(255,129,130,0.4);
+    --color-diff-blob-deletion-num-bg: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(255,129,130,0.4)));
     --color-diff-blob-deletion-line-bg: rgba(255,235,233,0.5);
     --color-diff-blob-deletion-word-bg: rgba(255,171,168,0.5);
-    --color-diff-blob-hunk-num-bg: rgba(84,174,255,0.4);
+    --color-diff-blob-hunk-num-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
     --color-diff-blob-expander-icon: #57606a;
     --color-diff-blob-selected-line-highlight-mix-blend-mode: multiply;
-    --color-diffstat-deletion-border: rgba(27,31,36,0.15);
-    --color-diffstat-addition-border: rgba(27,31,36,0.15);
+    --color-diffstat-deletion-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
+    --color-diffstat-addition-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-diffstat-addition-bg: #0969da;
@@ -54,12 +54,12 @@
     --color-codemirror-text: #24292f;
-    --color-codemirror-bg: #ffffff;
-    --color-codemirror-gutters-bg: #ffffff;
-    --color-codemirror-guttermarker-text: #ffffff;
-    --color-codemirror-guttermarker-subtle-text: #6e7781;
+    --color-codemirror-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-gutters-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-text: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-codemirror-guttermarker-subtle-text: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
     --color-codemirror-linenumber-text: #57606a;
     --color-codemirror-cursor: #24292f;
-    --color-codemirror-selection-bg: rgba(84,174,255,0.4);
-    --color-codemirror-activeline-bg: rgba(234,238,242,0.5);
+    --color-codemirror-selection-bg: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-codemirror-activeline-bg: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
     --color-codemirror-matchingbracket-text: #24292f;
-    --color-codemirror-lines-bg: #ffffff;
+    --color-codemirror-lines-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-codemirror-syntax-comment: #24292f;
@@ -156,3 +156,3 @@
     --color-avatar-bg: #ffffff;
-    --color-avatar-border: rgba(27,31,36,0.15);
+    --color-avatar-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-avatar-stack-fade: #afb8c1;
@@ -175,3 +175,3 @@
     --color-menu-bg-active: rgba(0,0,0,0);
-    --color-input-disabled-bg: rgba(175,184,193,0.2);
+    --color-input-disabled-bg: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
     --color-timeline-badge-bg: #eaeef2;
@@ -196,3 +196,3 @@
     --color-btn-bg: #f6f8fa;
-    --color-btn-border: rgba(27,31,36,0.15);
+    --color-btn-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-shadow: 0 1px 0 rgba(27,31,36,0.04);
@@ -200,5 +200,5 @@
     --color-btn-hover-bg: #f3f4f6;
-    --color-btn-hover-border: rgba(27,31,36,0.15);
+    --color-btn-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-active-bg: hsla(220,14%,93%,1);
-    --color-btn-active-border: rgba(27,31,36,0.15);
+    --color-btn-active-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-selected-bg: hsla(220,14%,94%,1);
@@ -207,3 +207,3 @@
     --color-btn-primary-bg: #0969da;
-    --color-btn-primary-border: rgba(27,31,36,0.15);
+    --color-btn-primary-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -211,3 +211,3 @@
     --color-btn-primary-hover-bg: #0969da;
-    --color-btn-primary-hover-border: rgba(27,31,36,0.15);
+    --color-btn-primary-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-selected-bg: hsla(212,92%,43%,1);
@@ -216,3 +216,3 @@
     --color-btn-primary-disabled-bg: #80ccff;
-    --color-btn-primary-disabled-border: rgba(27,31,36,0.15);
+    --color-btn-primary-disabled-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-primary-icon: rgba(255,255,255,0.8);
@@ -222,3 +222,3 @@
     --color-btn-outline-hover-bg: #0969da;
-    --color-btn-outline-hover-border: rgba(27,31,36,0.15);
+    --color-btn-outline-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-outline-hover-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -228,3 +228,3 @@
     --color-btn-outline-selected-bg: hsla(212,92%,42%,1);
-    --color-btn-outline-selected-border: rgba(27,31,36,0.15);
+    --color-btn-outline-selected-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-outline-selected-shadow: inset 0 1px 0 rgba(0,33,85,0.2);
@@ -240,3 +240,3 @@
     --color-btn-danger-hover-bg: #a40e26;
-    --color-btn-danger-hover-border: rgba(27,31,36,0.15);
+    --color-btn-danger-hover-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-danger-hover-shadow: 0 1px 0 rgba(27,31,36,0.1);
@@ -246,3 +246,3 @@
     --color-btn-danger-selected-bg: hsla(356,72%,44%,1);
-    --color-btn-danger-selected-border: rgba(27,31,36,0.15);
+    --color-btn-danger-selected-border: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
     --color-btn-danger-selected-shadow: inset 0 1px 0 rgba(76,0,20,0.2);
@@ -259,5 +259,5 @@
     --color-btn-inactive-text: #57606a;
-    --color-underlinenav-icon: #6e7781;
-    --color-underlinenav-border-hover: rgba(175,184,193,0.2);
-    --color-action-list-item-inline-divider: rgba(208,215,222,0.48);
+    --color-underlinenav-icon: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-underlinenav-border-hover: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-action-list-item-inline-divider: var(--borderColor-default, var(--color-border-default, rgba(208,215,222,0.48)));
     --color-action-list-item-default-hover-bg: rgba(208,215,222,0.32);
@@ -267,4 +267,4 @@
     --color-action-list-item-default-selected-bg: rgba(208,215,222,0.24);
-    --color-action-list-item-danger-hover-bg: rgba(255,235,233,0.64);
-    --color-action-list-item-danger-active-bg: #ffebe9;
+    --color-action-list-item-danger-hover-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(255,235,233,0.64)));
+    --color-action-list-item-danger-active-bg: var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9));
     --color-action-list-item-danger-hover-text: #cf222e;
@@ -275,18 +275,18 @@
     --color-switch-track-fg: #57606a;
-    --color-switch-track-disabled-fg: #ffffff;
+    --color-switch-track-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-border: rgba(0,0,0,0);
-    --color-switch-track-checked-bg: #0969da;
+    --color-switch-track-checked-bg: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-switch-track-checked-hover-bg: #0860CA;
     --color-switch-track-checked-active-bg: #0757BA;
-    --color-switch-track-checked-fg: #ffffff;
-    --color-switch-track-checked-disabled-fg: #ffffff;
+    --color-switch-track-checked-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-switch-track-checked-disabled-fg: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
     --color-switch-track-checked-border: rgba(0,0,0,0);
-    --color-switch-knob-bg: #ffffff;
-    --color-switch-knob-disabled-bg: #f6f8fa;
+    --color-switch-knob-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
     --color-switch-knob-border: #858F99;
-    --color-switch-knob-checked-bg: #ffffff;
-    --color-switch-knob-checked-disabled-bg: #f6f8fa;
-    --color-switch-knob-checked-border: #0969da;
+    --color-switch-knob-checked-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-switch-knob-checked-disabled-bg: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-switch-knob-checked-border: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
     --color-segmented-control-bg: #eaeef2;
-    --color-segmented-control-button-bg: #ffffff;
+    --color-segmented-control-button-bg: var(--bgColor-default, var(--color-canvas-default, #ffffff));
     --color-segmented-control-button-hover-bg: rgba(175,184,193,0.2);
@@ -298,39 +298,39 @@
     --color-fg-muted: #57606a;
-    --color-fg-subtle: #6e7781;
-    --color-fg-on-emphasis: #ffffff;
-    --color-canvas-default: #ffffff;
-    --color-canvas-overlay: #ffffff;
-    --color-canvas-inset: #f6f8fa;
-    --color-canvas-subtle: #f6f8fa;
-    --color-border-default: #d0d7de;
-    --color-border-muted: hsla(210,18%,87%,1);
-    --color-border-subtle: rgba(27,31,36,0.15);
-    --color-shadow-small: 0 1px 0 rgba(27,31,36,0.04);
-    --color-shadow-medium: 0 3px 6px rgba(140,149,159,0.15);
-    --color-shadow-large: 0 8px 24px rgba(140,149,159,0.2);
-    --color-shadow-extra-large: 0 12px 28px rgba(140,149,159,0.3);
-    --color-neutral-emphasis-plus: #24292f;
-    --color-neutral-emphasis: #6e7781;
-    --color-neutral-muted: rgba(175,184,193,0.2);
-    --color-neutral-subtle: rgba(234,238,242,0.5);
-    --color-accent-fg: #0969da;
-    --color-accent-emphasis: #0969da;
-    --color-accent-muted: rgba(84,174,255,0.4);
-    --color-accent-subtle: #ddf4ff;
-    --color-success-fg: #0969da;
+    --color-fg-subtle: var(--control-fgColor-placeholder, var(--color-fg-subtle, #6e7781));
+    --color-fg-on-emphasis: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff));
+    --color-canvas-default: var(--bgColor-default, var(--color-canvas-default, #ffffff));
+    --color-canvas-overlay: var(--overlay-bgColor, var(--color-canvas-overlay, #ffffff));
+    --color-canvas-inset: var(--bgColor-inset, var(--color-canvas-inset, #f6f8fa));
+    --color-canvas-subtle: var(--bgColor-muted, var(--color-canvas-subtle, #f6f8fa));
+    --color-border-default: var(--borderColor-default, var(--color-border-default, #d0d7de));
+    --color-border-muted: var(--borderColor-muted, var(--color-border-muted, hsla(210,18%,87%,1)));
+    --color-border-subtle: var(undefined, var(--color-border-subtle, rgba(27,31,36,0.15)));
+    --color-shadow-small: var(--shadow-resting-small, var(--color-shadow-small, 0 1px 0 rgba(27,31,36,0.04)));
+    --color-shadow-medium: var(--shadow-resting-medium, var(--color-shadow-medium, 0 3px 6px rgba(140,149,159,0.15)));
+    --color-shadow-large: var(--shadow-floating-large, var(--color-shadow-large, 0 8px 24px rgba(140,149,159,0.2)));
+    --color-shadow-extra-large: var(--shadow-floating-xlarge, var(--color-shadow-extra-large, 0 12px 28px rgba(140,149,159,0.3)));
+    --color-neutral-emphasis-plus: var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #24292f));
+    --color-neutral-emphasis: var(undefined, var(--color-neutral-emphasis, #6e7781));
+    --color-neutral-muted: var(--bgColor-disabled, var(--color-neutral-muted, rgba(175,184,193,0.2)));
+    --color-neutral-subtle: var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(234,238,242,0.5)));
+    --color-accent-fg: var(--focus-outlineColor, var(--color-accent-fg, #0969da));
+    --color-accent-emphasis: var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0969da));
+    --color-accent-muted: var(--borderColor-accent-muted, var(--color-accent-muted, rgba(84,174,255,0.4)));
+    --color-accent-subtle: var(--bgColor-accent-muted, var(--color-accent-subtle, #ddf4ff));
+    --color-success-fg: var(--fgColor-success, var(--color-success-fg, #0969da));
     --color-success-emphasis: #0969da;
-    --color-success-muted: rgba(84,174,255,0.4);
-    --color-success-subtle: #ddf4ff;
-    --color-attention-fg: #9a6700;
-    --color-attention-emphasis: #9a6700;
-    --color-attention-muted: rgba(212,167,44,0.4);
-    --color-attention-subtle: #fff8c5;
-    --color-severe-fg: #cf222e;
-    --color-severe-emphasis: #cf222e;
-    --color-severe-muted: rgba(255,129,130,0.4);
-    --color-severe-subtle: #ffebe9;
+    --color-success-muted: var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)));
+    --color-success-subtle: var(--bgColor-success-muted, var(--color-success-subtle, #ddf4ff));
+    --color-attention-fg: var(--fgColor-attention, var(--color-attention-fg, #9a6700));
+    --color-attention-emphasis: var(--control-borderColor-warning, var(--color-attention-emphasis, #9a6700));
+    --color-attention-muted: var(--borderColor-attention-muted, var(--color-attention-muted, rgba(212,167,44,0.4)));
+    --color-attention-subtle: var(--bgColor-attention-muted, var(--color-attention-subtle, #fff8c5));
+    --color-severe-fg: var(--fgColor-severe, var(--color-severe-fg, #cf222e));
+    --color-severe-emphasis: var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #cf222e));
+    --color-severe-muted: var(--borderColor-severe-muted, var(--color-severe-muted, rgba(255,129,130,0.4)));
+    --color-severe-subtle: var(--bgColor-severe-muted, var(--color-severe-subtle, #ffebe9));
     --color-danger-fg: #cf222e;
-    --color-danger-emphasis: #cf222e;
-    --color-danger-muted: rgba(255,129,130,0.4);
-    --color-danger-subtle: #ffebe9;
+    --color-danger-emphasis: var(--control-borderColor-danger, var(--color-danger-emphasis, #cf222e));
+    --color-danger-muted: var(--borderColor-danger-muted, var(--color-danger-muted, rgba(255,129,130,0.4)));
+    --color-danger-subtle: var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9));
     --color-open-fg: #cf222e;
@@ -343,17 +343,17 @@
     --color-closed-subtle: #f6f8fa;
-    --color-done-fg: #8250df;
-    --color-done-emphasis: #8250df;
-    --color-done-muted: rgba(194,151,255,0.4);
-    --color-done-subtle: #fbefff;
-    --color-sponsors-fg: #bf3989;
-    --color-sponsors-emphasis: #bf3989;
-    --color-sponsors-muted: rgba(255,128,200,0.4);
-    --color-sponsors-subtle: #ffeff7;
-    --color-primer-fg-disabled: #8c959f;
-    --color-primer-canvas-backdrop: rgba(27,31,36,0.5);
-    --color-primer-canvas-sticky: rgba(255,255,255,0.95);
-    --color-primer-border-active: #fd8c73;
-    --color-primer-border-contrast: rgba(27,31,36,0.1);
-    --color-primer-shadow-highlight: inset 0 1px 0 rgba(255,255,255,0.25);
-    --color-primer-shadow-inset: inset 0 1px 0 rgba(208,215,222,0.2);
+    --color-done-fg: var(--fgColor-done, var(--color-done-fg, #8250df));
+    --color-done-emphasis: var(--bgColor-done-emphasis, var(--color-done-emphasis, #8250df));
+    --color-done-muted: var(--borderColor-done-muted, var(--color-done-muted, rgba(194,151,255,0.4)));
+    --color-done-subtle: var(--bgColor-done-muted, var(--color-done-subtle, #fbefff));
+    --color-sponsors-fg: var(--fgColor-sponsors, var(--color-sponsors-fg, #bf3989));
+    --color-sponsors-emphasis: var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #bf3989));
+    --color-sponsors-muted: var(--borderColor-sponsors-muted, var(--color-sponsors-muted, rgba(255,128,200,0.4)));
+    --color-sponsors-subtle: var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, #ffeff7));
+    --color-primer-fg-disabled: var(undefined, var(--color-fg-disabled, #8c959f));
+    --color-primer-canvas-backdrop: var(undefined, var(--color-canvas-backdrop, rgba(27,31,36,0.5)));
+    --color-primer-canvas-sticky: var(undefined, var(--color-canvas-sticky, rgba(255,255,255,0.95)));
+    --color-primer-border-active: var(undefined, var(--color-border-active, #fd8c73));
+    --color-primer-border-contrast: var(undefined, var(--color-border-contrast, rgba(27,31,36,0.1)));
+    --color-primer-shadow-highlight: var(undefined, var(--color-shadow-highlight, inset 0 1px 0 rgba(255,255,255,0.25)));
+    --color-primer-shadow-inset: var(undefined, var(--color-shadow-inset, inset 0 1px 0 rgba(208,215,222,0.2)));
     --color-scale-black: #1b1f24;

@github-actions github-actions bot temporarily deployed to storybook-preview November 28, 2023 18:22 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 15:37 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 16:25 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 16:26 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 20:52 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 21:16 Inactive
@siddharthkp siddharthkp changed the base branch from main to tmp-dist-for-comparison November 29, 2023 21:55
@github-actions github-actions bot temporarily deployed to storybook-preview November 29, 2023 21:56 Inactive
@siddharthkp siddharthkp changed the base branch from tmp-dist-for-comparison to main December 1, 2023 16:13
@siddharthkp siddharthkp changed the base branch from main to tmp-dist-for-comparison December 1, 2023 16:13
@siddharthkp siddharthkp deleted the branch tmp-dist-for-comparison December 1, 2023 16:31
@siddharthkp siddharthkp closed this Dec 1, 2023
@github-actions github-actions bot temporarily deployed to storybook-preview December 1, 2023 16:34 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
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 @siddharthkp