@primer/primitives 11.7.0 → 11.7.1-rc.ef267e0e

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/dist/build/platforms/css.js +22 -4
  2. package/dist/build/transformers/figmaAttributes.js +6 -4
  3. package/dist/css/functional/themes/dark-colorblind-high-contrast.css +54 -54
  4. package/dist/css/functional/themes/dark-colorblind.css +54 -54
  5. package/dist/css/functional/themes/dark-dimmed-high-contrast.css +54 -54
  6. package/dist/css/functional/themes/dark-dimmed.css +54 -54
  7. package/dist/css/functional/themes/dark-high-contrast.css +54 -54
  8. package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +54 -54
  9. package/dist/css/functional/themes/dark-tritanopia.css +54 -54
  10. package/dist/css/functional/themes/dark.css +54 -54
  11. package/dist/css/functional/themes/light-colorblind-high-contrast.css +54 -54
  12. package/dist/css/functional/themes/light-colorblind.css +54 -54
  13. package/dist/css/functional/themes/light-high-contrast.css +54 -54
  14. package/dist/css/functional/themes/light-tritanopia-high-contrast.css +54 -54
  15. package/dist/css/functional/themes/light-tritanopia.css +54 -54
  16. package/dist/css/functional/themes/light.css +54 -54
  17. package/dist/figma/figma.json +6 -6
  18. package/dist/figma/scales/dark-dimmed.json +629 -629
  19. package/dist/figma/scales/dark-high-constrast.json +628 -628
  20. package/dist/figma/scales/light-high-constrast.json +626 -626
  21. package/dist/internalCss/dark-colorblind-high-contrast.css +54 -54
  22. package/dist/internalCss/dark-colorblind.css +54 -54
  23. package/dist/internalCss/dark-dimmed-high-contrast.css +54 -54
  24. package/dist/internalCss/dark-dimmed.css +54 -54
  25. package/dist/internalCss/dark-high-contrast.css +54 -54
  26. package/dist/internalCss/dark-tritanopia-high-contrast.css +54 -54
  27. package/dist/internalCss/dark-tritanopia.css +54 -54
  28. package/dist/internalCss/dark.css +54 -54
  29. package/dist/internalCss/light-colorblind-high-contrast.css +54 -54
  30. package/dist/internalCss/light-colorblind.css +54 -54
  31. package/dist/internalCss/light-high-contrast.css +54 -54
  32. package/dist/internalCss/light-tritanopia-high-contrast.css +54 -54
  33. package/dist/internalCss/light-tritanopia.css +54 -54
  34. package/dist/internalCss/light.css +54 -54
  35. package/package.json +15 -14
package/dist/internalCss/dark-tritanopia.css CHANGED
@@ -963,24 +963,24 @@
963
963
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
964
964
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
965
965
  --bgColor-white: var(--base-color-neutral-13); /** Pure white background */
966
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
967
- --border-accent-muted: 0.0625rem solid #388bfd66;
968
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
969
- --border-attention-muted: 0.0625rem solid #bb800966;
970
- --border-danger-emphasis: 0.0625rem solid #da3633;
971
- --border-danger-muted: 0.0625rem solid #f8514966;
972
- --border-default: 0.0625rem solid #3d444d;
973
- --border-disabled: 0.0625rem solid #656c761a;
974
- --border-done-emphasis: 0.0625rem solid #8957e5;
975
- --border-done-muted: 0.0625rem solid #ab7df866;
976
- --border-emphasis: 0.0625rem solid #656c76;
977
- --border-severe-emphasis: 0.0625rem solid #da3633;
978
- --border-severe-muted: 0.0625rem solid #f8514966;
979
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
980
- --border-sponsors-muted: 0.0625rem solid #db61a266;
981
- --border-success-emphasis: 0.0625rem solid #1f6feb;
982
- --border-success-muted: 0.0625rem solid #388bfd66;
983
- --border-transparent: 0.0625rem solid #00000000;
966
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
967
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
968
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
969
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
970
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
971
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
972
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
973
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
974
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
975
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
976
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
977
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
978
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
979
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
980
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
981
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
982
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
983
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
984
984
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
985
985
  --borderColor-closed-muted: #3d444d66; /** Subtle border for closed state indicators */
