@primer/primitives 7.11.7 → 7.11.8-rc.0252b5f

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 (164) hide show
  1. package/dist/js/colors/dark.d.ts +6 -0
  2. package/dist/js/colors/dark.js +12 -6
  3. package/dist/js/colors/dark_colorblind.d.ts +6 -0
  4. package/dist/js/colors/dark_colorblind.js +12 -6
  5. package/dist/js/colors/dark_dimmed.d.ts +6 -0
  6. package/dist/js/colors/dark_dimmed.js +12 -6
  7. package/dist/js/colors/dark_high_contrast.d.ts +6 -0
  8. package/dist/js/colors/dark_high_contrast.js +10 -4
  9. package/dist/js/colors/dark_tritanopia.d.ts +6 -0
  10. package/dist/js/colors/dark_tritanopia.js +12 -6
  11. package/dist/js/colors/index.d.ts +54 -0
  12. package/dist/js/colors/light.d.ts +6 -0
  13. package/dist/js/colors/light.js +9 -3
  14. package/dist/js/colors/light_colorblind.d.ts +6 -0
  15. package/dist/js/colors/light_colorblind.js +9 -3
  16. package/dist/js/colors/light_high_contrast.d.ts +6 -0
  17. package/dist/js/colors/light_high_contrast.js +9 -3
  18. package/dist/js/colors/light_tritanopia.d.ts +6 -0
  19. package/dist/js/colors/light_tritanopia.js +9 -3
  20. package/dist/js/index.d.ts +54 -0
  21. package/dist/json/colors/dark.json +12 -6
  22. package/dist/json/colors/dark_colorblind.json +12 -6
  23. package/dist/json/colors/dark_dimmed.json +12 -6
  24. package/dist/json/colors/dark_high_contrast.json +10 -4
  25. package/dist/json/colors/dark_tritanopia.json +12 -6
  26. package/dist/json/colors/light.json +9 -3
  27. package/dist/json/colors/light_colorblind.json +9 -3
  28. package/dist/json/colors/light_high_contrast.json +9 -3
  29. package/dist/json/colors/light_tritanopia.json +9 -3
  30. package/dist/scss/colors/_dark.scss +11 -5
  31. package/dist/scss/colors/_dark_colorblind.scss +11 -5
  32. package/dist/scss/colors/_dark_dimmed.scss +11 -5
  33. package/dist/scss/colors/_dark_high_contrast.scss +9 -3
  34. package/dist/scss/colors/_dark_tritanopia.scss +11 -5
  35. package/dist/scss/colors/_light.scss +8 -2
  36. package/dist/scss/colors/_light_colorblind.scss +8 -2
  37. package/dist/scss/colors/_light_high_contrast.scss +8 -2
  38. package/dist/scss/colors/_light_tritanopia.scss +8 -2
  39. package/dist/ts/colors/dark.ts +12 -6
  40. package/dist/ts/colors/dark_colorblind.ts +12 -6
  41. package/dist/ts/colors/dark_dimmed.ts +12 -6
  42. package/dist/ts/colors/dark_high_contrast.ts +10 -4
  43. package/dist/ts/colors/dark_tritanopia.ts +12 -6
  44. package/dist/ts/colors/light.ts +9 -3
  45. package/dist/ts/colors/light_colorblind.ts +9 -3
  46. package/dist/ts/colors/light_high_contrast.ts +9 -3
  47. package/dist/ts/colors/light_tritanopia.ts +9 -3
  48. package/package.json +4 -6
  49. package/tokens-next-private/css/functional/themes/dark-colorblind.css +388 -376
  50. package/tokens-next-private/css/functional/themes/dark-dimmed.css +320 -308
  51. package/tokens-next-private/css/functional/themes/dark-high-contrast.css +308 -296
  52. package/tokens-next-private/css/functional/themes/dark-tritanopia.css +340 -328
  53. package/tokens-next-private/css/functional/themes/dark.css +320 -308
  54. package/tokens-next-private/css/functional/themes/light-colorblind.css +348 -286
  55. package/tokens-next-private/css/functional/themes/light-high-contrast.css +270 -208
  56. package/tokens-next-private/css/functional/themes/light-tritanopia.css +290 -228
  57. package/tokens-next-private/css/functional/themes/light.css +270 -208
  58. package/tokens-next-private/docs/functional/size/border.json +3 -1
  59. package/tokens-next-private/docs/functional/themes/dark-colorblind.json +504 -416
  60. package/tokens-next-private/docs/functional/themes/dark-dimmed.json +321 -233
  61. package/tokens-next-private/docs/functional/themes/dark-high-contrast.json +308 -216
  62. package/tokens-next-private/docs/functional/themes/dark-tritanopia.json +447 -357
  63. package/tokens-next-private/docs/functional/themes/dark.json +321 -233
  64. package/tokens-next-private/docs/functional/themes/light-colorblind.json +663 -240
  65. package/tokens-next-private/docs/functional/themes/light-high-contrast.json +502 -77
  66. package/tokens-next-private/docs/functional/themes/light-tritanopia.json +623 -198
  67. package/tokens-next-private/docs/functional/themes/light.json +500 -77
  68. package/tokens-next-private/docs/functional/typography/typography.json +33 -11
  69. package/tokens-next-private/fallbacks/color-fallbacks.json +245 -0
  70. package/tokens-next-private/js/functional/themes/dark-colorblind.js +158 -116
  71. package/tokens-next-private/js/functional/themes/dark-dimmed.js +103 -61
  72. package/tokens-next-private/js/functional/themes/dark-high-contrast.js +97 -55
  73. package/tokens-next-private/js/functional/themes/dark-tritanopia.js +113 -71
  74. package/tokens-next-private/js/functional/themes/dark.js +103 -61
  75. package/tokens-next-private/js/functional/themes/light-colorblind.js +123 -106
  76. package/tokens-next-private/js/functional/themes/light-high-contrast.js +65 -48
  77. package/tokens-next-private/js/functional/themes/light-tritanopia.js +75 -58
  78. package/tokens-next-private/js/functional/themes/light.js +65 -48
  79. package/tokens-next-private/json/functional/themes/dark-colorblind.json +161 -119
  80. package/tokens-next-private/json/functional/themes/dark-dimmed.json +106 -64
  81. package/tokens-next-private/json/functional/themes/dark-high-contrast.json +100 -58
  82. package/tokens-next-private/json/functional/themes/dark-tritanopia.json +116 -74
  83. package/tokens-next-private/json/functional/themes/dark.json +106 -64
  84. package/tokens-next-private/json/functional/themes/light-colorblind.json +124 -107
  85. package/tokens-next-private/json/functional/themes/light-high-contrast.json +66 -49
  86. package/tokens-next-private/json/functional/themes/light-tritanopia.json +76 -59
  87. package/tokens-next-private/json/functional/themes/light.json +66 -49
  88. package/tokens-next-private/scss/functional/size/border.scss +1 -1
  89. package/tokens-next-private/scss/functional/themes/dark-colorblind.scss +121 -115
  90. package/tokens-next-private/scss/functional/themes/dark-dimmed.scss +67 -61
  91. package/tokens-next-private/scss/functional/themes/dark-high-contrast.scss +61 -55
  92. package/tokens-next-private/scss/functional/themes/dark-tritanopia.scss +77 -71
  93. package/tokens-next-private/scss/functional/themes/dark.scss +67 -61
  94. package/tokens-next-private/scss/functional/themes/light-colorblind.scss +101 -70
  95. package/tokens-next-private/scss/functional/themes/light-high-contrast.scss +42 -11
  96. package/tokens-next-private/scss/functional/themes/light-tritanopia.scss +52 -21
  97. package/tokens-next-private/scss/functional/themes/light.scss +42 -11
  98. package/tokens-next-private/scss/functional/typography/typography.scss +11 -11
  99. package/tokens-next-private/ts/functional/themes/dark-colorblind.ts +158 -116
  100. package/tokens-next-private/ts/functional/themes/dark-dimmed.ts +103 -61
  101. package/tokens-next-private/ts/functional/themes/dark-high-contrast.ts +97 -55
  102. package/tokens-next-private/ts/functional/themes/dark-tritanopia.ts +113 -71
  103. package/tokens-next-private/ts/functional/themes/dark.ts +103 -61
  104. package/tokens-next-private/ts/functional/themes/light-colorblind.ts +123 -106
  105. package/tokens-next-private/ts/functional/themes/light-high-contrast.ts +65 -48
  106. package/tokens-next-private/ts/functional/themes/light-tritanopia.ts +75 -58
  107. package/tokens-next-private/ts/functional/themes/light.ts +65 -48
  108. package/tokens-next-private/ts/types/BaseColorDesignTokens.d.ts +1 -1
  109. package/tokens-next-private/ts/types/SizeDesignTokens.d.ts +1 -1
  110. package/tokens-next-private/ts/types/ThemeDesignTokens.d.ts +59 -42
  111. package/tokens-next-private/ts/types/TypographyDesignTokens.d.ts +1 -1
  112. package/tokens-v2-private/css/tokens/base/size/size.css +1 -1
  113. package/tokens-v2-private/css/tokens/base/typography/typography.css +1 -1
  114. package/tokens-v2-private/css/tokens/functional/size/border.css +1 -1
  115. package/tokens-v2-private/css/tokens/functional/size/breakpoints.css +1 -1
  116. package/tokens-v2-private/css/tokens/functional/size/size-coarse.css +1 -1
  117. package/tokens-v2-private/css/tokens/functional/size/size-fine.css +1 -1
  118. package/tokens-v2-private/css/tokens/functional/size/size.css +1 -1
  119. package/tokens-v2-private/css/tokens/functional/typography/typography.css +1 -1
  120. package/tokens-v2-private/js/module/tokens/base/size/size.js +1 -1
  121. package/tokens-v2-private/js/module/tokens/base/typography/typography.js +1 -1
  122. package/tokens-v2-private/js/module/tokens/functional/size/border.js +1 -1
  123. package/tokens-v2-private/js/module/tokens/functional/size/breakpoints.js +1 -1
  124. package/tokens-v2-private/js/module/tokens/functional/size/size-coarse.js +1 -1
  125. package/tokens-v2-private/js/module/tokens/functional/size/size-fine.js +1 -1
  126. package/tokens-v2-private/js/module/tokens/functional/size/size.js +1 -1
  127. package/tokens-v2-private/js/module/tokens/functional/size/viewport.js +1 -1
  128. package/tokens-v2-private/js/module/tokens/functional/typography/typography.js +1 -1
  129. package/tokens-v2-private/js/tokens/base/size/size.js +1 -1
  130. package/tokens-v2-private/js/tokens/base/typography/typography.js +1 -1
  131. package/tokens-v2-private/js/tokens/functional/size/border.js +1 -1
  132. package/tokens-v2-private/js/tokens/functional/size/breakpoints.js +1 -1
  133. package/tokens-v2-private/js/tokens/functional/size/size-coarse.js +1 -1
  134. package/tokens-v2-private/js/tokens/functional/size/size-fine.js +1 -1
  135. package/tokens-v2-private/js/tokens/functional/size/size.js +1 -1
  136. package/tokens-v2-private/js/tokens/functional/size/viewport.js +1 -1
  137. package/tokens-v2-private/js/tokens/functional/typography/typography.js +1 -1
  138. package/tokens-v2-private/scss/tokens/base/size/size.scss +1 -1
  139. package/tokens-v2-private/scss/tokens/base/typography/typography.scss +1 -1
  140. package/tokens-v2-private/scss/tokens/functional/size/border.scss +1 -1
  141. package/tokens-v2-private/scss/tokens/functional/size/breakpoints.scss +1 -1
  142. package/tokens-v2-private/scss/tokens/functional/size/size-coarse.scss +1 -1
  143. package/tokens-v2-private/scss/tokens/functional/size/size-fine.scss +1 -1
  144. package/tokens-v2-private/scss/tokens/functional/size/size.scss +1 -1
  145. package/tokens-v2-private/scss/tokens/functional/size/viewport.scss +1 -1
  146. package/tokens-v2-private/scss/tokens/functional/typography/typography.scss +1 -1
  147. package/tokens-v2-private/ts/tokens/base/size/size.d.ts +1 -1
  148. package/tokens-v2-private/ts/tokens/base/size/size.js +1 -1
  149. package/tokens-v2-private/ts/tokens/base/typography/typography.d.ts +1 -1
  150. package/tokens-v2-private/ts/tokens/base/typography/typography.js +1 -1
  151. package/tokens-v2-private/ts/tokens/functional/size/border.d.ts +1 -1
  152. package/tokens-v2-private/ts/tokens/functional/size/border.js +1 -1
  153. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.d.ts +1 -1
  154. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.js +1 -1
  155. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.d.ts +1 -1
  156. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.js +1 -1
  157. package/tokens-v2-private/ts/tokens/functional/size/size-fine.d.ts +1 -1
  158. package/tokens-v2-private/ts/tokens/functional/size/size-fine.js +1 -1
  159. package/tokens-v2-private/ts/tokens/functional/size/size.d.ts +1 -1
  160. package/tokens-v2-private/ts/tokens/functional/size/size.js +1 -1
  161. package/tokens-v2-private/ts/tokens/functional/size/viewport.d.ts +1 -1
  162. package/tokens-v2-private/ts/tokens/functional/size/viewport.js +1 -1
  163. package/tokens-v2-private/ts/tokens/functional/typography/typography.d.ts +1 -1
  164. package/tokens-v2-private/ts/tokens/functional/typography/typography.js +1 -1
