@primer/primitives 7.15.8 → 7.15.9-rc.f6594ef

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 (146) hide show
  1. package/dist/css/functional/themes/dark-colorblind.css +10 -8
  2. package/dist/css/functional/themes/dark-dimmed.css +10 -8
  3. package/dist/css/functional/themes/dark-high-contrast.css +10 -8
  4. package/dist/css/functional/themes/dark-tritanopia.css +10 -8
  5. package/dist/css/functional/themes/dark.css +10 -8
  6. package/dist/css/functional/themes/light-colorblind.css +10 -8
  7. package/dist/css/functional/themes/light-high-contrast.css +10 -8
  8. package/dist/css/functional/themes/light-tritanopia.css +10 -8
  9. package/dist/css/functional/themes/light.css +10 -8
  10. package/dist/docs/functional/themes/dark-colorblind.json +230 -21
  11. package/dist/docs/functional/themes/dark-dimmed.json +230 -21
  12. package/dist/docs/functional/themes/dark-high-contrast.json +230 -21
  13. package/dist/docs/functional/themes/dark-tritanopia.json +230 -21
  14. package/dist/docs/functional/themes/dark.json +230 -21
  15. package/dist/docs/functional/themes/light-colorblind.json +258 -17
  16. package/dist/docs/functional/themes/light-high-contrast.json +258 -17
  17. package/dist/docs/functional/themes/light-tritanopia.json +258 -17
  18. package/dist/docs/functional/themes/light.json +258 -17
  19. package/dist/figma/figma.json +11 -0
  20. package/dist/figma/shadows/dark-colorblind.json +1102 -0
  21. package/dist/figma/shadows/dark-dimmed.json +1102 -0
  22. package/dist/figma/shadows/dark-high-contrast.json +1102 -0
  23. package/dist/figma/shadows/dark-tritanopia.json +1102 -0
  24. package/dist/figma/shadows/dark.json +1102 -0
  25. package/dist/figma/shadows/light-colorblind.json +1102 -0
  26. package/dist/figma/shadows/light-high-contrast.json +1102 -0
  27. package/dist/figma/shadows/light-tritanopia.json +1102 -0
  28. package/dist/figma/shadows/light.json +1102 -0
  29. package/dist/figma/themes/dark-colorblind.json +1118 -2
  30. package/dist/figma/themes/dark-dimmed.json +1118 -2
  31. package/dist/figma/themes/dark-high-contrast.json +1118 -2
  32. package/dist/figma/themes/dark-tritanopia.json +1118 -2
  33. package/dist/figma/themes/dark.json +1118 -2
  34. package/dist/figma/themes/light-colorblind.json +1129 -13
  35. package/dist/figma/themes/light-high-contrast.json +1128 -12
  36. package/dist/figma/themes/light-tritanopia.json +1130 -14
  37. package/dist/figma/themes/light.json +1126 -10
  38. package/dist/scss/functional/themes/dark-colorblind.scss +5 -4
  39. package/dist/scss/functional/themes/dark-dimmed.scss +5 -4
  40. package/dist/scss/functional/themes/dark-high-contrast.scss +5 -4
  41. package/dist/scss/functional/themes/dark-tritanopia.scss +5 -4
  42. package/dist/scss/functional/themes/dark.scss +5 -4
  43. package/dist/scss/functional/themes/light-colorblind.scss +5 -4
  44. package/dist/scss/functional/themes/light-high-contrast.scss +5 -4
  45. package/dist/scss/functional/themes/light-tritanopia.scss +5 -4
  46. package/dist/scss/functional/themes/light.scss +5 -4
  47. package/package.json +1 -1
  48. package/tokens-next-private/css/functional/themes/dark-colorblind.css +10 -8
  49. package/tokens-next-private/css/functional/themes/dark-dimmed.css +10 -8
  50. package/tokens-next-private/css/functional/themes/dark-high-contrast.css +10 -8
  51. package/tokens-next-private/css/functional/themes/dark-tritanopia.css +10 -8
  52. package/tokens-next-private/css/functional/themes/dark.css +10 -8
  53. package/tokens-next-private/css/functional/themes/light-colorblind.css +10 -8
  54. package/tokens-next-private/css/functional/themes/light-high-contrast.css +10 -8
  55. package/tokens-next-private/css/functional/themes/light-tritanopia.css +10 -8
  56. package/tokens-next-private/css/functional/themes/light.css +10 -8
  57. package/tokens-next-private/docs/functional/themes/dark-colorblind.json +230 -21
  58. package/tokens-next-private/docs/functional/themes/dark-dimmed.json +230 -21
  59. package/tokens-next-private/docs/functional/themes/dark-high-contrast.json +230 -21
  60. package/tokens-next-private/docs/functional/themes/dark-tritanopia.json +230 -21
  61. package/tokens-next-private/docs/functional/themes/dark.json +230 -21
  62. package/tokens-next-private/docs/functional/themes/light-colorblind.json +258 -17
  63. package/tokens-next-private/docs/functional/themes/light-high-contrast.json +258 -17
  64. package/tokens-next-private/docs/functional/themes/light-tritanopia.json +258 -17
  65. package/tokens-next-private/docs/functional/themes/light.json +258 -17
  66. package/tokens-next-private/figma/figma.json +11 -0
  67. package/tokens-next-private/figma/shadows/dark-colorblind.json +1102 -0
  68. package/tokens-next-private/figma/shadows/dark-dimmed.json +1102 -0
  69. package/tokens-next-private/figma/shadows/dark-high-contrast.json +1102 -0
  70. package/tokens-next-private/figma/shadows/dark-tritanopia.json +1102 -0
  71. package/tokens-next-private/figma/shadows/dark.json +1102 -0
  72. package/tokens-next-private/figma/shadows/light-colorblind.json +1102 -0
  73. package/tokens-next-private/figma/shadows/light-high-contrast.json +1102 -0
  74. package/tokens-next-private/figma/shadows/light-tritanopia.json +1102 -0
  75. package/tokens-next-private/figma/shadows/light.json +1102 -0
  76. package/tokens-next-private/figma/themes/dark-colorblind.json +1118 -2
  77. package/tokens-next-private/figma/themes/dark-dimmed.json +1118 -2
  78. package/tokens-next-private/figma/themes/dark-high-contrast.json +1118 -2
  79. package/tokens-next-private/figma/themes/dark-tritanopia.json +1118 -2
  80. package/tokens-next-private/figma/themes/dark.json +1118 -2
  81. package/tokens-next-private/figma/themes/light-colorblind.json +1129 -13
  82. package/tokens-next-private/figma/themes/light-high-contrast.json +1128 -12
  83. package/tokens-next-private/figma/themes/light-tritanopia.json +1130 -14
  84. package/tokens-next-private/figma/themes/light.json +1126 -10
  85. package/tokens-next-private/scss/functional/themes/dark-colorblind.scss +5 -4
  86. package/tokens-next-private/scss/functional/themes/dark-dimmed.scss +5 -4
  87. package/tokens-next-private/scss/functional/themes/dark-high-contrast.scss +5 -4
  88. package/tokens-next-private/scss/functional/themes/dark-tritanopia.scss +5 -4
  89. package/tokens-next-private/scss/functional/themes/dark.scss +5 -4
  90. package/tokens-next-private/scss/functional/themes/light-colorblind.scss +5 -4
  91. package/tokens-next-private/scss/functional/themes/light-high-contrast.scss +5 -4
  92. package/tokens-next-private/scss/functional/themes/light-tritanopia.scss +5 -4
  93. package/tokens-next-private/scss/functional/themes/light.scss +5 -4
  94. package/tokens-v2-private/css/tokens/base/size/size.css +1 -1
  95. package/tokens-v2-private/css/tokens/base/typography/typography.css +1 -1
  96. package/tokens-v2-private/css/tokens/functional/size/border.css +1 -1
  97. package/tokens-v2-private/css/tokens/functional/size/breakpoints.css +1 -1
  98. package/tokens-v2-private/css/tokens/functional/size/size-coarse.css +1 -1
  99. package/tokens-v2-private/css/tokens/functional/size/size-fine.css +1 -1
  100. package/tokens-v2-private/css/tokens/functional/size/size.css +1 -1
  101. package/tokens-v2-private/css/tokens/functional/typography/typography.css +1 -1
  102. package/tokens-v2-private/js/module/tokens/base/size/size.js +1 -1
  103. package/tokens-v2-private/js/module/tokens/base/typography/typography.js +1 -1
  104. package/tokens-v2-private/js/module/tokens/functional/size/border.js +1 -1
  105. package/tokens-v2-private/js/module/tokens/functional/size/breakpoints.js +1 -1
  106. package/tokens-v2-private/js/module/tokens/functional/size/size-coarse.js +1 -1
  107. package/tokens-v2-private/js/module/tokens/functional/size/size-fine.js +1 -1
  108. package/tokens-v2-private/js/module/tokens/functional/size/size.js +1 -1
  109. package/tokens-v2-private/js/module/tokens/functional/size/viewport.js +1 -1
  110. package/tokens-v2-private/js/module/tokens/functional/typography/typography.js +1 -1
  111. package/tokens-v2-private/js/tokens/base/size/size.js +1 -1
  112. package/tokens-v2-private/js/tokens/base/typography/typography.js +1 -1
  113. package/tokens-v2-private/js/tokens/functional/size/border.js +1 -1
  114. package/tokens-v2-private/js/tokens/functional/size/breakpoints.js +1 -1
  115. package/tokens-v2-private/js/tokens/functional/size/size-coarse.js +1 -1
  116. package/tokens-v2-private/js/tokens/functional/size/size-fine.js +1 -1
  117. package/tokens-v2-private/js/tokens/functional/size/size.js +1 -1
  118. package/tokens-v2-private/js/tokens/functional/size/viewport.js +1 -1
  119. package/tokens-v2-private/js/tokens/functional/typography/typography.js +1 -1
  120. package/tokens-v2-private/scss/tokens/base/size/size.scss +1 -1
  121. package/tokens-v2-private/scss/tokens/base/typography/typography.scss +1 -1
  122. package/tokens-v2-private/scss/tokens/functional/size/border.scss +1 -1
  123. package/tokens-v2-private/scss/tokens/functional/size/breakpoints.scss +1 -1
  124. package/tokens-v2-private/scss/tokens/functional/size/size-coarse.scss +1 -1
  125. package/tokens-v2-private/scss/tokens/functional/size/size-fine.scss +1 -1
  126. package/tokens-v2-private/scss/tokens/functional/size/size.scss +1 -1
  127. package/tokens-v2-private/scss/tokens/functional/size/viewport.scss +1 -1
  128. package/tokens-v2-private/scss/tokens/functional/typography/typography.scss +1 -1
  129. package/tokens-v2-private/ts/tokens/base/size/size.d.ts +1 -1
  130. package/tokens-v2-private/ts/tokens/base/size/size.js +1 -1
  131. package/tokens-v2-private/ts/tokens/base/typography/typography.d.ts +1 -1
  132. package/tokens-v2-private/ts/tokens/base/typography/typography.js +1 -1
  133. package/tokens-v2-private/ts/tokens/functional/size/border.d.ts +1 -1
  134. package/tokens-v2-private/ts/tokens/functional/size/border.js +1 -1
  135. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.d.ts +1 -1
  136. package/tokens-v2-private/ts/tokens/functional/size/breakpoints.js +1 -1
  137. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.d.ts +1 -1
  138. package/tokens-v2-private/ts/tokens/functional/size/size-coarse.js +1 -1
  139. package/tokens-v2-private/ts/tokens/functional/size/size-fine.d.ts +1 -1
  140. package/tokens-v2-private/ts/tokens/functional/size/size-fine.js +1 -1
  141. package/tokens-v2-private/ts/tokens/functional/size/size.d.ts +1 -1
  142. package/tokens-v2-private/ts/tokens/functional/size/size.js +1 -1
  143. package/tokens-v2-private/ts/tokens/functional/size/viewport.d.ts +1 -1
  144. package/tokens-v2-private/ts/tokens/functional/size/viewport.js +1 -1
  145. package/tokens-v2-private/ts/tokens/functional/typography/typography.d.ts +1 -1
  146. package/tokens-v2-private/ts/tokens/functional/typography/typography.js +1 -1