986
986
  --borderColor-draft-muted: #3d444d66; /** Subtle border for draft state indicators */
@@ -1121,14 +1121,14 @@
1121
1121
  --avatar-borderColor: var(--borderColor-translucent);
1122
1122
  --border-closed-emphasis: var(--border-danger-emphasis);
1123
1123
  --border-closed-muted: var(--border-danger-muted);
1124
- --border-draft-muted: 0.0625rem solid #3d444d66;
1125
- --border-muted: 0.0625rem solid #3d444db3;
1126
- --border-neutral-emphasis: 0.0625rem solid #656c76;
1124
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1125
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1126
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
1127
1127
  --border-open-emphasis: var(--border-success-emphasis);
1128
1128
  --border-open-muted: var(--border-success-muted);
1129
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1130
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
1131
- --border-upsell-muted: 0.0625rem solid #ab7df866;
1129
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1130
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1131
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1132
1132
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1133
1133
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1134
1134
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1171,12 +1171,12 @@
1171
1171
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
1172
1172
  --dashboard-bgColor: var(--bgColor-inset);
1173
1173
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
1174
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
1174
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1175
1175
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1176
1176
  --overlay-borderColor: var(--borderColor-muted);
1177
1177
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1178
- --border-draft-emphasis: 0.0625rem solid #656c76;
1179
- --border-neutral-muted: 0.0625rem solid #3d444db3;
1178
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1179
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1180
1180
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
1181
1181
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
1182
1182
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
@@ -2159,24 +2159,24 @@
2159
2159
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2160
2160
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2161
2161
  --bgColor-white: var(--base-color-neutral-13); /** Pure white background */
2162
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
2163
- --border-accent-muted: 0.0625rem solid #388bfd66;
2164
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
2165
- --border-attention-muted: 0.0625rem solid #bb800966;
2166
- --border-danger-emphasis: 0.0625rem solid #da3633;
2167
- --border-danger-muted: 0.0625rem solid #f8514966;
2168
- --border-default: 0.0625rem solid #3d444d;
2169
- --border-disabled: 0.0625rem solid #656c761a;
2170
- --border-done-emphasis: 0.0625rem solid #8957e5;
2171
- --border-done-muted: 0.0625rem solid #ab7df866;
2172
- --border-emphasis: 0.0625rem solid #656c76;
2173
- --border-severe-emphasis: 0.0625rem solid #da3633;
2174
- --border-severe-muted: 0.0625rem solid #f8514966;
2175
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
2176
- --border-sponsors-muted: 0.0625rem solid #db61a266;
2177
- --border-success-emphasis: 0.0625rem solid #1f6feb;
2178
- --border-success-muted: 0.0625rem solid #388bfd66;
2179
- --border-transparent: 0.0625rem solid #00000000;
2162
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2163
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2164
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2165
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2166
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2167
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2168
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2169
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2170
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2171
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2172
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2173
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2174
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2175
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2176
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2177
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2178
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2179
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2180
2180
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
2181
2181
  --borderColor-closed-muted: #3d444d66; /** Subtle border for closed state indicators */
2182
2182
  --borderColor-draft-muted: #3d444d66; /** Subtle border for draft state indicators */
@@ -2317,14 +2317,14 @@
2317
2317
  --avatar-borderColor: var(--borderColor-translucent);
2318
2318
  --border-closed-emphasis: var(--border-danger-emphasis);
2319
2319
  --border-closed-muted: var(--border-danger-muted);
2320
- --border-draft-muted: 0.0625rem solid #3d444d66;
2321
- --border-muted: 0.0625rem solid #3d444db3;
2322
- --border-neutral-emphasis: 0.0625rem solid #656c76;
2320
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2321
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2322
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2323
2323
  --border-open-emphasis: var(--border-success-emphasis);