@@ -81,8 +81,8 @@
81
81
  --control-checked-fgColor-rest: #ffffff;
82
82
  --control-checked-fgColor-disabled: #ffffff;
83
83
  --control-checked-borderColor-rest: #0969da;
84
- --control-checked-borderColor-hover: #00000000;
85
- --control-checked-borderColor-active: #00000000;
84
+ --control-checked-borderColor-hover: #0860ca;
85
+ --control-checked-borderColor-active: #0757ba;
86
86
  --control-checked-borderColor-disabled: #8c959f;
87
87
  --controlTrack-bgColor-rest: #eaeef2;
88
88
  --controlTrack-bgColor-hover: #dee3e8;
@@ -116,11 +116,12 @@
116
116
  --button-primary-bgColor-hover: #1c8139;
117
117
  --button-primary-bgColor-active: #197935;
118
118
  --button-primary-bgColor-disabled: #95d8a6;
119
- --button-primary-borderColor-rest: #d0d7decc;
120
- --button-primary-borderColor-hover: #d0d7decc;
121
- --button-primary-borderColor-disabled: #d0d7decc;
119
+ --button-primary-borderColor-rest: #1f232826;
120
+ --button-primary-borderColor-hover: #1f232826;
121
+ --button-primary-borderColor-disabled: #1f232826;
122
122
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
123
123
  --button-invisible-fgColor-rest: #0969da;
