@primer/primitives 10.7.0 → 10.8.0-rc.4b626bdd
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.
- package/dist/css/base/motion/motion.css +4 -4
- package/dist/css/functional/size/border.css +2 -2
- package/dist/css/functional/themes/dark-colorblind.css +2 -2
- package/dist/css/functional/themes/dark-high-contrast.css +2 -2
- package/dist/css/functional/themes/dark-tritanopia.css +2 -2
- package/dist/css/functional/themes/dark.css +2 -2
- package/dist/css/functional/typography/typography.css +11 -11
- package/dist/css/primitives.css +17 -17
- package/dist/docs/base/motion/motion.json +48 -32
- package/dist/docs/base/size/size.json +95 -76
- package/dist/docs/base/typography/typography.json +12 -8
- package/dist/docs/functional/size/border.json +42 -28
- package/dist/docs/functional/size/breakpoints.json +18 -12
- package/dist/docs/functional/size/size-coarse.json +9 -6
- package/dist/docs/functional/size/size-fine.json +9 -6
- package/dist/docs/functional/size/size.json +198 -132
- package/dist/docs/functional/size/viewport.json +18 -12
- package/dist/docs/functional/themes/dark-colorblind.json +3424 -2602
- package/dist/docs/functional/themes/dark-dimmed.json +3422 -2600
- package/dist/docs/functional/themes/dark-high-contrast.json +3424 -2602
- package/dist/docs/functional/themes/dark-tritanopia.json +3424 -2602
- package/dist/docs/functional/themes/dark.json +3424 -2602
- package/dist/docs/functional/themes/light-colorblind.json +3422 -2600
- package/dist/docs/functional/themes/light-high-contrast.json +3422 -2600
- package/dist/docs/functional/themes/light-tritanopia.json +3422 -2600
- package/dist/docs/functional/themes/light.json +3422 -2600
- package/dist/docs/functional/typography/typography.json +138 -92
- package/dist/figma/dimension/dimension.json +19 -19
- package/dist/figma/themes/dark-colorblind.json +479 -479
- package/dist/figma/themes/dark-dimmed.json +475 -475
- package/dist/figma/themes/dark-high-contrast.json +479 -479
- package/dist/figma/themes/dark-tritanopia.json +479 -479
- package/dist/figma/themes/dark.json +479 -479
- package/dist/figma/themes/light-colorblind.json +475 -475
- package/dist/figma/themes/light-high-contrast.json +475 -475
- package/dist/figma/themes/light-tritanopia.json +475 -475
- package/dist/figma/themes/light.json +475 -475
- package/dist/internalCss/dark-colorblind.css +6 -6
- package/dist/internalCss/dark-dimmed.css +4 -4
- package/dist/internalCss/dark-high-contrast.css +6 -6
- package/dist/internalCss/dark-tritanopia.css +6 -6
- package/dist/internalCss/dark.css +6 -6
- package/dist/internalCss/light-colorblind.css +4 -4
- package/dist/internalCss/light-high-contrast.css +4 -4
- package/dist/internalCss/light-tritanopia.css +4 -4
- package/dist/internalCss/light.css +4 -4
- package/dist/styleLint/base/motion/motion.json +64 -48
- package/dist/styleLint/base/size/size.json +114 -95
- package/dist/styleLint/base/typography/typography.json +16 -12
- package/dist/styleLint/functional/size/border.json +59 -45
- package/dist/styleLint/functional/size/breakpoints.json +24 -18
- package/dist/styleLint/functional/size/size-coarse.json +12 -9
- package/dist/styleLint/functional/size/size-fine.json +12 -9
- package/dist/styleLint/functional/size/size.json +264 -198
- package/dist/styleLint/functional/size/viewport.json +28 -22
- package/dist/styleLint/functional/themes/dark-colorblind.json +4248 -3426
- package/dist/styleLint/functional/themes/dark-dimmed.json +4246 -3424
- package/dist/styleLint/functional/themes/dark-high-contrast.json +4248 -3426
- package/dist/styleLint/functional/themes/dark-tritanopia.json +4248 -3426
- package/dist/styleLint/functional/themes/dark.json +4248 -3426
- package/dist/styleLint/functional/themes/light-colorblind.json +4246 -3424
- package/dist/styleLint/functional/themes/light-high-contrast.json +4246 -3424
- package/dist/styleLint/functional/themes/light-tritanopia.json +4246 -3424
- package/dist/styleLint/functional/themes/light.json +4246 -3424
- package/dist/styleLint/functional/typography/typography.json +184 -138
- package/package.json +2 -2
- package/src/tokens/base/size/size.json5 +19 -19
- package/src/tokens/component/overlay.json5 +0 -1
- package/src/tokens/functional/color/display.json5 +476 -286
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #df9e11;
|
|
290
290
|
--base-display-color-yellow-8: #edb431;
|
|
291
291
|
--base-display-color-yellow-9: #f0ca6a;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -362,7 +362,7 @@
|
|
|
362
362
|
--borderWidth-default: var(--borderWidth-thin);
|
|
363
363
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
364
364
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
365
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
365
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
366
366
|
--button-danger-bgColor-hover: var(--base-color-orange-6);
|
|
367
367
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
368
368
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -1066,7 +1066,7 @@
|
|
|
1066
1066
|
--fgColor-white: var(--base-color-neutral-13);
|
|
1067
1067
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
1068
1068
|
--header-fgColor-default: #ffffffb3;
|
|
1069
|
-
--overlay-bgColor: var(--
|
|
1069
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
1070
1070
|
--page-header-bgColor: var(--bgColor-default);
|
|
1071
1071
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
1072
1072
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #df9e11;
|
|
1422
1422
|
--base-display-color-yellow-8: #edb431;
|
|
1423
1423
|
--base-display-color-yellow-9: #f0ca6a;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1494,7 +1494,7 @@
|
|
|
1494
1494
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1495
1495
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1496
1496
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1497
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1497
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1498
1498
|
--button-danger-bgColor-hover: var(--base-color-orange-6);
|
|
1499
1499
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
1500
1500
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -2198,7 +2198,7 @@
|
|
|
2198
2198
|
--fgColor-white: var(--base-color-neutral-13);
|
|
2199
2199
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
2200
2200
|
--header-fgColor-default: #ffffffb3;
|
|
2201
|
-
--overlay-bgColor: var(--
|
|
2201
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
2202
2202
|
--page-header-bgColor: var(--bgColor-default);
|
|
2203
2203
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
2204
2204
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #df9e11;
|
|
290
290
|
--base-display-color-yellow-8: #edb431;
|
|
291
291
|
--base-display-color-yellow-9: #f0ca6a;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -369,7 +369,7 @@
|
|
|
369
369
|
--borderWidth-default: var(--borderWidth-thin);
|
|
370
370
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
371
371
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
372
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
372
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
373
373
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
374
374
|
--button-danger-borderColor-rest: var(--control-borderColor-rest);
|
|
375
375
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #df9e11;
|
|
1422
1422
|
--base-display-color-yellow-8: #edb431;
|
|
1423
1423
|
--base-display-color-yellow-9: #f0ca6a;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1501,7 +1501,7 @@
|
|
|
1501
1501
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1502
1502
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1503
1503
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1504
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1504
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1505
1505
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1506
1506
|
--button-danger-borderColor-rest: var(--control-borderColor-rest);
|
|
1507
1507
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #df9e11;
|
|
290
290
|
--base-display-color-yellow-8: #edb431;
|
|
291
291
|
--base-display-color-yellow-9: #f0ca6a;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -360,7 +360,7 @@
|
|
|
360
360
|
--borderWidth-default: var(--borderWidth-thin);
|
|
361
361
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
362
362
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
363
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
363
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
364
364
|
--button-danger-borderColor-active: var(--base-color-red-2);
|
|
365
365
|
--button-danger-borderColor-hover: var(--base-color-red-2);
|
|
366
366
|
--button-danger-fgColor-rest: var(--base-color-red-2);
|
|
@@ -1048,7 +1048,7 @@
|
|
|
1048
1048
|
--fgColor-white: var(--base-color-neutral-13);
|
|
1049
1049
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
1050
1050
|
--header-fgColor-default: #ffffffb3;
|
|
1051
|
-
--overlay-bgColor: var(--
|
|
1051
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
1052
1052
|
--overlay-borderColor: var(--borderColor-default);
|
|
1053
1053
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
1054
1054
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #df9e11;
|
|
1422
1422
|
--base-display-color-yellow-8: #edb431;
|
|
1423
1423
|
--base-display-color-yellow-9: #f0ca6a;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1492,7 +1492,7 @@
|
|
|
1492
1492
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1493
1493
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1494
1494
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1495
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1495
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1496
1496
|
--button-danger-borderColor-active: var(--base-color-red-2);
|
|
1497
1497
|
--button-danger-borderColor-hover: var(--base-color-red-2);
|
|
1498
1498
|
--button-danger-fgColor-rest: var(--base-color-red-2);
|
|
@@ -2180,7 +2180,7 @@
|
|
|
2180
2180
|
--fgColor-white: var(--base-color-neutral-13);
|
|
2181
2181
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
2182
2182
|
--header-fgColor-default: #ffffffb3;
|
|
2183
|
-
--overlay-bgColor: var(--
|
|
2183
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
2184
2184
|
--overlay-borderColor: var(--borderColor-default);
|
|
2185
2185
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
2186
2186
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -290,7 +290,7 @@
|
|
|
290
290
|
--base-display-color-yellow-8: #edb431;
|
|
291
291
|
--base-display-color-yellow-9: #f0ca6a;
|
|
292
292
|
--bgColor-sponsors-muted: #db61a21a;
|
|
293
|
-
--borderRadius-full: 624.9375rem;
|
|
293
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
294
294
|
--borderRadius-large: 0.75rem;
|
|
295
295
|
--borderRadius-medium: 0.375rem;
|
|
296
296
|
--borderRadius-small: 0.1875rem;
|
|
@@ -367,7 +367,7 @@
|
|
|
367
367
|
--borderWidth-default: var(--borderWidth-thin);
|
|
368
368
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
369
369
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
370
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
370
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
371
371
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
372
372
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
373
373
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -1067,7 +1067,7 @@
|
|
|
1067
1067
|
--fgColor-white: var(--base-color-neutral-13);
|
|
1068
1068
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
1069
1069
|
--header-fgColor-default: #ffffffb3;
|
|
1070
|
-
--overlay-bgColor: var(--
|
|
1070
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
1071
1071
|
--page-header-bgColor: var(--bgColor-default);
|
|
1072
1072
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
1073
1073
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -1422,7 +1422,7 @@
|
|
|
1422
1422
|
--base-display-color-yellow-8: #edb431;
|
|
1423
1423
|
--base-display-color-yellow-9: #f0ca6a;
|
|
1424
1424
|
--bgColor-sponsors-muted: #db61a21a;
|
|
1425
|
-
--borderRadius-full: 624.9375rem;
|
|
1425
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1426
1426
|
--borderRadius-large: 0.75rem;
|
|
1427
1427
|
--borderRadius-medium: 0.375rem;
|
|
1428
1428
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1499,7 +1499,7 @@
|
|
|
1499
1499
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1500
1500
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1501
1501
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1502
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1502
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1503
1503
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1504
1504
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
1505
1505
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -2199,7 +2199,7 @@
|
|
|
2199
2199
|
--fgColor-white: var(--base-color-neutral-13);
|
|
2200
2200
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
2201
2201
|
--header-fgColor-default: #ffffffb3;
|
|
2202
|
-
--overlay-bgColor: var(--
|
|
2202
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
2203
2203
|
--page-header-bgColor: var(--bgColor-default);
|
|
2204
2204
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
2205
2205
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #df9e11;
|
|
290
290
|
--base-display-color-yellow-8: #edb431;
|
|
291
291
|
--base-display-color-yellow-9: #f0ca6a;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -360,7 +360,7 @@
|
|
|
360
360
|
--borderWidth-default: var(--borderWidth-thin);
|
|
361
361
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
362
362
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
363
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
363
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
364
364
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
365
365
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
366
366
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -1066,7 +1066,7 @@
|
|
|
1066
1066
|
--fgColor-white: var(--base-color-neutral-13);
|
|
1067
1067
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
1068
1068
|
--header-fgColor-default: #ffffffb3;
|
|
1069
|
-
--overlay-bgColor: var(--
|
|
1069
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
1070
1070
|
--page-header-bgColor: var(--bgColor-default);
|
|
1071
1071
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
1072
1072
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #df9e11;
|
|
1422
1422
|
--base-display-color-yellow-8: #edb431;
|
|
1423
1423
|
--base-display-color-yellow-9: #f0ca6a;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1492,7 +1492,7 @@
|
|
|
1492
1492
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1493
1493
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1494
1494
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1495
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1495
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1496
1496
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1497
1497
|
--button-danger-shadow-selected: 0px 0px 0px 0px #000000;
|
|
1498
1498
|
--button-default-shadow-resting: 0px 0px 0px 0px #000000;
|
|
@@ -2198,7 +2198,7 @@
|
|
|
2198
2198
|
--fgColor-white: var(--base-color-neutral-13);
|
|
2199
2199
|
--focus-outlineColor: var(--borderColor-accent-emphasis);
|
|
2200
2200
|
--header-fgColor-default: #ffffffb3;
|
|
2201
|
-
--overlay-bgColor: var(--
|
|
2201
|
+
--overlay-bgColor: var(--base-color-neutral-0);
|
|
2202
2202
|
--page-header-bgColor: var(--bgColor-default);
|
|
2203
2203
|
--reactionButton-selected-fgColor-rest: var(--fgColor-link);
|
|
2204
2204
|
--selectMenu-borderColor: var(--borderColor-default);
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #704d00;
|
|
290
290
|
--base-display-color-yellow-8: #5c3d00;
|
|
291
291
|
--base-display-color-yellow-9: #422b00;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -361,7 +361,7 @@
|
|
|
361
361
|
--borderWidth-default: var(--borderWidth-thin);
|
|
362
362
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
363
363
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
364
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
364
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
365
365
|
--button-danger-bgColor-hover: var(--base-color-orange-6);
|
|
366
366
|
--button-danger-shadow-selected: inset 0px 1px 0px 0px #47170033;
|
|
367
367
|
--button-inactive-bgColor: var(--base-color-neutral-3);
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #704d00;
|
|
1422
1422
|
--base-display-color-yellow-8: #5c3d00;
|
|
1423
1423
|
--base-display-color-yellow-9: #422b00;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1493,7 +1493,7 @@
|
|
|
1493
1493
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1494
1494
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1495
1495
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1496
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1496
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1497
1497
|
--button-danger-bgColor-hover: var(--base-color-orange-6);
|
|
1498
1498
|
--button-danger-shadow-selected: inset 0px 1px 0px 0px #47170033;
|
|
1499
1499
|
--button-inactive-bgColor: var(--base-color-neutral-3);
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #704d00;
|
|
290
290
|
--base-display-color-yellow-8: #5c3d00;
|
|
291
291
|
--base-display-color-yellow-9: #422b00;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -362,7 +362,7 @@
|
|
|
362
362
|
--borderWidth-default: var(--borderWidth-thin);
|
|
363
363
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
364
364
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
365
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
365
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
366
366
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
367
367
|
--button-danger-borderColor-hover: var(--base-color-red-7);
|
|
368
368
|
--button-danger-shadow-selected: inset 0px 1px 0px 0px #43001133;
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #704d00;
|
|
1422
1422
|
--base-display-color-yellow-8: #5c3d00;
|
|
1423
1423
|
--base-display-color-yellow-9: #422b00;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1494,7 +1494,7 @@
|
|
|
1494
1494
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1495
1495
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1496
1496
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1497
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1497
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1498
1498
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1499
1499
|
--button-danger-borderColor-hover: var(--base-color-red-7);
|
|
1500
1500
|
--button-danger-shadow-selected: inset 0px 1px 0px 0px #43001133;
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
--base-display-color-yellow-7: #704d00;
|
|
290
290
|
--base-display-color-yellow-8: #5c3d00;
|
|
291
291
|
--base-display-color-yellow-9: #422b00;
|
|
292
|
-
--borderRadius-full: 624.9375rem;
|
|
292
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
293
293
|
--borderRadius-large: 0.75rem;
|
|
294
294
|
--borderRadius-medium: 0.375rem;
|
|
295
295
|
--borderRadius-small: 0.1875rem;
|
|
@@ -362,7 +362,7 @@
|
|
|
362
362
|
--borderWidth-default: var(--borderWidth-thin);
|
|
363
363
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
364
364
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
365
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
365
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
366
366
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
367
367
|
--button-danger-fgColor-disabled: #d1242f80;
|
|
368
368
|
--button-danger-fgColor-rest: var(--fgColor-danger);
|
|
@@ -1421,7 +1421,7 @@
|
|
|
1421
1421
|
--base-display-color-yellow-7: #704d00;
|
|
1422
1422
|
--base-display-color-yellow-8: #5c3d00;
|
|
1423
1423
|
--base-display-color-yellow-9: #422b00;
|
|
1424
|
-
--borderRadius-full: 624.9375rem;
|
|
1424
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1425
1425
|
--borderRadius-large: 0.75rem;
|
|
1426
1426
|
--borderRadius-medium: 0.375rem;
|
|
1427
1427
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1494,7 +1494,7 @@
|
|
|
1494
1494
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1495
1495
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1496
1496
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1497
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1497
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1498
1498
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1499
1499
|
--button-danger-fgColor-disabled: #d1242f80;
|
|
1500
1500
|
--button-danger-fgColor-rest: var(--fgColor-danger);
|
|
@@ -290,7 +290,7 @@
|
|
|
290
290
|
--base-display-color-yellow-8: #5c3d00;
|
|
291
291
|
--base-display-color-yellow-9: #422b00;
|
|
292
292
|
--bgColor-success-emphasis: #1f883d;
|
|
293
|
-
--borderRadius-full: 624.9375rem;
|
|
293
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
294
294
|
--borderRadius-large: 0.75rem;
|
|
295
295
|
--borderRadius-medium: 0.375rem;
|
|
296
296
|
--borderRadius-small: 0.1875rem;
|
|
@@ -359,7 +359,7 @@
|
|
|
359
359
|
--borderWidth-default: var(--borderWidth-thin);
|
|
360
360
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
361
361
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
362
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
362
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
363
363
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
364
364
|
--button-danger-fgColor-disabled: #d1242f80;
|
|
365
365
|
--button-danger-fgColor-rest: var(--fgColor-danger);
|
|
@@ -1422,7 +1422,7 @@
|
|
|
1422
1422
|
--base-display-color-yellow-8: #5c3d00;
|
|
1423
1423
|
--base-display-color-yellow-9: #422b00;
|
|
1424
1424
|
--bgColor-success-emphasis: #1f883d;
|
|
1425
|
-
--borderRadius-full: 624.9375rem;
|
|
1425
|
+
--borderRadius-full: 624.9375rem; /** Use this border radius for pill shaped elements */
|
|
1426
1426
|
--borderRadius-large: 0.75rem;
|
|
1427
1427
|
--borderRadius-medium: 0.375rem;
|
|
1428
1428
|
--borderRadius-small: 0.1875rem;
|
|
@@ -1491,7 +1491,7 @@
|
|
|
1491
1491
|
--borderWidth-default: var(--borderWidth-thin);
|
|
1492
1492
|
--boxShadow-thick: inset 0 0 0 var(--borderWidth-thick);
|
|
1493
1493
|
--boxShadow-thicker: inset 0 0 0 var(--borderWidth-thicker);
|
|
1494
|
-
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin);
|
|
1494
|
+
--boxShadow-thin: inset 0 0 0 var(--borderWidth-thin); /** Thin shadow for borders */
|
|
1495
1495
|
--button-danger-bgColor-hover: var(--base-color-red-6);
|
|
1496
1496
|
--button-danger-fgColor-disabled: #d1242f80;
|
|
1497
1497
|
--button-danger-fgColor-rest: var(--fgColor-danger);
|