2324
2324
  --border-open-muted: var(--border-success-muted);
2325
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2326
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
2327
- --border-upsell-muted: 0.0625rem solid #ab7df866;
2325
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2326
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2327
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2328
2328
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
2329
2329
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2330
2330
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -2367,12 +2367,12 @@
2367
2367
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
2368
2368
  --dashboard-bgColor: var(--bgColor-inset);
2369
2369
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
2370
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
2370
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2371
2371
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2372
2372
  --overlay-borderColor: var(--borderColor-muted);
2373
2373
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2374
- --border-draft-emphasis: 0.0625rem solid #656c76;
2375
- --border-neutral-muted: 0.0625rem solid #3d444db3;
2374
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2375
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2376
2376
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
2377
2377
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
2378
2378
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
package/dist/internalCss/dark.css CHANGED
@@ -956,24 +956,24 @@
956
956
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
957
957
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
958
958
  --bgColor-white: var(--base-color-neutral-13); /** Pure white background */
959
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
960
- --border-accent-muted: 0.0625rem solid #388bfd66;
961
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
962
- --border-attention-muted: 0.0625rem solid #bb800966;
963
- --border-danger-emphasis: 0.0625rem solid #da3633;
964
- --border-danger-muted: 0.0625rem solid #f8514966;
965
- --border-default: 0.0625rem solid #3d444d;
966
- --border-disabled: 0.0625rem solid #656c761a;
967
- --border-done-emphasis: 0.0625rem solid #8957e5;
968
- --border-done-muted: 0.0625rem solid #ab7df866;
969
- --border-emphasis: 0.0625rem solid #656c76;
970
- --border-severe-emphasis: 0.0625rem solid #bd561d;
971
- --border-severe-muted: 0.0625rem solid #db6d2866;
972
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
973
- --border-sponsors-muted: 0.0625rem solid #db61a266;
974
- --border-success-emphasis: 0.0625rem solid #238636;
975
- --border-success-muted: 0.0625rem solid #2ea04366;
976
- --border-transparent: 0.0625rem solid #00000000;
959
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
960
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
961
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
962
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
963
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
964
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
965
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
966
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
967
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
968
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
969
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
970
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
971
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
972
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
973
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
974
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
975
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
976
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
977
977
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
978
978
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
979
979
  --borderColor-muted: #3d444db3; /** Subtle border for secondary elements and light separators */
@@ -1119,13 +1119,13 @@
1119
1119
  --avatar-borderColor: var(--borderColor-translucent);
1120
1120
  --border-closed-emphasis: var(--border-danger-emphasis);
1121
1121
  --border-closed-muted: var(--border-danger-muted);
1122
- --border-muted: 0.0625rem solid #3d444db3;
1123
- --border-neutral-emphasis: 0.0625rem solid #656c76;
1122
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1123
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
1124
1124
  --border-open-emphasis: var(--border-success-emphasis);
1125
1125
  --border-open-muted: var(--border-success-muted);
1126
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1127
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
1128
- --border-upsell-muted: 0.0625rem solid #ab7df866;
1126
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
1127
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1128
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1129
1129
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
1130
1130
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1131
1131
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1169,12 +1169,12 @@
1169
1169
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
1170
1170
  --dashboard-bgColor: var(--bgColor-inset);
1171
1171
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
1172
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
1172
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1173
1173
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1174
1174
  --overlay-borderColor: var(--borderColor-muted);
1175
1175
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1176
- --border-draft-emphasis: 0.0625rem solid #656c76;
1177
- --border-neutral-muted: 0.0625rem solid #3d444db3;
1176
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1177
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1178
1178
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
1179
1179
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
1180
1180
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
@@ -1189,7 +1189,7 @@
1189
1189
  --shadow-floating-small: 0 0 0 1px #3d444d, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
1190
1190
  --shadow-floating-xlarge: 0 0 0 1px #3d444d, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