124
+ --button-invisible-fgColor-hover: #0969da;
124
125
  --button-invisible-fgColor-disabled: #8c959f;
125
126
  --button-invisible-bgColor-rest: #00000000;
126
127
  --button-invisible-bgColor-hover: #d0d7de33;
@@ -153,14 +154,21 @@
153
154
  --button-danger-borderColor-hover: #d0d7de;
154
155
  --button-danger-borderColor-active: #d0d7de;
155
156
  --button-danger-shadow-selected: inset 0px 1px 0px 0px #4c001433;
156
- --buttonCounter-default-bgColor-rest: #eaeef280;
157
- --buttonCounter-primary-bgColor-rest: #ffffff33;
157
+ --buttonCounter-default-bgColor-rest: #eaeef2;
158
+ --buttonCounter-invisible-bgColor-rest: #eaeef2;
159
+ --buttonCounter-primary-bgColor-rest: #002d1133;
158
160
  --buttonCounter-outline-bgColor-rest: #0969da1a;
159
161
  --buttonCounter-outline-bgColor-hover: #ffffff33;
160
162
  --buttonCounter-outline-bgColor-disabled: #0969da0d;
163
+ --buttonCounter-outline-fgColor-rest: #0550ae;
164
+ --buttonCounter-outline-fgColor-hover: #ffffff;
165
+ --buttonCounter-outline-fgColor-disabled: #0969da80;
161
166
  --buttonCounter-danger-bgColor-hover: #ffffff33;