package/dist/scss/functional/themes/dark-colorblind.scss CHANGED
@@ -177,6 +177,7 @@ $buttonCounter-danger-fgColor-disabled: #db6d2880;
177
177
  $focus-outlineColor: #1f6feb;
178
178
  $menu-bgColor-active: #161b22;
179
179
  $overlay-bgColor: #161b22;
180
+ $overlay-borderColor: #30363d;
180
181
  $overlay-backdrop-bgColor: #161b2266;
181
182
  $selectMenu-borderColor: #484f58;
182
183
  $selectMenu-bgColor-active: #0c2d6b;
@@ -399,8 +400,8 @@ $shadow-inset: inset 0px 1px 0px 0px #0104093d;
399
400
  $shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
400
401
  $shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
401
402
  $shadow-resting-medium: 0px 3px 6px 0px #010409cc;
402
- $shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
403
- $shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
404
- $shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
405
- $shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
403
+ $shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
404
+ $shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
405
+ $shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
406
+ $shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
406
407
  $outline-focus: #1f6feb solid 2px;
package/dist/scss/functional/themes/dark-dimmed.scss CHANGED
@@ -177,6 +177,7 @@ $buttonCounter-danger-fgColor-disabled: #e5534b80;
177
177
  $focus-outlineColor: #316dca;