1191
1191
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
1192
- --border-draft-muted: 0.0625rem solid #3d444db3;
1192
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1193
1193
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
1194
1194
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
1195
1195
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
@@ -2152,24 +2152,24 @@
2152
2152
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2153
2153
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2154
2154
  --bgColor-white: var(--base-color-neutral-13); /** Pure white background */
2155
- --border-accent-emphasis: 0.0625rem solid #1f6feb;
2156
- --border-accent-muted: 0.0625rem solid #388bfd66;
2157
- --border-attention-emphasis: 0.0625rem solid #9e6a03;
2158
- --border-attention-muted: 0.0625rem solid #bb800966;
2159
- --border-danger-emphasis: 0.0625rem solid #da3633;
2160
- --border-danger-muted: 0.0625rem solid #f8514966;
2161
- --border-default: 0.0625rem solid #3d444d;
2162
- --border-disabled: 0.0625rem solid #656c761a;
2163
- --border-done-emphasis: 0.0625rem solid #8957e5;
2164
- --border-done-muted: 0.0625rem solid #ab7df866;
2165
- --border-emphasis: 0.0625rem solid #656c76;
2166
- --border-severe-emphasis: 0.0625rem solid #bd561d;
2167
- --border-severe-muted: 0.0625rem solid #db6d2866;
2168
- --border-sponsors-emphasis: 0.0625rem solid #bf4b8a;
2169
- --border-sponsors-muted: 0.0625rem solid #db61a266;
2170
- --border-success-emphasis: 0.0625rem solid #238636;
2171
- --border-success-muted: 0.0625rem solid #2ea04366;
2172
- --border-transparent: 0.0625rem solid #00000000;
2155
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2156
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2157
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2158
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2159
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2160
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2161
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2162
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2163
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2164
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2165
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2166
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2167
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2168
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2169
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2170
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2171
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2172
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2173
2173
  --borderColor-closed-emphasis: var(--borderColor-danger-emphasis); /** Strong border for closed state badges */
2174
2174
  --borderColor-closed-muted: var(--borderColor-danger-muted); /** Subtle border for closed state indicators */
2175
2175
  --borderColor-muted: #3d444db3; /** Subtle border for secondary elements and light separators */
@@ -2315,13 +2315,13 @@
2315
2315
  --avatar-borderColor: var(--borderColor-translucent);
2316
2316
  --border-closed-emphasis: var(--border-danger-emphasis);
2317
2317
  --border-closed-muted: var(--border-danger-muted);
2318
- --border-muted: 0.0625rem solid #3d444db3;
2319
- --border-neutral-emphasis: 0.0625rem solid #656c76;
2318
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2319
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2320
2320
  --border-open-emphasis: var(--border-success-emphasis);
2321
2321
  --border-open-muted: var(--border-success-muted);
2322
- --border-translucent: 0.0625rem solid #ffffff26; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2323
- --border-upsell-emphasis: 0.0625rem solid #8957e5;
2324
- --border-upsell-muted: 0.0625rem solid #ab7df866;
2322
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2323
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2324
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2325
2325
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
2326
2326
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2327
2327
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -2365,12 +2365,12 @@
2365
2365
  --controlTrack-fgColor-disabled: var(--fgColor-onEmphasis);
2366
2366
  --dashboard-bgColor: var(--bgColor-inset);
2367
2367
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-onEmphasis);
2368
- --focus-outline: 0.125rem solid #1f6feb; /** Focus ring outline for keyboard navigation and accessibility. */
2368
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2369
2369
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2370
2370
  --overlay-borderColor: var(--borderColor-muted);
2371
2371
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2372
- --border-draft-emphasis: 0.0625rem solid #656c76;
2373
- --border-neutral-muted: 0.0625rem solid #3d444db3;
2372
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2373
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2374
2374
  --borderColor-draft-muted: var(--borderColor-neutral-muted); /** Subtle border for draft state indicators */
2375
2375
  --button-danger-borderColor-hover: var(--button-primary-borderColor-rest);