162
167
  --buttonCounter-danger-bgColor-disabled: #cf222e0d;
163
168
  --buttonCounter-danger-bgColor-rest: #cf222e1a;
169
+ --buttonCounter-danger-fgColor-rest: #c21c2c;
170
+ --buttonCounter-danger-fgColor-hover: #ffffff;
171
+ --buttonCounter-danger-fgColor-disabled: #d1242f80;
164
172
  --focus-outlineColor: #0969da;
165
173
  --focus-outline: #0969da solid 2px;
166
174
  --menu-bgColor-active: #ffffff00;
@@ -179,8 +187,6 @@
179
187
  --fgColor-onEmphasis: #ffffff;
180
188
  --fgColor-disabled: #8c959f;
181
189
  --fgColor-link-rest: #0969da;
182
- --fgColor-link-inverse-rest: #54aeff;
183
- --fgColor-link-control: #868f99;
184
190
  --fgColor-accent: #0969da;
185
191
  --fgColor-success: #1a7f37;
186
192
  --fgColor-attention: #9a6700;
@@ -238,25 +244,50 @@
238
244
  --borderColor-done-emphasis: #8250df;
239
245
  --borderColor-sponsors-muted: #ff80c866;
240
246
  --borderColor-sponsors-emphasis: #bf3989;
247
+ --color-ansi-black: #24292f;
241
248
  --color-ansi-black-bright: #57606a;
249
+ --color-ansi-white: #6e7781;
242
250
  --color-ansi-white-bright: #8c959f;
243
251
  --color-ansi-gray: #6e7781;
252
+ --color-ansi-red: #cf222e;
244
253
  --color-ansi-red-bright: #a40e26;
254
+ --color-ansi-green: #116329;
245
255
  --color-ansi-green-bright: #1a7f37;
256
+ --color-ansi-yellow: #4d2d00;
246
257
  --color-ansi-yellow-bright: #633c01;
258
+ --color-ansi-blue: #0969da;
247
259
  --color-ansi-blue-bright: #218bff;
260
+ --color-ansi-magenta: #8250df;
248
261
  --color-ansi-magenta-bright: #a475f9;
262
+ --color-ansi-cyan: #1b7c83;
249
263
  --color-ansi-cyan-bright: #3192aa;
250
264
  --color-prettylights-syntax-comment: #6e7781;
265
+ --color-prettylights-syntax-constant: #0550ae;
251
266
  --color-prettylights-syntax-constant-other-reference-link: #0a3069;
252
- --color-prettylights-syntax-entity-tag: #0550ae;
267
+ --color-prettylights-syntax-entity: #8250df;
253
268
  --color-prettylights-syntax-storage-modifier-import: #24292f;
269
+ --color-prettylights-syntax-entity-tag: #0550ae;
254
270
  --color-prettylights-syntax-keyword: #cf222e;
255
- --color-prettylights-syntax-string-regexp: #116329;
271
+ --color-prettylights-syntax-string: #0a3069;
256
272
  --color-prettylights-syntax-variable: #953800;
273
+ --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
257
274
  --color-prettylights-syntax-brackethighlighter-angle: #57606a;
275
+ --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
258
276
  --color-prettylights-syntax-invalid-illegal-bg: #82071e;
277
+ --color-prettylights-syntax-carriage-return-text: #f6f8fa;
259
278
  --color-prettylights-syntax-carriage-return-bg: #cf222e;