178
178
  $menu-bgColor-active: #2d333b;
179
179
  $overlay-bgColor: #2d333b;
180
+ $overlay-borderColor: #444c56;
180
181
  $overlay-backdrop-bgColor: #2d333b66;
181
182
  $selectMenu-borderColor: #545d68;
182
183
  $selectMenu-bgColor-active: #143d79;
@@ -399,8 +400,8 @@ $shadow-inset: inset 0px 1px 0px 0px #1c21283d;
399
400
  $shadow-resting-xsmall: 0px 1px 0px 0px #1c2128cc;
400
401
  $shadow-resting-small: 0px 1px 0px 0px #1c212866, 0px 1px 3px 0px #1c212866;
401
402
  $shadow-resting-medium: 0px 3px 6px 0px #1c2128cc;
402
- $shadow-floating-small: 0px 0px 0px 1px #2d333b, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
403
- $shadow-floating-medium: 0px 0px 0px 1px #2d333b, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
404
- $shadow-floating-large: 0px 0px 0px 1px #2d333b, 0px 24px 48px 0px #1c2128;
405
- $shadow-floating-xlarge: 0px 0px 0px 1px #2d333b, 0px 32px 64px 0px #1c2128;
403
+ $shadow-floating-small: 0px 0px 0px 1px #444c56, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
404
+ $shadow-floating-medium: 0px 0px 0px 1px #444c56, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
405
+ $shadow-floating-large: 0px 0px 0px 1px #444c56, 0px 24px 48px 0px #1c2128;
406
+ $shadow-floating-xlarge: 0px 0px 0px 1px #444c56, 0px 32px 64px 0px #1c2128;
406
407
  $outline-focus: #316dca solid 2px;
package/dist/scss/functional/themes/dark-high-contrast.scss CHANGED
@@ -177,6 +177,7 @@ $buttonCounter-danger-fgColor-disabled: #ff808080;
177
177
  $focus-outlineColor: #409eff;
178
178
  $menu-bgColor-active: #272b33;
179
179
  $overlay-bgColor: #272b33;
180
+ $overlay-borderColor: #7a828e;
180
181
  $overlay-backdrop-bgColor: #272b3366;
181
182
  $selectMenu-borderColor: #7a828e;
182
183
  $selectMenu-bgColor-active: #1e60d5;
@@ -399,8 +400,8 @@ $shadow-inset: inset 0px 1px 0px 0px #0104093d;
399
400
  $shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
400
401
  $shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
401
402
  $shadow-resting-medium: 0px 3px 6px 0px #010409cc;
402
- $shadow-floating-small: 0px 0px 0px 1px #272b33, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
403
- $shadow-floating-medium: 0px 0px 0px 1px #272b33, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
404
- $shadow-floating-large: 0px 0px 0px 1px #272b33, 0px 24px 48px 0px #010409;
405
- $shadow-floating-xlarge: 0px 0px 0px 1px #272b33, 0px 32px 64px 0px #010409;
403
+ $shadow-floating-small: 0px 0px 0px 1px #7a828e, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
404
+ $shadow-floating-medium: 0px 0px 0px 1px #7a828e, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
405
+ $shadow-floating-large: 0px 0px 0px 1px #7a828e, 0px 24px 48px 0px #010409;
406
+ $shadow-floating-xlarge: 0px 0px 0px 1px #7a828e, 0px 32px 64px 0px #010409;
406
407
  $outline-focus: #409eff solid 2px;