2376
2376
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
@@ -2385,7 +2385,7 @@
2385
2385
  --shadow-floating-small: 0 0 0 1px #3d444d, 0 6px 12px -3px #01040966, 0 6px 18px 0 #01040966; /** Small floating shadow for dropdowns, tooltips, and small overlays */
2386
2386
  --shadow-floating-xlarge: 0 0 0 1px #3d444d, 0 32px 64px 0 #010409; /** Extra large floating shadow for full-screen overlays and sheets */
2387
2387
  --underlineNav-borderColor-hover: var(--borderColor-neutral-muted);
2388
- --border-draft-muted: 0.0625rem solid #3d444db3;
2388
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2389
2389
  --button-danger-borderColor-active: var(--button-danger-borderColor-hover);
2390
2390
  --button-outline-borderColor-hover: var(--button-default-borderColor-hover);
2391
2391
  --button-outline-borderColor-active: var(--button-outline-borderColor-hover);
package/dist/internalCss/light-colorblind-high-contrast.css CHANGED
@@ -928,25 +928,25 @@
928
928
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
929
929
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
930
930
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
931
- --border-accent-emphasis: 0.0625rem solid #0349b4;
932
- --border-accent-muted: 0.0625rem solid #368cf9;
933
- --border-attention-emphasis: 0.0625rem solid #744500;
934
- --border-attention-muted: 0.0625rem solid #b58407;
935
- --border-danger-emphasis: 0.0625rem solid #873800;
936
- --border-danger-muted: 0.0625rem solid #b45105;
937
- --border-default: 0.0625rem solid #454c54;
938
- --border-disabled: 0.0625rem solid #59636e1f;
939
- --border-done-emphasis: 0.0625rem solid #622cbc;
940
- --border-done-muted: 0.0625rem solid #a371f7;
941
- --border-neutral-emphasis: 0.0625rem solid #59636e;
942
- --border-severe-emphasis: 0.0625rem solid #873800;
943
- --border-severe-muted: 0.0625rem solid #dc6d1a66;
944
- --border-sponsors-emphasis: 0.0625rem solid #971368;
945
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
946
- --border-success-emphasis: 0.0625rem solid #0349b4;
947
- --border-success-muted: 0.0625rem solid #368cf9;
948
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
949
- --border-transparent: 0.0625rem solid #ffffff00;
931
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
932
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
933
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
934
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
935
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
936
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
937
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
938
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
939
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
940
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
941
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
942
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
943
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
944
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
945
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
946
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
947
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
948
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
949
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
950
950
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
951
951
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
952
952
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
@@ -1107,14 +1107,14 @@
1107
1107
  --avatar-borderColor: var(--borderColor-emphasis);
1108
1108
  --border-closed-emphasis: var(--border-danger-emphasis);
1109
1109
  --border-closed-muted: var(--border-danger-muted);
1110
- --border-draft-emphasis: 0.0625rem solid #59636e;
1111
- --border-draft-muted: 0.0625rem solid #454c54;
1112
- --border-emphasis: 0.0625rem solid #454c54;
1113
- --border-muted: 0.0625rem solid #454c54;
1110
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
1111
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
1112
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
1113
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
1114
1114
  --border-open-emphasis: var(--border-success-emphasis);
1115
1115
  --border-open-muted: var(--border-success-muted);
1116
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
1117
- --border-upsell-muted: 0.0625rem solid #a371f7;
1116
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
1117
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
1118
1118
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
1119
1119
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
1120
1120
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -1177,7 +1177,7 @@
1177
1177
  --diffBlob-expander-iconColor: var(--fgColor-default);
1178
1178
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
1179
1179
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
1180
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
1180
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
1181
1181
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
1182
1182
  --progressBar-track-bgColor: var(--bgColor-default);
1183
1183
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -1187,7 +1187,7 @@
1187
1187
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
1188
1188
  --tooltip-fgColor: var(--fgColor-onEmphasis);
1189
1189
  --underlineNav-borderColor-hover: var(--borderColor-muted);