279
+ --color-prettylights-syntax-string-regexp: #116329;
280
+ --color-prettylights-syntax-markup-list: #3b2300;
281
+ --color-prettylights-syntax-markup-heading: #0550ae;
282
+ --color-prettylights-syntax-markup-italic: #24292f;
283
+ --color-prettylights-syntax-markup-bold: #24292f;
284
+ --color-prettylights-syntax-markup-deleted-text: #82071e;
285
+ --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
286
+ --color-prettylights-syntax-markup-inserted-text: #116329;
287
+ --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
288
+ --color-prettylights-syntax-markup-changed-text: #953800;
289
+ --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
290
+ --color-prettylights-syntax-markup-ignored-text: #eaeef2;
260
291
  --color-prettylights-syntax-markup-ignored-bg: #0550ae;
261
292
  --color-prettylights-syntax-meta-diff-range: #8250df;
262
293
  --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
@@ -7,7 +7,7 @@
7
7
  --text-display-size: 2.5rem;
8
8
  --text-display-lineHeight: calc(56 / 40);
9
9
  --text-display-weight: 500;
10
- --text-display-shorthand: 500 2.5rem / calc(56 / 40) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
10
+ --text-display-shorthand: 500 2.5rem / calc(56 / 40) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Hero-style text for brand to product transition pages. Utilize Title (large) styles on narrow viewports. */
11
11
  --text-title-size-large: 2rem;
12
12
  --text-title-size-medium: 1.25rem;
13
13
  --text-title-size-small: 1rem;
@@ -17,13 +17,13 @@
17
17
  --text-title-weight-large: 600;
18
18
  --text-title-weight-medium: 600;
19
19
  --text-title-weight-small: 600;
20
- --text-title-shorthand-large: 600 2rem / calc(48 / 32) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
21
- --text-title-shorthand-medium: 600 1.25rem / calc(32 / 20) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
22
- --text-title-shorthand-small: 600 1rem / calc(24 / 16) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
20
+ --text-title-shorthand-large: 600 2rem / calc(48 / 32) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Page headings for user-created objects, such as issues or pull requests. Utilize title (medium) styles on narrow viewports. */
21
+ --text-title-shorthand-medium: 600 1.25rem / calc(32 / 20) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Default page title. The 32px-equivalent line-height matches with button and other medium control heights. Great for page header composition. */
22
+ --text-title-shorthand-small: 600 1rem / calc(24 / 16) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Uses the same size as body (large) with a heavier weight of semibold (600). */
23
23
  --text-subtitle-size: 1.25rem;
24
24
  --text-subtitle-lineHeight: calc(32 / 20);
25
25
  --text-subtitle-weight: 400;
26
- --text-subtitle-shorthand: 400 1.25rem / calc(32 / 20) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
26
+ --text-subtitle-shorthand: 400 1.25rem / calc(32 / 20) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Page sections/sub headings, or less important object names in page titles (automated action titles, for example). Same line-height as title (medium). */
27
27
  --text-body-size-large: 1rem;
28
28
  --text-body-size-medium: 0.875rem;
29
29
  --text-body-size-small: 0.75rem;
@@ -31,19 +31,19 @@
31
31
  --text-body-lineHeight-medium: calc(20 / 14);
32
32
  --text-body-lineHeight-small: calc(20 / 12);
33
33
  --text-body-weight: 400;
34
- --text-body-shorthand-large: 400 1rem / calc(24 / 16) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
35
- --text-body-shorthand-medium: 400 0.875rem / calc(20 / 14) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
36
- --text-body-shorthand-small: 400 0.75rem / calc(20 / 12) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
34
+ --text-body-shorthand-large: 400 1rem / calc(24 / 16) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* User-generated content, markdown rendering. */
35
+ --text-body-shorthand-medium: 400 0.875rem / calc(20 / 14) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Default UI font. Most commonly used for body text. */
36
+ --text-body-shorthand-small: 400 0.75rem / calc(20 / 12) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Small body text for discrete UI applications, such as helper, footnote text. Should be used sparingly across pages. Line-height matches Body (medium) at 20px. */
37
37
  --text-caption-size: 0.75rem;
38
38
  --text-caption-lineHeight: calc(16 / 12);
39
39
  --text-caption-weight: 400;
40
- --text-caption-shorthand: 400 0.75rem / calc(16 / 12) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
40
+ --text-caption-shorthand: 400 0.75rem / calc(16 / 12) -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; /* Compact small font with a smaller line height of 16px. Use it for single-line scenarios, as the small sizing doesn’t pass accessibility requirements. */
41
41
  --text-codeBlock-size: 0.8125rem;
42
42
  --text-codeBlock-lineHeight: calc(20 / 13);
43
43
  --text-codeBlock-weight: 400;
44
- --text-codeBlock-shorthand: 400 0.8125rem / calc(20 / 13) ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
44
+ --text-codeBlock-shorthand: 400 0.8125rem / calc(20 / 13) ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace; /* Default style for rendering code blocks. */
45
45
  --text-codeInline-size: 0.9285em;
46
46
  --text-codeInline-weight: 400;
47
- --text-codeInline-shorthand: 400 0.9285em ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
47
+ --text-codeInline-shorthand: 400 0.9285em ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace; /* Inline code blocks using em units to inherit size from its parent. */
48
48
  }