package/dist/scss/functional/themes/dark-tritanopia.scss CHANGED
@@ -177,6 +177,7 @@ $buttonCounter-danger-fgColor-disabled: #f8514980;
177
177
  $focus-outlineColor: #1f6feb;
178
178
  $menu-bgColor-active: #161b22;
179
179
  $overlay-bgColor: #161b22;
180
+ $overlay-borderColor: #30363d;
180
181
  $overlay-backdrop-bgColor: #161b2266;
181
182
  $selectMenu-borderColor: #484f58;
182
183
  $selectMenu-bgColor-active: #0c2d6b;
@@ -399,8 +400,8 @@ $shadow-inset: inset 0px 1px 0px 0px #0104093d;
399
400
  $shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
400
401
  $shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
401
402
  $shadow-resting-medium: 0px 3px 6px 0px #010409cc;
402
- $shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
403
- $shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
404
- $shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
405
- $shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
403
+ $shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
404
+ $shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
405
+ $shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
406
+ $shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
406
407
  $outline-focus: #1f6feb solid 2px;
package/dist/scss/functional/themes/dark.scss CHANGED
@@ -177,6 +177,7 @@ $buttonCounter-danger-fgColor-disabled: #f8514980;
177
177
  $focus-outlineColor: #1f6feb;
178
178
  $menu-bgColor-active: #161b22;
179
179
  $overlay-bgColor: #161b22;
180
+ $overlay-borderColor: #30363d;
180
181
  $overlay-backdrop-bgColor: #161b2266;
181
182
  $selectMenu-borderColor: #484f58;
182
183
  $selectMenu-bgColor-active: #0c2d6b;
@@ -399,8 +400,8 @@ $shadow-inset: inset 0px 1px 0px 0px #0104093d;
399
400
  $shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
400
401
  $shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
401
402
  $shadow-resting-medium: 0px 3px 6px 0px #010409cc;
402
- $shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
403
- $shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
404
- $shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
405
- $shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
403
+ $shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
404
+ $shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
405
+ $shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
406
+ $shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
406
407
  $outline-focus: #1f6feb solid 2px;
package/dist/scss/functional/themes/light-colorblind.scss CHANGED
@@ -178,6 +178,7 @@ $focus-outlineColor: #0969da;
178
178
  $focus-outline: #0969da solid 2px;
179
179
  $menu-bgColor-active: #ffffff00;
180
180
  $overlay-bgColor: #ffffff;
181
+ $overlay-borderColor: #ffffff00;
181
182
  $overlay-backdrop-bgColor: #8c959f33;
182
183
  $selectMenu-borderColor: #ffffff00;
183
184
  $selectMenu-bgColor-active: #b6e3ff;
@@ -400,7 +401,7 @@ $shadow-inset: inset 0px 1px 0px 0px #1f23280a;
400
401
  $shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
401
402
  $shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
402
403
  $shadow-resting-medium: 0px 3px 6px 0px #424a531f;
403
- $shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
404
- $shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
405
- $shadow-floating-large: 0px 40px 80px 0px #424a533d;
406
- $shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
404
+ $shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
405
+ $shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
406
+ $shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
407
+ $shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
package/dist/scss/functional/themes/light-high-contrast.scss CHANGED
@@ -178,6 +178,7 @@ $focus-outlineColor: #0349b4;
178
178
  $focus-outline: #0349b4 solid 2px;
179
179
  $menu-bgColor-active: #ffffff00;
180
180
  $overlay-bgColor: #ffffff;
181
+ $overlay-borderColor: #20252c;
181
182
  $overlay-backdrop-bgColor: #88929d33;
182
183
  $selectMenu-borderColor: #ffffff00;
183
184
  $selectMenu-bgColor-active: #9cd7ff;
@@ -400,7 +401,7 @@ $shadow-inset: inset 0px 1px 0px 0px #0104090a;
400
401
  $shadow-resting-xsmall: 0px 1px 0px 0px #0104091a;
401
402
  $shadow-resting-small: 0px 1px 0px 0px #0104090f, 0px 1px 3px 0px #01040914;
402
403
  $shadow-resting-medium: 0px 3px 6px 0px #343b431f;
403
- $shadow-floating-small: 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
404
- $shadow-floating-medium: 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
405
- $shadow-floating-large: 0px 40px 80px 0px #343b433d;
406
- $shadow-floating-xlarge: 0px 56px 112px 0px #343b4352;
404
+ $shadow-floating-small: 0px 0px 0px 1px #20252c, 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
405
+ $shadow-floating-medium: 0px 0px 0px 1px #20252c, 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
406
+ $shadow-floating-large: 0px 0px 0px 1px #20252c, 0px 40px 80px 0px #343b433d;
407
+ $shadow-floating-xlarge: 0px 0px 0px 1px #20252c, 0px 56px 112px 0px #343b4352;
package/dist/scss/functional/themes/light-tritanopia.scss CHANGED
@@ -178,6 +178,7 @@ $focus-outlineColor: #0969da;
178
178
  $focus-outline: #0969da solid 2px;
179
179
  $menu-bgColor-active: #ffffff00;
180
180
  $overlay-bgColor: #ffffff;