1190
- --border-neutral-muted: 0.0625rem solid #454c54;
1190
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
1191
1191
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
1192
1192
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
1193
1193
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);
@@ -2124,25 +2124,25 @@
2124
2124
  --bgColor-upsell-emphasis: var(--bgColor-done-emphasis); /** Strong background for prominent upsell elements */
2125
2125
  --bgColor-upsell-muted: var(--bgColor-done-muted); /** Subtle background for upsell and promotional content */
2126
2126
  --bgColor-white: var(--base-color-neutral-0); /** Pure white background */
2127
- --border-accent-emphasis: 0.0625rem solid #0349b4;
2128
- --border-accent-muted: 0.0625rem solid #368cf9;
2129
- --border-attention-emphasis: 0.0625rem solid #744500;
2130
- --border-attention-muted: 0.0625rem solid #b58407;
2131
- --border-danger-emphasis: 0.0625rem solid #873800;
2132
- --border-danger-muted: 0.0625rem solid #b45105;
2133
- --border-default: 0.0625rem solid #454c54;
2134
- --border-disabled: 0.0625rem solid #59636e1f;
2135
- --border-done-emphasis: 0.0625rem solid #622cbc;
2136
- --border-done-muted: 0.0625rem solid #a371f7;
2137
- --border-neutral-emphasis: 0.0625rem solid #59636e;
2138
- --border-severe-emphasis: 0.0625rem solid #873800;
2139
- --border-severe-muted: 0.0625rem solid #dc6d1a66;
2140
- --border-sponsors-emphasis: 0.0625rem solid #971368;
2141
- --border-sponsors-muted: 0.0625rem solid #ed4baf;
2142
- --border-success-emphasis: 0.0625rem solid #0349b4;
2143
- --border-success-muted: 0.0625rem solid #368cf9;
2144
- --border-translucent: 0.0625rem solid #59636e; /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2145
- --border-transparent: 0.0625rem solid #ffffff00;
2127
+ --border-accent-emphasis: var(--borderWidth-default) solid var(--borderColor-accent-emphasis);
2128
+ --border-accent-muted: var(--borderWidth-default) solid var(--borderColor-accent-muted);
2129
+ --border-attention-emphasis: var(--borderWidth-default) solid var(--borderColor-attention-emphasis);
2130
+ --border-attention-muted: var(--borderWidth-default) solid var(--borderColor-attention-muted);
2131
+ --border-danger-emphasis: var(--borderWidth-default) solid var(--borderColor-danger-emphasis);
2132
+ --border-danger-muted: var(--borderWidth-default) solid var(--borderColor-danger-muted);
2133
+ --border-default: var(--borderWidth-default) solid var(--borderColor-default);
2134
+ --border-disabled: var(--borderWidth-default) solid var(--borderColor-disabled);
2135
+ --border-done-emphasis: var(--borderWidth-default) solid var(--borderColor-done-emphasis);
2136
+ --border-done-muted: var(--borderWidth-default) solid var(--borderColor-done-muted);
2137
+ --border-neutral-emphasis: var(--borderWidth-default) solid var(--borderColor-neutral-emphasis);
2138
+ --border-severe-emphasis: var(--borderWidth-default) solid var(--borderColor-severe-emphasis);
2139
+ --border-severe-muted: var(--borderWidth-default) solid var(--borderColor-severe-muted);
2140
+ --border-sponsors-emphasis: var(--borderWidth-default) solid var(--borderColor-sponsors-emphasis);
2141
+ --border-sponsors-muted: var(--borderWidth-default) solid var(--borderColor-sponsors-muted);
2142
+ --border-success-emphasis: var(--borderWidth-default) solid var(--borderColor-success-emphasis);
2143
+ --border-success-muted: var(--borderWidth-default) solid var(--borderColor-success-muted);
2144
+ --border-translucent: var(--borderWidth-default) solid var(--borderColor-translucent); /** Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design. */
2145
+ --border-transparent: var(--borderWidth-default) solid var(--borderColor-transparent);
2146
2146
  --borderColor-closed-muted: var(--borderColor-default); /** Subtle border for closed state indicators */