49
49
  }
@@ -30,9 +30,9 @@ export default {
30
30
  num: "#e6edf3",
31
31
  },
32
32
  bgColor: {
33
- num: "#d476164d",
34
- line: "#d4761626",
35
- word: "#d4761666",
33
+ num: "#db6d284d",
34
+ line: "#db6d2826",
35
+ word: "#db6d2866",
36
36
  },
37
37
  },
38
38
  hunk: {
@@ -84,11 +84,11 @@ export default {
84
84
  comment: "#8b949e",
85
85
  constant: "#79c0ff",
86
86
  entity: "#d2a8ff",
87
- keyword: "#ec8e2c",
88
- storage: "#ec8e2c",
87
+ keyword: "#f0883e",
88
+ storage: "#f0883e",
89
89
  string: "#a5d6ff",
90
90
  support: "#79c0ff",
91
- variable: "#fdac54",
91
+ variable: "#ffa657",
92
92
  },
93
93
  },
94
94
  },
@@ -108,7 +108,7 @@ export default {
108
108
  },
109
109
  avatar: {
110
110
  bgColor: "#ffffff1a",
111
- borderColor: "#00000000",
111
+ borderColor: "#30363d66",
112
112
  shadow: "0px 0px 0px 2px #0d1117",
113
113
  },