181
+ $overlay-borderColor: #ffffff00;
181
182
  $overlay-backdrop-bgColor: #8c959f33;
182
183
  $selectMenu-borderColor: #ffffff00;
183
184
  $selectMenu-bgColor-active: #b6e3ff;
@@ -400,7 +401,7 @@ $shadow-inset: inset 0px 1px 0px 0px #1f23280a;
400
401
  $shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
401
402
  $shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
402
403
  $shadow-resting-medium: 0px 3px 6px 0px #424a531f;
403
- $shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
404
- $shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
405
- $shadow-floating-large: 0px 40px 80px 0px #424a533d;
406
- $shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
404
+ $shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
405
+ $shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
406
+ $shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
407
+ $shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
package/dist/scss/functional/themes/light.scss CHANGED
@@ -178,6 +178,7 @@ $focus-outlineColor: #0969da;
178
178
  $focus-outline: #0969da solid 2px;
179
179
  $menu-bgColor-active: #ffffff00;
180
180
  $overlay-bgColor: #ffffff;
181
+ $overlay-borderColor: #ffffff00;
181
182
  $overlay-backdrop-bgColor: #8c959f33;
182
183
  $selectMenu-borderColor: #ffffff00;
183
184
  $selectMenu-bgColor-active: #b6e3ff;
@@ -400,7 +401,7 @@ $shadow-inset: inset 0px 1px 0px 0px #1f23280a;
400
401
  $shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
401
402
  $shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
402
403
  $shadow-resting-medium: 0px 3px 6px 0px #424a531f;
403
- $shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
404
- $shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
405
- $shadow-floating-large: 0px 40px 80px 0px #424a533d;
406
- $shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
404
+ $shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
405
+ $shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
406
+ $shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
407
+ $shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/primitives",
3
- "version": "7.15.8",
3
+ "version": "7.15.9-rc.f6594ef",
4
4
  "description": "Typography, spacing, and color primitives for Primer design system",