2147
2147
  --borderColor-draft-emphasis: var(--borderColor-neutral-emphasis); /** Strong border for draft state badges */
2148
2148
  --borderColor-draft-muted: var(--borderColor-default); /** Subtle border for draft state indicators */
@@ -2303,14 +2303,14 @@
2303
2303
  --avatar-borderColor: var(--borderColor-emphasis);
2304
2304
  --border-closed-emphasis: var(--border-danger-emphasis);
2305
2305
  --border-closed-muted: var(--border-danger-muted);
2306
- --border-draft-emphasis: 0.0625rem solid #59636e;
2307
- --border-draft-muted: 0.0625rem solid #454c54;
2308
- --border-emphasis: 0.0625rem solid #454c54;
2309
- --border-muted: 0.0625rem solid #454c54;
2306
+ --border-draft-emphasis: var(--borderWidth-default) solid var(--borderColor-draft-emphasis);
2307
+ --border-draft-muted: var(--borderWidth-default) solid var(--borderColor-draft-muted);
2308
+ --border-emphasis: var(--borderWidth-default) solid var(--borderColor-emphasis);
2309
+ --border-muted: var(--borderWidth-default) solid var(--borderColor-muted);
2310
2310
  --border-open-emphasis: var(--border-success-emphasis);
2311
2311
  --border-open-muted: var(--border-success-muted);
2312
- --border-upsell-emphasis: 0.0625rem solid #622cbc;
2313
- --border-upsell-muted: 0.0625rem solid #a371f7;
2312
+ --border-upsell-emphasis: var(--borderWidth-default) solid var(--borderColor-upsell-emphasis);
2313
+ --border-upsell-muted: var(--borderWidth-default) solid var(--borderColor-upsell-muted);
2314
2314
  --borderColor-closed-emphasis: var(--borderColor-emphasis); /** Strong border for closed state badges */
2315
2315
  --borderColor-neutral-muted: var(--borderColor-muted); /** Subtle neutral semantic border */
2316
2316
  --button-danger-bgColor-disabled: var(--control-bgColor-disabled);
@@ -2373,7 +2373,7 @@
2373
2373
  --diffBlob-expander-iconColor: var(--fgColor-default);
2374
2374
  --diffBlob-hunkNum-fgColor-hover: var(--fgColor-default);
2375
2375
  --diffBlob-hunkNum-fgColor-rest: var(--fgColor-default);
2376
- --focus-outline: 0.125rem solid #0349b4; /** Focus ring outline for keyboard navigation and accessibility. */
2376
+ --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); /** Focus ring outline for keyboard navigation and accessibility. */
2377
2377
  --focus-outlineColor: var(--focus-outline-color); /** Deprecated. Use focus.outline-color instead. */
2378
2378
  --progressBar-track-bgColor: var(--bgColor-default);
2379
2379
  --reactionButton-selected-fgColor-rest: var(--fgColor-link);
@@ -2383,7 +2383,7 @@
2383
2383
  --shadow-floating-xlarge: 0 0 0 1px #454c54, 0 56px 112px 0 #25292e52; /** Extra large floating shadow for full-screen overlays and sheets */
2384
2384
  --tooltip-fgColor: var(--fgColor-onEmphasis);
2385
2385
  --underlineNav-borderColor-hover: var(--borderColor-muted);
2386
- --border-neutral-muted: 0.0625rem solid #454c54;
2386
+ --border-neutral-muted: var(--borderWidth-default) solid var(--borderColor-neutral-muted);
2387
2387
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
2388
2388
  --buttonKeybindingHint-danger-borderColor-disabled: var(--buttonKeybindingHint-default-borderColor-disabled);
2389
2389
  --buttonKeybindingHint-danger-borderColor-rest: var(--buttonKeybindingHint-default-borderColor-rest);