114
114
  avatarStack: {
@@ -138,7 +138,7 @@ export default {
138
138
  disabled: "#30363d",
139
139
  selected: "#f0f6fc",
140
140
  success: "#1f6feb",
141
- danger: "#b76100",
141
+ danger: "#bd561d",
142
142
  warning: "#9e6a03",
143
143
  },
144
144
  iconColor: {
@@ -160,12 +160,12 @@ export default {
160
160
  },
161
161
  danger: {
162
162
  fgColor: {
163
- rest: "#d47616",
164
- hover: "#ec8e2c",
163
+ rest: "#db6d28",
164
+ hover: "#f0883e",
165
165
  },
166
166
  bgColor: {
167
- hover: "#d476161a",
168
- active: "#d4761666",
167
+ hover: "#db6d281a",
168
+ active: "#db6d2866",
169
169
  },
170
170
  },
171
171
  checked: {
@@ -181,8 +181,8 @@ export default {
181
181
  },
182
182
  borderColor: {
183
183
  rest: "#1f6feb",
184
- hover: "#00000000",
185
- active: "#00000000",
184
+ hover: "#2a7aef",
185
+ active: "#3685f3",
186
186
  disabled: "#484f58",
187
187
  },
188
188
  },
@@ -254,9 +254,9 @@ export default {
254
254
  disabled: "#1158c7",
255
255
  },
256
256
  borderColor: {
257
- rest: "#30363dcc",
258
- hover: "#30363dcc",
259
- disabled: "#30363dcc",
257
+ rest: "#f0f6fc1a",
258
+ hover: "#f0f6fc1a",
259
+ disabled: "#f0f6fc1a",
260
260
  },
261
261
  shadow: {
262
262
  selected: "0px 0px 0px 0px #000000",
@@ -265,6 +265,7 @@ export default {
265
265
  invisible: {
266
266
  fgColor: {
267
267
  rest: "#2f81f7",
268
+ hover: "#58a6ff",
268
269
  disabled: "#484f58",
269
270
  },
270
271
  bgColor: {
@@ -280,8 +281,8 @@ export default {
280
281
  },
281
282
  outline: {
282
283
  fgColor: {
283
- rest: "#2f81f7",
284
- hover: "#2f81f7",
284
+ rest: "#388bfd",
285
+ hover: "#58a6ff",
285
286
  active: "#ffffff",
286
287
  disabled: "#2f81f780",
287
288
  },
@@ -301,25 +302,25 @@ export default {
301
302
  },
302
303
  danger: {
303
304
  fgColor: {
304
- rest: "#d47616",
305
+ rest: "#db6d28",
305
306
  hover: "#ffffff",
306
307
  active: "#ffffff",
307
- disabled: "#d4761680",
308
+ disabled: "#db6d2880",
308
309
  },
309
310
  iconColor: {
310
- rest: "#d47616",
311
+ rest: "#db6d28",
311
312
  hover: "#ffffff",
312
313
  },
313
314
  bgColor: {
314
315
  rest: "#21262d",
315
- hover: "#914d04",
316
- active: "#ac5d0b",
316
+ hover: "#9b4215",
317
+ active: "#b5531d",
317
318
  disabled: "#21262d",
318
319
  },
319
320
  borderColor: {
320
321
  rest: "#30363d",
321
- hover: "#914d04",
322
- active: "#ac5d0b",
322
+ hover: "#9b4215",
323
+ active: "#b5531d",
323
324
  },
324
325
  shadow: {
325
326
  selected: "0px 0px 0px 0px #000000",
@@ -332,23 +333,38 @@ export default {
332
333
  rest: "#30363d",
333
334
  },
334
335
  },
336
+ invisible: {
337
+ bgColor: {
338
+ rest: "#30363d",
339
+ },
340
+ },
335
341
  primary: {
336
342
  bgColor: {
337
- rest: "#ffffff33",
343
+ rest: "#04260f33",
338
344
  },
339
345
  },
340
346
  outline: {
341
347
  bgColor: {
342
- rest: "#1f6feb1a",
343
- hover: "#ffffff33",
348
+ rest: "#051d4d33",
349
+ hover: "#051d4d33",
344
350
  disabled: "#1f6feb0d",
345
351
  },
352
+ fgColor: {
353
+ rest: "#388bfd",
354
+ hover: "#58a6ff",
355
+ disabled: "#2f81f780",
356
+ },
346
357
  },
347
358
  danger: {
348
359
  bgColor: {
349
360
  hover: "#ffffff33",
350
- disabled: "#b761000d",
351
- rest: "#b761001a",
361
+ disabled: "#bd561d0d",
362
+ rest: "#49020233",
363
+ },
364
+ fgColor: {
365
+ rest: "#db6d28",
366
+ hover: "#ffffff",
367
+ disabled: "#db6d2880",
352
368
  },
353
369
  },
354
370
  },
@@ -403,17 +419,13 @@ export default {
403
419
  disabled: "#484f58",
404
420
  link: {
405
421
  rest: "#2f81f7",
406
- inverse: {
407
- rest: "#1f6feb",
408
- },
409
- control: "#636a75",
410
422
  },
411
423
  accent: "#2f81f7",
412
424
  success: "#58a6ff",
413
425
  attention: "#d29922",
414
- severe: "#d47616",
415
- danger: "#d47616",
416
- open: "#ec8e2c",
426
+ severe: "#db6d28",
427
+ danger: "#db6d28",
428
+ open: "#f0883e",
417
429
  closed: "#8b949e",
418
430
  done: "#a371f7",
419
431
  sponsors: "#db61a2",
@@ -440,16 +452,16 @@ export default {
440
452
  emphasis: "#9e6a03",
441
453
  },
442
454
  severe: {
443
- muted: "#d476161a",
444
- emphasis: "#b76100",
455
+ muted: "#db6d281a",
456
+ emphasis: "#bd561d",
445
457
  },
446
458
  danger: {
447
- muted: "#d476161a",
448
- emphasis: "#b76100",
459
+ muted: "#db6d281a",
460
+ emphasis: "#bd561d",
449
461
  },
450
462
  open: {
451
- muted: "#d4761666",
452
- emphasis: "#b76100",
463
+ muted: "#db6d2866",
464
+ emphasis: "#bd561d",
453
465
  },
454
466
  closed: {
455
467
  muted: "#6e768166",
@@ -486,16 +498,16 @@ export default {
486
498
  emphasis: "#9e6a03",
487
499
  },
488
500
  severe: {
489
- muted: "#d4761666",
490
- emphasis: "#b76100",
501
+ muted: "#db6d2866",
502
+ emphasis: "#bd561d",
491
503
  },
492
504
  danger: {
493
- muted: "#d4761666",
494
- emphasis: "#b76100",
505
+ muted: "#db6d2866",
506
+ emphasis: "#bd561d",
495
507
  },
496
508
  open: {
497
- muted: "#d4761666",
498
- emphasis: "#d47616",
509
+ muted: "#db6d2866",
510
+ emphasis: "#db6d28",
499
511
  },
500
512
  closed: {
501
513
  muted: "#6e768166",
@@ -510,62 +522,92 @@ export default {
510
522
  emphasis: "#bf4b8a",
511
523
  },
512
524
  },
513
- ansi: {
514
- fgColor: {
525
+ color: {
526
+ ansi: {
515
527
  black: "#484f58",
516
- blackBright: "#6e7681",
528
+ "black-bright": "#6e7681",
517
529
  white: "#b1bac4",
518
- whiteBright: "#ffffff",
530
+ "white-bright": "#ffffff",
519
531
  gray: "#6e7681",
520
- red: "#ec8e2c",
521
- redBright: "#fdac54",
532
+ red: "#f0883e",
533
+ "red-bright": "#ffa657",
522
534
  green: "#58a6ff",
523
- greenBright: "#79c0ff",
535
+ "green-bright": "#79c0ff",
524
536
  yellow: "#d29922",
525
- yellowBright: "#e3b341",
537
+ "yellow-bright": "#e3b341",
526
538
  blue: "#58a6ff",
527
- blueBright: "#79c0ff",
539
+ "blue-bright": "#79c0ff",
528
540
  magenta: "#bc8cff",
529
- magentaBright: "#d2a8ff",
541
+ "magenta-bright": "#d2a8ff",
530
542
  cyan: "#39c5cf",
531
- cyanBright: "#56d4dd",
543
+ "cyan-bright": "#56d4dd",
532
544
  },
533
- },
534
- prettylights: {
535
- syntax: {
536
- comment: "#8b949e",
537
- constant: "#79c0ff",
538
- entity: "#d2a8ff",
539
- storageModifierImport: "#c9d1d9",
540
- entityTag: "#a5d6ff",
541
- keyword: "#ec8e2c",
542
- string: "#a5d6ff",
543
- variable: "#fdac54",
544
- brackethighlighterUnmatched: "#d47616",
545
- invalidIllegalText: "#f0f6fc",
546
- invalidIllegalBg: "#6c3906",
547
- carriageReturnText: "#f0f6fc",
548
- carriageReturnBg: "#914d04",
549
- stringRegexp: "#a5d6ff",
550
- markupList: "#f2cc60",
551
- markupHeading: "#1f6feb",
552
- markupItalic: "#c9d1d9",
553
- markupBold: "#c9d1d9",
554
- markupDeletedText: "#ffe2bb",
555
- markupDeletedBg: "#4e2906",
556
- markupInsertedText: "#cae8ff",
557
- markupInsertedBg: "#0c2d6b",
558
- markupChangedText: "#ffe2bb",
559
- markupChangedBg: "#4e2906",
560
- markupIgnoredText: "#c9d1d9",
561
- markupIgnoredBg: "#1158c7",
562
- metaDiffRange: "#d2a8ff",
563
- brackethighlighterAngle: "#8b949e",
564
- sublimelinterGutterMark: "#484f58",
565
- constantOtherReferenceLink: "#a5d6ff",
545
+ prettylights: {
546
+ syntax: {
547
+ comment: "#8b949e",
548
+ constant: "#79c0ff",
549
+ "constant-other-reference-link": "#a5d6ff",
550
+ entity: "#d2a8ff",
551
+ storage: {
552
+ modifier: {
553
+ import: "#c9d1d9",
554
+ },
555
+ },
556
+ "entity-tag": "#a5d6ff",
557
+ keyword: "#f0883e",
558
+ string: "#a5d6ff",
559
+ variable: "#ffa657",
560
+ brackethighlighter: {
561
+ unmatched: "#db6d28",
562
+ angle: "#8b949e",
563
+ },
564
+ invalid: {
565
+ illegal: {
566
+ text: "#f0f6fc",
567
+ bg: "#762d0a",
568
+ },
569
+ },
570
+ carriage: {
571
+ return: {
572
+ text: "#f0f6fc",
573
+ bg: "#9b4215",
574
+ },
575
+ },
576
+ "string-regexp": "#a5d6ff",
577
+ markup: {
578
+ list: "#f2cc60",
579
+ heading: "#1f6feb",
580
+ italic: "#c9d1d9",
581
+ bold: "#c9d1d9",
582
+ deleted: {
583
+ text: "#ffdfb6",
584
+ bg: "#5a1e02",
585
+ },
586
+ inserted: {
587
+ text: "#cae8ff",
588
+ bg: "#0c2d6b",
589
+ },
590
+ changed: {
591
+ text: "#ffdfb6",
592
+ bg: "#5a1e02",
593
+ },
594
+ ignored: {
595
+ text: "#c9d1d9",
596
+ bg: "#1158c7",
597
+ },
598
+ },
599
+ meta: {
600
+ diff: {
601
+ range: "#d2a8ff",
602
+ },
603
+ },
604
+ sublimelinter: {
605
+ gutter: {
606
+ mark: "#484f58",
607
+ },
608
+ },
609
+ },
566
610
  },
567
- },
568
- color: {
569
611
  scale: {
570
612
  black: "#010409",
571
613
  transparent: "#00000000",
@@ -619,28 +661,28 @@ export default {
619
661
  "9": "#341a00",
620
662
  },
621
663
  orange: {
622
- "0": "#ffe2bb",
623
- "1": "#ffc981",
624
- "2": "#fdac54",
625
- "3": "#ec8e2c",
626
- "4": "#d47616",
627
- "5": "#b76100",
628
- "6": "#914d04",
629
- "7": "#6c3906",
630
- "8": "#4e2906",
631
- "9": "#331c04",
664
+ "0": "#ffdfb6",
665
+ "1": "#ffc680",
666
+ "2": "#ffa657",
667
+ "3": "#f0883e",
668
+ "4": "#db6d28",
669
+ "5": "#bd561d",
670
+ "6": "#9b4215",
671
+ "7": "#762d0a",
672
+ "8": "#5a1e02",
673
+ "9": "#3d1300",
632
674
  },
633
675
  red: {
634
- "0": "#ffe2bb",
635
- "1": "#ffc981",
636
- "2": "#fdac54",
637
- "3": "#ec8e2c",
638
- "4": "#d47616",
639
- "5": "#b76100",
640
- "6": "#914d04",
641
- "7": "#6c3906",
642
- "8": "#4e2906",
643
- "9": "#331c04",
676
+ "0": "#ffdfb6",
677
+ "1": "#ffc680",
678
+ "2": "#ffa657",
679
+ "3": "#f0883e",
680
+ "4": "#db6d28",
681
+ "5": "#bd561d",
682
+ "6": "#9b4215",
683
+ "7": "#762d0a",
684
+ "8": "#5a1e02",
685
+ "9": "#3d1300",
644
686
  },
645
687
  purple: {
646
688
  "0": "#eddeff",