5
5
  "files": [
6
6
  "dist",
package/tokens-next-private/css/functional/themes/dark-colorblind.css CHANGED
@@ -181,6 +181,7 @@
181
181
  --focus-outlineColor: #1f6feb;
182
182
  --menu-bgColor-active: #161b22;
183
183
  --overlay-bgColor: #161b22;
184
+ --overlay-borderColor: #30363d;
184
185
  --overlay-backdrop-bgColor: #161b2266;
185
186
  --selectMenu-borderColor: #484f58;
186
187
  --selectMenu-bgColor-active: #0c2d6b;
@@ -403,10 +404,10 @@
403
404
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
404
405
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
405
406
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
406
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
407
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
408
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
409
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
407
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
408
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
409
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
410
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
410
411
  --outline-focus: #1f6feb solid 2px;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
@@ -591,6 +592,7 @@
591
592
  --focus-outlineColor: #1f6feb;
592
593
  --menu-bgColor-active: #161b22;
593
594
  --overlay-bgColor: #161b22;
595
+ --overlay-borderColor: #30363d;
594
596
  --overlay-backdrop-bgColor: #161b2266;
595
597
  --selectMenu-borderColor: #484f58;
596
598
  --selectMenu-bgColor-active: #0c2d6b;
@@ -813,10 +815,10 @@
813
815
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
814
816
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
815
817
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
816
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
817
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
818
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
819
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
818
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
819
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
820
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
821
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
820
822
  --outline-focus: #1f6feb solid 2px;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/dark-dimmed.css CHANGED
@@ -181,6 +181,7 @@
181
181
  --focus-outlineColor: #316dca;
182
182
  --menu-bgColor-active: #2d333b;
183
183
  --overlay-bgColor: #2d333b;
184
+ --overlay-borderColor: #444c56;
184
185
  --overlay-backdrop-bgColor: #2d333b66;
185
186
  --selectMenu-borderColor: #545d68;
186
187
  --selectMenu-bgColor-active: #143d79;
@@ -403,10 +404,10 @@
403
404
  --shadow-resting-xsmall: 0px 1px 0px 0px #1c2128cc;
404
405
  --shadow-resting-small: 0px 1px 0px 0px #1c212866, 0px 1px 3px 0px #1c212866;
405
406
  --shadow-resting-medium: 0px 3px 6px 0px #1c2128cc;
406
- --shadow-floating-small: 0px 0px 0px 1px #2d333b, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
407
- --shadow-floating-medium: 0px 0px 0px 1px #2d333b, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
408
- --shadow-floating-large: 0px 0px 0px 1px #2d333b, 0px 24px 48px 0px #1c2128;
409
- --shadow-floating-xlarge: 0px 0px 0px 1px #2d333b, 0px 32px 64px 0px #1c2128;
407
+ --shadow-floating-small: 0px 0px 0px 1px #444c56, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
408
+ --shadow-floating-medium: 0px 0px 0px 1px #444c56, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
409
+ --shadow-floating-large: 0px 0px 0px 1px #444c56, 0px 24px 48px 0px #1c2128;
410
+ --shadow-floating-xlarge: 0px 0px 0px 1px #444c56, 0px 32px 64px 0px #1c2128;
410
411
  --outline-focus: #316dca solid 2px;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
@@ -591,6 +592,7 @@
591
592
  --focus-outlineColor: #316dca;
592
593
  --menu-bgColor-active: #2d333b;
593
594
  --overlay-bgColor: #2d333b;
595
+ --overlay-borderColor: #444c56;
594
596
  --overlay-backdrop-bgColor: #2d333b66;
595
597
  --selectMenu-borderColor: #545d68;
596
598
  --selectMenu-bgColor-active: #143d79;
@@ -813,10 +815,10 @@
813
815
  --shadow-resting-xsmall: 0px 1px 0px 0px #1c2128cc;
814
816
  --shadow-resting-small: 0px 1px 0px 0px #1c212866, 0px 1px 3px 0px #1c212866;
815
817
  --shadow-resting-medium: 0px 3px 6px 0px #1c2128cc;
816
- --shadow-floating-small: 0px 0px 0px 1px #2d333b, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
817
- --shadow-floating-medium: 0px 0px 0px 1px #2d333b, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
818
- --shadow-floating-large: 0px 0px 0px 1px #2d333b, 0px 24px 48px 0px #1c2128;
819
- --shadow-floating-xlarge: 0px 0px 0px 1px #2d333b, 0px 32px 64px 0px #1c2128;
818
+ --shadow-floating-small: 0px 0px 0px 1px #444c56, 0px 6px 12px -3px #1c212866, 0px 6px 18px 0px #1c212866;
819
+ --shadow-floating-medium: 0px 0px 0px 1px #444c56, 0px 8px 16px -4px #1c212866, 0px 4px 32px -4px #1c212866, 0px 24px 48px -12px #1c212866, 0px 48px 96px -24px #1c212866;
820
+ --shadow-floating-large: 0px 0px 0px 1px #444c56, 0px 24px 48px 0px #1c2128;
821
+ --shadow-floating-xlarge: 0px 0px 0px 1px #444c56, 0px 32px 64px 0px #1c2128;
820
822
  --outline-focus: #316dca solid 2px;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/dark-high-contrast.css CHANGED
@@ -181,6 +181,7 @@
181
181
  --focus-outlineColor: #409eff;
182
182
  --menu-bgColor-active: #272b33;
183
183
  --overlay-bgColor: #272b33;
184
+ --overlay-borderColor: #7a828e;
184
185
  --overlay-backdrop-bgColor: #272b3366;
185
186
  --selectMenu-borderColor: #7a828e;
186
187
  --selectMenu-bgColor-active: #1e60d5;
@@ -403,10 +404,10 @@
403
404
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
404
405
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
405
406
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
406
- --shadow-floating-small: 0px 0px 0px 1px #272b33, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
407
- --shadow-floating-medium: 0px 0px 0px 1px #272b33, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
408
- --shadow-floating-large: 0px 0px 0px 1px #272b33, 0px 24px 48px 0px #010409;
409
- --shadow-floating-xlarge: 0px 0px 0px 1px #272b33, 0px 32px 64px 0px #010409;
407
+ --shadow-floating-small: 0px 0px 0px 1px #7a828e, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
408
+ --shadow-floating-medium: 0px 0px 0px 1px #7a828e, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
409
+ --shadow-floating-large: 0px 0px 0px 1px #7a828e, 0px 24px 48px 0px #010409;
410
+ --shadow-floating-xlarge: 0px 0px 0px 1px #7a828e, 0px 32px 64px 0px #010409;
410
411
  --outline-focus: #409eff solid 2px;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
@@ -591,6 +592,7 @@
591
592
  --focus-outlineColor: #409eff;
592
593
  --menu-bgColor-active: #272b33;
593
594
  --overlay-bgColor: #272b33;
595
+ --overlay-borderColor: #7a828e;
594
596
  --overlay-backdrop-bgColor: #272b3366;
595
597
  --selectMenu-borderColor: #7a828e;
596
598
  --selectMenu-bgColor-active: #1e60d5;
@@ -813,10 +815,10 @@
813
815
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
814
816
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
815
817
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
816
- --shadow-floating-small: 0px 0px 0px 1px #272b33, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
817
- --shadow-floating-medium: 0px 0px 0px 1px #272b33, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
818
- --shadow-floating-large: 0px 0px 0px 1px #272b33, 0px 24px 48px 0px #010409;
819
- --shadow-floating-xlarge: 0px 0px 0px 1px #272b33, 0px 32px 64px 0px #010409;
818
+ --shadow-floating-small: 0px 0px 0px 1px #7a828e, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
819
+ --shadow-floating-medium: 0px 0px 0px 1px #7a828e, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
820
+ --shadow-floating-large: 0px 0px 0px 1px #7a828e, 0px 24px 48px 0px #010409;
821
+ --shadow-floating-xlarge: 0px 0px 0px 1px #7a828e, 0px 32px 64px 0px #010409;
820
822
  --outline-focus: #409eff solid 2px;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/dark-tritanopia.css CHANGED
@@ -181,6 +181,7 @@
181
181
  --focus-outlineColor: #1f6feb;
182
182
  --menu-bgColor-active: #161b22;
183
183
  --overlay-bgColor: #161b22;
184
+ --overlay-borderColor: #30363d;
184
185
  --overlay-backdrop-bgColor: #161b2266;
185
186
  --selectMenu-borderColor: #484f58;
186
187
  --selectMenu-bgColor-active: #0c2d6b;
@@ -403,10 +404,10 @@
403
404
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
404
405
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
405
406
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
406
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
407
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
408
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
409
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
407
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
408
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
409
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
410
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
410
411
  --outline-focus: #1f6feb solid 2px;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
@@ -591,6 +592,7 @@
591
592
  --focus-outlineColor: #1f6feb;
592
593
  --menu-bgColor-active: #161b22;
593
594
  --overlay-bgColor: #161b22;
595
+ --overlay-borderColor: #30363d;
594
596
  --overlay-backdrop-bgColor: #161b2266;
595
597
  --selectMenu-borderColor: #484f58;
596
598
  --selectMenu-bgColor-active: #0c2d6b;
@@ -813,10 +815,10 @@
813
815
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
814
816
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
815
817
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
816
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
817
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
818
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
819
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
818
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
819
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
820
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
821
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
820
822
  --outline-focus: #1f6feb solid 2px;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/dark.css CHANGED
@@ -181,6 +181,7 @@
181
181
  --focus-outlineColor: #1f6feb;
182
182
  --menu-bgColor-active: #161b22;
183
183
  --overlay-bgColor: #161b22;
184
+ --overlay-borderColor: #30363d;
184
185
  --overlay-backdrop-bgColor: #161b2266;
185
186
  --selectMenu-borderColor: #484f58;
186
187
  --selectMenu-bgColor-active: #0c2d6b;
@@ -403,10 +404,10 @@
403
404
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
404
405
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
405
406
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
406
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
407
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
408
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
409
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
407
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
408
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
409
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
410
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
410
411
  --outline-focus: #1f6feb solid 2px;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
@@ -591,6 +592,7 @@
591
592
  --focus-outlineColor: #1f6feb;
592
593
  --menu-bgColor-active: #161b22;
593
594
  --overlay-bgColor: #161b22;
595
+ --overlay-borderColor: #30363d;
594
596
  --overlay-backdrop-bgColor: #161b2266;
595
597
  --selectMenu-borderColor: #484f58;
596
598
  --selectMenu-bgColor-active: #0c2d6b;
@@ -813,10 +815,10 @@
813
815
  --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
814
816
  --shadow-resting-small: 0px 1px 0px 0px #01040966, 0px 1px 3px 0px #01040966;
815
817
  --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
816
- --shadow-floating-small: 0px 0px 0px 1px #161b22, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
817
- --shadow-floating-medium: 0px 0px 0px 1px #161b22, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
818
- --shadow-floating-large: 0px 0px 0px 1px #161b22, 0px 24px 48px 0px #010409;
819
- --shadow-floating-xlarge: 0px 0px 0px 1px #161b22, 0px 32px 64px 0px #010409;
818
+ --shadow-floating-small: 0px 0px 0px 1px #30363d, 0px 6px 12px -3px #01040966, 0px 6px 18px 0px #01040966;
819
+ --shadow-floating-medium: 0px 0px 0px 1px #30363d, 0px 8px 16px -4px #01040966, 0px 4px 32px -4px #01040966, 0px 24px 48px -12px #01040966, 0px 48px 96px -24px #01040966;
820
+ --shadow-floating-large: 0px 0px 0px 1px #30363d, 0px 24px 48px 0px #010409;
821
+ --shadow-floating-xlarge: 0px 0px 0px 1px #30363d, 0px 32px 64px 0px #010409;
820
822
  --outline-focus: #1f6feb solid 2px;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/light-colorblind.css CHANGED
@@ -182,6 +182,7 @@
182
182
  --focus-outline: #0969da solid 2px;
183
183
  --menu-bgColor-active: #ffffff00;
184
184
  --overlay-bgColor: #ffffff;
185
+ --overlay-borderColor: #ffffff00;
185
186
  --overlay-backdrop-bgColor: #8c959f33;
186
187
  --selectMenu-borderColor: #ffffff00;
187
188
  --selectMenu-bgColor-active: #b6e3ff;
@@ -404,10 +405,10 @@
404
405
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
405
406
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
406
407
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
407
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
408
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
409
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
410
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
408
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
409
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
410
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
411
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
413
414
  [data-color-mode="auto"][data-dark-theme="light_colorblind"],
@@ -592,6 +593,7 @@
592
593
  --focus-outline: #0969da solid 2px;
593
594
  --menu-bgColor-active: #ffffff00;
594
595
  --overlay-bgColor: #ffffff;
596
+ --overlay-borderColor: #ffffff00;
595
597
  --overlay-backdrop-bgColor: #8c959f33;
596
598
  --selectMenu-borderColor: #ffffff00;
597
599
  --selectMenu-bgColor-active: #b6e3ff;
@@ -814,9 +816,9 @@
814
816
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
815
817
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
816
818
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
817
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
818
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
819
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
820
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
819
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
820
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
821
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
822
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/light-high-contrast.css CHANGED
@@ -182,6 +182,7 @@
182
182
  --focus-outline: #0349b4 solid 2px;
183
183
  --menu-bgColor-active: #ffffff00;
184
184
  --overlay-bgColor: #ffffff;
185
+ --overlay-borderColor: #20252c;
185
186
  --overlay-backdrop-bgColor: #88929d33;
186
187
  --selectMenu-borderColor: #ffffff00;
187
188
  --selectMenu-bgColor-active: #9cd7ff;
@@ -404,10 +405,10 @@
404
405
  --shadow-resting-xsmall: 0px 1px 0px 0px #0104091a;
405
406
  --shadow-resting-small: 0px 1px 0px 0px #0104090f, 0px 1px 3px 0px #01040914;
406
407
  --shadow-resting-medium: 0px 3px 6px 0px #343b431f;
407
- --shadow-floating-small: 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
408
- --shadow-floating-medium: 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
409
- --shadow-floating-large: 0px 40px 80px 0px #343b433d;
410
- --shadow-floating-xlarge: 0px 56px 112px 0px #343b4352;
408
+ --shadow-floating-small: 0px 0px 0px 1px #20252c, 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
409
+ --shadow-floating-medium: 0px 0px 0px 1px #20252c, 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
410
+ --shadow-floating-large: 0px 0px 0px 1px #20252c, 0px 40px 80px 0px #343b433d;
411
+ --shadow-floating-xlarge: 0px 0px 0px 1px #20252c, 0px 56px 112px 0px #343b4352;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
413
414
  [data-color-mode="auto"][data-dark-theme="light_high_contrast"],
@@ -592,6 +593,7 @@
592
593
  --focus-outline: #0349b4 solid 2px;
593
594
  --menu-bgColor-active: #ffffff00;
594
595
  --overlay-bgColor: #ffffff;
596
+ --overlay-borderColor: #20252c;
595
597
  --overlay-backdrop-bgColor: #88929d33;
596
598
  --selectMenu-borderColor: #ffffff00;
597
599
  --selectMenu-bgColor-active: #9cd7ff;
@@ -814,9 +816,9 @@
814
816
  --shadow-resting-xsmall: 0px 1px 0px 0px #0104091a;
815
817
  --shadow-resting-small: 0px 1px 0px 0px #0104090f, 0px 1px 3px 0px #01040914;
816
818
  --shadow-resting-medium: 0px 3px 6px 0px #343b431f;
817
- --shadow-floating-small: 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
818
- --shadow-floating-medium: 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
819
- --shadow-floating-large: 0px 40px 80px 0px #343b433d;
820
- --shadow-floating-xlarge: 0px 56px 112px 0px #343b4352;
819
+ --shadow-floating-small: 0px 0px 0px 1px #20252c, 0px 6px 12px -3px #343b430a, 0px 6px 18px 0px #343b431f;
820
+ --shadow-floating-medium: 0px 0px 0px 1px #20252c, 0px 8px 16px -4px #343b4314, 0px 4px 32px -4px #343b4314, 0px 24px 48px -12px #343b4314, 0px 48px 96px -24px #343b4314;
821
+ --shadow-floating-large: 0px 0px 0px 1px #20252c, 0px 40px 80px 0px #343b433d;
822
+ --shadow-floating-xlarge: 0px 0px 0px 1px #20252c, 0px 56px 112px 0px #343b4352;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/light-tritanopia.css CHANGED
@@ -182,6 +182,7 @@
182
182
  --focus-outline: #0969da solid 2px;
183
183
  --menu-bgColor-active: #ffffff00;
184
184
  --overlay-bgColor: #ffffff;
185
+ --overlay-borderColor: #ffffff00;
185
186
  --overlay-backdrop-bgColor: #8c959f33;
186
187
  --selectMenu-borderColor: #ffffff00;
187
188
  --selectMenu-bgColor-active: #b6e3ff;
@@ -404,10 +405,10 @@
404
405
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
405
406
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
406
407
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
407
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
408
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
409
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
410
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
408
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
409
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
410
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
411
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
413
414
  [data-color-mode="auto"][data-dark-theme="light_tritanopia"],
@@ -592,6 +593,7 @@
592
593
  --focus-outline: #0969da solid 2px;
593
594
  --menu-bgColor-active: #ffffff00;
594
595
  --overlay-bgColor: #ffffff;
596
+ --overlay-borderColor: #ffffff00;
595
597
  --overlay-backdrop-bgColor: #8c959f33;
596
598
  --selectMenu-borderColor: #ffffff00;
597
599
  --selectMenu-bgColor-active: #b6e3ff;
@@ -814,9 +816,9 @@
814
816
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
815
817
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
816
818
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
817
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
818
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
819
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
820
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
819
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
820
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
821
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
822
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
821
823
  }
822
824
  }
package/tokens-next-private/css/functional/themes/light.css CHANGED
@@ -182,6 +182,7 @@
182
182
  --focus-outline: #0969da solid 2px;
183
183
  --menu-bgColor-active: #ffffff00;
184
184
  --overlay-bgColor: #ffffff;
185
+ --overlay-borderColor: #ffffff00;
185
186
  --overlay-backdrop-bgColor: #8c959f33;
186
187
  --selectMenu-borderColor: #ffffff00;
187
188
  --selectMenu-bgColor-active: #b6e3ff;
@@ -404,10 +405,10 @@
404
405
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
405
406
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
406
407
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
407
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
408
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
409
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
410
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
408
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
409
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
410
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
411
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
411
412
  }
412
413
  @media (prefers-color-scheme: dark) {
413
414
  [data-color-mode="auto"][data-dark-theme="light"],
@@ -592,6 +593,7 @@
592
593
  --focus-outline: #0969da solid 2px;
593
594
  --menu-bgColor-active: #ffffff00;
594
595
  --overlay-bgColor: #ffffff;
596
+ --overlay-borderColor: #ffffff00;
595
597
  --overlay-backdrop-bgColor: #8c959f33;
596
598
  --selectMenu-borderColor: #ffffff00;
597
599
  --selectMenu-bgColor-active: #b6e3ff;
@@ -814,9 +816,9 @@
814
816
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
815
817
  --shadow-resting-small: 0px 1px 0px 0px #1f23280f, 0px 1px 3px 0px #1f232814;
816
818
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
817
- --shadow-floating-small: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
818
- --shadow-floating-medium: 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
819
- --shadow-floating-large: 0px 40px 80px 0px #424a533d;
820
- --shadow-floating-xlarge: 0px 56px 112px 0px #424a5352;
819
+ --shadow-floating-small: 0px 0px 0px 1px #ffffff, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
820
+ --shadow-floating-medium: 0px 0px 0px 1px #ffffff, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
821
+ --shadow-floating-large: 0px 0px 0px 1px #ffffff, 0px 40px 80px 0px #424a533d;
822
+ --shadow-floating-xlarge: 0px 0px 0px 1px #ffffff, 0px 56px 112px 0px #424a5352;
821
823
  }
822
824
  }