@gitlab/ui 86.9.0 → 86.10.0

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 (39) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown.js +10 -6
  3. package/dist/components/base/new_dropdowns/disclosure/mock_data.js +8 -1
  4. package/dist/index.css +2 -2
  5. package/dist/index.css.map +1 -1
  6. package/dist/tailwind.css +1 -1
  7. package/dist/tokens/build/js/tokens.dark.js +77 -77
  8. package/dist/tokens/build/js/tokens.js +63 -63
  9. package/dist/tokens/css/tokens.css +24 -24
  10. package/dist/tokens/css/tokens.dark.css +23 -23
  11. package/dist/tokens/js/tokens.dark.js +77 -77
  12. package/dist/tokens/js/tokens.js +63 -63
  13. package/dist/tokens/json/tokens.dark.json +107 -107
  14. package/dist/tokens/json/tokens.json +93 -93
  15. package/dist/tokens/scss/_tokens.dark.scss +23 -23
  16. package/dist/tokens/scss/_tokens.scss +24 -24
  17. package/dist/tokens/tailwind/tokens.cjs +18 -18
  18. package/dist/utility_classes.css +1 -1
  19. package/dist/utility_classes.css.map +1 -1
  20. package/dist/utils/utils.js +1 -1
  21. package/package.json +1 -1
  22. package/src/components/base/new_dropdowns/disclosure/disclosure_dropdown.vue +10 -6
  23. package/src/components/base/new_dropdowns/disclosure/mock_data.js +12 -0
  24. package/src/tokens/build/css/tokens.css +24 -24
  25. package/src/tokens/build/css/tokens.dark.css +23 -23
  26. package/src/tokens/build/js/tokens.dark.js +77 -77
  27. package/src/tokens/build/js/tokens.js +63 -63
  28. package/src/tokens/build/json/tokens.dark.json +107 -107
  29. package/src/tokens/build/json/tokens.json +93 -93
  30. package/src/tokens/build/scss/_tokens.dark.scss +23 -23
  31. package/src/tokens/build/scss/_tokens.scss +24 -24
  32. package/src/tokens/build/tailwind/tokens.cjs +18 -18
  33. package/src/tokens/color.alpha.tokens.json +6 -6
  34. package/src/tokens/color.constant.tokens.json +5 -5
  35. package/src/tokens/color.tokens.json +14 -14
  36. package/src/tokens/color.transparency.tokens.json +6 -6
  37. package/src/tokens/shadow.tokens.json +2 -2
  38. package/src/tokens/text.tokens.json +1 -1
  39. package/src/utils/utils.js +1 -1
package/dist/tokens/js/tokens.dark.js CHANGED
@@ -3,27 +3,27 @@
3
3
  * Do not edit directly
4
4
  */
5
5
 
6
- export const GL_ACTION_BACKGROUND_COLOR_DISABLED = '#333238'; // Used for the background of a disabled action.
7
- export const GL_ACTION_BORDER_COLOR_DISABLED = '#434248'; // Used for the border of a disabled action.
6
+ export const GL_ACTION_BACKGROUND_COLOR_DISABLED = '#28272d'; // Used for the background of a disabled action.
7
+ export const GL_ACTION_BORDER_COLOR_DISABLED = '#3a383f'; // Used for the border of a disabled action.
8
8
  export const GL_ACTION_TEXT_COLOR_DISABLED = '#89888d'; // Used for the text of a disabled action.
9
9
  export const GL_ACTION_ICON_COLOR_DISABLED = '#737278'; // Used for the icon of a disabled action.
10
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#333238'; // Used for the background of an outlined neutral action in the default state.
11
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER = '#333238'; // Used for the background of an outlined neutral action in the hover state.
12
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS = '#333238'; // Used for the background of an outlined neutral action in the focus state.
13
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#434248'; // Used for the background of an outlined neutral action in the active state.
10
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of an outlined neutral action in the default state.
11
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_HOVER = '#28272d'; // Used for the background of an outlined neutral action in the hover state.
12
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_FOCUS = '#28272d'; // Used for the background of an outlined neutral action in the focus state.
13
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#3a383f'; // Used for the background of an outlined neutral action in the active state.
14
14
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_DEFAULT = 'transparent'; // Used for the background of a borderless, subtle neutral action in the default state.
15
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER = '#333238'; // Used for the background of a borderless, subtle neutral action in the hover state.
16
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS = '#333238'; // Used for the background of a borderless, subtle neutral action in the focus state.
17
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE = '#434248'; // Used for the background of a borderless, subtle neutral action in the active state.
15
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_HOVER = '#28272d'; // Used for the background of a borderless, subtle neutral action in the hover state.
16
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_FOCUS = '#28272d'; // Used for the background of a borderless, subtle neutral action in the focus state.
17
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE = '#3a383f'; // Used for the background of a borderless, subtle neutral action in the active state.
18
18
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT = '#89888d'; // Used for the background of a solid, strong neutral action in the default state.
19
19
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER = '#a4a3a8'; // Used for the background of a solid, strong neutral action in the hover state.
20
20
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS = '#a4a3a8'; // Used for the background of a solid, strong neutral action in the focus state.
21
21
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE = '#bfbfc3'; // Used for the background of a solid, strong neutral action in the active state.
22
- export const GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT = '#535158'; // Used for the border of an outlined neutral action in the default state.
22
+ export const GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT = '#4c4b51'; // Used for the border of an outlined neutral action in the default state.
23
23
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER = '#737278'; // Used for the border of an outlined neutral action in the hover state.
24
24
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS = '#737278'; // Used for the border of an outlined neutral action in the focus state.
25
25
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE = '#a4a3a8'; // Used for the border of an outlined neutral action in the active state.
26
- export const GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED = '#535158'; // Used for the border of a outlined neutral action when in a selected or current state.
26
+ export const GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED = '#4c4b51'; // Used for the border of a outlined neutral action when in a selected or current state.
27
27
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT = '#a4a3a8'; // Used for the border of a solid, strong neutral action in the default state.
28
28
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER = '#dcdcde'; // Used for the border of a solid, strong neutral action in the hover state.
29
29
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS = '#dcdcde'; // Used for the border of a solid, strong neutral action in the focus state.
@@ -32,13 +32,13 @@ export const GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT = '#ececef'; // Used for the t
32
32
  export const GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER = '#ececef'; // Used for the text of a neutral action in the hover state.
33
33
  export const GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS = '#ececef'; // Used for the text of a neutral action in the focus state.
34
34
  export const GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE = '#ececef'; // Used for the text of a neutral action in the active state.
35
- export const GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG = '#333238'; // Used for the text on a solid, strong neutral action background.
35
+ export const GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG = '#28272d'; // Used for the text on a solid, strong neutral action background.
36
36
  export const GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT = '#89888d'; // Used for the icon of outlined and borderless neutral actions.
37
37
  export const GL_ACTION_NEUTRAL_ICON_COLOR_HOVER = '#bfbfc3'; // Used for the icon of outlined and borderless neutral actions in the hover state.
38
38
  export const GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS = '#bfbfc3'; // Used for the icon of outlined and borderless neutral actions in the focus state.
39
39
  export const GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE = '#ececef'; // Used for the icon of outlined and borderless neutral actions in the active state.
40
- export const GL_ACTION_NEUTRAL_ICON_COLOR_STRONG = '#333238'; // Used for the icon on a solid, strong neutral action background.
41
- export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT = '#333238'; // Used for the background of an outlined confirm (positive) action in the default state.
40
+ export const GL_ACTION_NEUTRAL_ICON_COLOR_STRONG = '#28272d'; // Used for the icon on a solid, strong neutral action background.
41
+ export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of an outlined confirm (positive) action in the default state.
42
42
  export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER = '#033464'; // Used for the background of an outlined confirm (positive) action in the hover state.
43
43
  export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_FOCUS = '#033464'; // Used for the background of an outlined confirm (positive) action in the focus state.
44
44
  export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_ACTIVE = '#064787'; // Used for the background of an outlined confirm (positive) action in the active state.
@@ -64,13 +64,13 @@ export const GL_ACTION_CONFIRM_TEXT_COLOR_DEFAULT = '#428fdc'; // Used for the t
64
64
  export const GL_ACTION_CONFIRM_TEXT_COLOR_HOVER = '#9dc7f1'; // Used for the text of a confirm (positive) action in the hover state.
65
65
  export const GL_ACTION_CONFIRM_TEXT_COLOR_FOCUS = '#9dc7f1'; // Used for the text of a confirm (positive) action in the focus state.
66
66
  export const GL_ACTION_CONFIRM_TEXT_COLOR_ACTIVE = '#e9f3fc'; // Used for the text of a confirm (positive) action in the active state.
67
- export const GL_ACTION_CONFIRM_TEXT_COLOR_STRONG = '#333238'; // Used for the text on a solid, strong confirm (positive) action background.
67
+ export const GL_ACTION_CONFIRM_TEXT_COLOR_STRONG = '#28272d'; // Used for the text on a solid, strong confirm (positive) action background.
68
68
  export const GL_ACTION_CONFIRM_ICON_COLOR_DEFAULT = '#428fdc'; // Used for the icon of a confirm (positive) action in the default state.
69
69
  export const GL_ACTION_CONFIRM_ICON_COLOR_HOVER = '#9dc7f1'; // Used for the icon of a confirm (positive) action in the hover state.
70
70
  export const GL_ACTION_CONFIRM_ICON_COLOR_FOCUS = '#9dc7f1'; // Used for the icon of a confirm (positive) action in the focus state.
71
71
  export const GL_ACTION_CONFIRM_ICON_COLOR_ACTIVE = '#e9f3fc'; // Used for the icon of a confirm (positive) action in the active state.
72
- export const GL_ACTION_CONFIRM_ICON_COLOR_STRONG = '#333238'; // Used for the icon on a solid, strong confirm (positive) action background.
73
- export const GL_ACTION_DANGER_BACKGROUND_COLOR_DEFAULT = '#333238'; // Used for the background of an outlined danger (destructive) action in the default state.
72
+ export const GL_ACTION_CONFIRM_ICON_COLOR_STRONG = '#28272d'; // Used for the icon on a solid, strong confirm (positive) action background.
73
+ export const GL_ACTION_DANGER_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of an outlined danger (destructive) action in the default state.
74
74
  export const GL_ACTION_DANGER_BACKGROUND_COLOR_HOVER = '#660e00'; // Used for the background of an outlined danger (destructive) action in the hover state.
75
75
  export const GL_ACTION_DANGER_BACKGROUND_COLOR_FOCUS = '#660e00'; // Used for the background of an outlined danger (destructive) action in the focus state.
76
76
  export const GL_ACTION_DANGER_BACKGROUND_COLOR_ACTIVE = '#8d1300'; // Used for the background of an outlined danger (destructive) action in the active state.
@@ -94,28 +94,28 @@ export const GL_ACTION_DANGER_TEXT_COLOR_DEFAULT = '#ec5941'; // Used for the te
94
94
  export const GL_ACTION_DANGER_TEXT_COLOR_HOVER = '#fcb5aa'; // Used for the text of a danger (destructive) action in the hover state.
95
95
  export const GL_ACTION_DANGER_TEXT_COLOR_FOCUS = '#fcb5aa'; // Used for the text of a danger (destructive) action in the focus state.
96
96
  export const GL_ACTION_DANGER_TEXT_COLOR_ACTIVE = '#fcf1ef'; // Used for the text of a danger (destructive) action in the active state.
97
- export const GL_ACTION_DANGER_TEXT_COLOR_STRONG = '#333238'; // Used for the text on a solid, strong danger (destructive) action background.
97
+ export const GL_ACTION_DANGER_TEXT_COLOR_STRONG = '#28272d'; // Used for the text on a solid, strong danger (destructive) action background.
98
98
  export const GL_ACTION_DANGER_ICON_COLOR_DEFAULT = '#ec5941'; // Used for the icon of a danger (destructive) action in the default state.
99
99
  export const GL_ACTION_DANGER_ICON_COLOR_HOVER = '#fcb5aa'; // Used for the icon of a danger (destructive) action in the hover state.
100
100
  export const GL_ACTION_DANGER_ICON_COLOR_FOCUS = '#fcb5aa'; // Used for the icon of a danger (destructive) action in the focus state.
101
101
  export const GL_ACTION_DANGER_ICON_COLOR_ACTIVE = '#fcf1ef'; // Used for the icon of a danger (destructive) action in the active state.
102
- export const GL_ACTION_DANGER_ICON_COLOR_STRONG = '#333238'; // Used for the icon on a solid, strong danger (destructive) action background.
103
- export const GL_BACKGROUND_COLOR_DEFAULT = '#1f1e24'; // Used for the default background color.
104
- export const GL_BACKGROUND_COLOR_SUBTLE = '#333238'; // Used to slightly differentiate the background from the default.
105
- export const GL_BACKGROUND_COLOR_STRONG = '#434248'; // Used to make the background easily stand out from the default.
106
- export const GL_BACKGROUND_COLOR_DISABLED = '#333238'; // Used to identify a disabled section.
102
+ export const GL_ACTION_DANGER_ICON_COLOR_STRONG = '#28272d'; // Used for the icon on a solid, strong danger (destructive) action background.
103
+ export const GL_BACKGROUND_COLOR_DEFAULT = '#18171d'; // Used for the default background color.
104
+ export const GL_BACKGROUND_COLOR_SUBTLE = '#28272d'; // Used to slightly differentiate the background from the default.
105
+ export const GL_BACKGROUND_COLOR_STRONG = '#3a383f'; // Used to make the background easily stand out from the default.
106
+ export const GL_BACKGROUND_COLOR_DISABLED = '#28272d'; // Used to identify a disabled section.
107
107
  export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(0,0,0,0.64)'; // Used for an overlay that covers other content.
108
- export const GL_BORDER_COLOR_DEFAULT = '#434248'; // Used for the default border color.
109
- export const GL_BORDER_COLOR_SUBTLE = '#333238'; // Used for a subtle border in combination with the default background.
108
+ export const GL_BORDER_COLOR_DEFAULT = '#3a383f'; // Used for the default border color.
109
+ export const GL_BORDER_COLOR_SUBTLE = '#28272d'; // Used for a subtle border in combination with the default background.
110
110
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
111
111
  export const GL_BORDER_COLOR_TRANSPARENT = 'transparent'; // Used when a border needs to be present, but not visibly perceived.
112
112
  export const GL_COLOR_ALPHA_0 = 'transparent';
113
- export const GL_COLOR_ALPHA_DARK_2 = 'rgba(31, 30, 36, 0.02)';
114
- export const GL_COLOR_ALPHA_DARK_4 = 'rgba(31, 30, 36, 0.04)';
115
- export const GL_COLOR_ALPHA_DARK_6 = 'rgba(31, 30, 36, 0.06)';
116
- export const GL_COLOR_ALPHA_DARK_8 = 'rgba(31, 30, 36, 0.08)';
117
- export const GL_COLOR_ALPHA_DARK_16 = 'rgba(31, 30, 36, 0.16)';
118
- export const GL_COLOR_ALPHA_DARK_24 = 'rgba(31, 30, 36, 0.24)';
113
+ export const GL_COLOR_ALPHA_DARK_2 = 'rgba(05, 05, 06, 0.02)';
114
+ export const GL_COLOR_ALPHA_DARK_4 = 'rgba(05, 05, 06, 0.04)';
115
+ export const GL_COLOR_ALPHA_DARK_6 = 'rgba(05, 05, 06, 0.06)';
116
+ export const GL_COLOR_ALPHA_DARK_8 = 'rgba(05, 05, 06, 0.08)';
117
+ export const GL_COLOR_ALPHA_DARK_16 = 'rgba(05, 05, 06, 0.16)';
118
+ export const GL_COLOR_ALPHA_DARK_24 = 'rgba(05, 05, 06, 0.24)';
119
119
  export const GL_COLOR_ALPHA_LIGHT_2 = 'rgba(255, 255, 255, 0.02)';
120
120
  export const GL_COLOR_ALPHA_LIGHT_4 = 'rgba(255, 255, 255, 0.04)';
121
121
  export const GL_COLOR_ALPHA_LIGHT_6 = 'rgba(255, 255, 255, 0.06)';
@@ -143,11 +143,11 @@ export const GL_COLOR_NEUTRAL_300 = '#a4a3a8';
143
143
  export const GL_COLOR_NEUTRAL_400 = '#89888d';
144
144
  export const GL_COLOR_NEUTRAL_500 = '#737278';
145
145
  export const GL_COLOR_NEUTRAL_600 = '#626168';
146
- export const GL_COLOR_NEUTRAL_700 = '#535158';
147
- export const GL_COLOR_NEUTRAL_800 = '#434248';
148
- export const GL_COLOR_NEUTRAL_900 = '#333238';
149
- export const GL_COLOR_NEUTRAL_950 = '#1f1e24';
150
- export const GL_COLOR_NEUTRAL_1000 = '#000';
146
+ export const GL_COLOR_NEUTRAL_700 = '#4c4b51';
147
+ export const GL_COLOR_NEUTRAL_800 = '#3a383f';
148
+ export const GL_COLOR_NEUTRAL_900 = '#28272d';
149
+ export const GL_COLOR_NEUTRAL_950 = '#18171d';
150
+ export const GL_COLOR_NEUTRAL_1000 = '#050506';
151
151
  export const GL_COLOR_GREEN_50 = '#ecf4ee';
152
152
  export const GL_COLOR_GREEN_100 = '#c3e6cd';
153
153
  export const GL_COLOR_GREEN_200 = '#91d4a8';
@@ -407,7 +407,7 @@ export const THEME_LIGHT_RED_800 = '#f6d9d5';
407
407
  export const THEME_LIGHT_RED_900 = '#faf2f1';
408
408
  export const THEME_LIGHT_RED_950 = '#fdf9f8';
409
409
  export const BLACK = '#fff';
410
- export const WHITE = '#333238';
410
+ export const WHITE = '#28272d';
411
411
  export const BLUE_50 = '#033464';
412
412
  export const BLUE_100 = '#064787';
413
413
  export const BLUE_200 = '#0b5cad';
@@ -419,10 +419,10 @@ export const BLUE_700 = '#9dc7f1';
419
419
  export const BLUE_800 = '#cbe2f9';
420
420
  export const BLUE_900 = '#e9f3fc';
421
421
  export const BLUE_950 = '#f2f9ff';
422
- export const GRAY_10 = '#1f1e24';
423
- export const GRAY_50 = '#333238';
424
- export const GRAY_100 = '#434248';
425
- export const GRAY_200 = '#535158';
422
+ export const GRAY_10 = '#18171d';
423
+ export const GRAY_50 = '#28272d';
424
+ export const GRAY_100 = '#3a383f';
425
+ export const GRAY_200 = '#4c4b51';
426
426
  export const GRAY_300 = '#626168';
427
427
  export const GRAY_400 = '#737278';
428
428
  export const GRAY_500 = '#89888d';
@@ -486,12 +486,12 @@ export const BRAND_GRAY_02 = '#a2a1a6';
486
486
  export const BRAND_GRAY_03 = '#74717a';
487
487
  export const BRAND_GRAY_04 = '#45424d';
488
488
  export const BRAND_GRAY_05 = '#2b2838';
489
- export const T_GRAY_A_16 = 'rgba(31, 30, 36, 0.16)';
490
- export const T_GRAY_A_24 = 'rgba(31, 30, 36, 0.24)';
491
- export const T_GRAY_A_02 = 'rgba(31, 30, 36, 0.02)';
492
- export const T_GRAY_A_04 = 'rgba(31, 30, 36, 0.04)';
493
- export const T_GRAY_A_06 = 'rgba(31, 30, 36, 0.06)';
494
- export const T_GRAY_A_08 = 'rgba(31, 30, 36, 0.08)';
489
+ export const T_GRAY_A_16 = 'rgba(05, 05, 06, 0.16)';
490
+ export const T_GRAY_A_24 = 'rgba(05, 05, 06, 0.24)';
491
+ export const T_GRAY_A_02 = 'rgba(05, 05, 06, 0.02)';
492
+ export const T_GRAY_A_04 = 'rgba(05, 05, 06, 0.04)';
493
+ export const T_GRAY_A_06 = 'rgba(05, 05, 06, 0.06)';
494
+ export const T_GRAY_A_08 = 'rgba(05, 05, 06, 0.08)';
495
495
  export const T_WHITE_A_16 = 'rgba(255, 255, 255, 0.16)';
496
496
  export const T_WHITE_A_24 = 'rgba(255, 255, 255, 0.24)';
497
497
  export const T_WHITE_A_36 = 'rgba(255, 255, 255, 0.36)';
@@ -499,21 +499,21 @@ export const T_WHITE_A_02 = 'rgba(255, 255, 255, 0.02)';
499
499
  export const T_WHITE_A_04 = 'rgba(255, 255, 255, 0.04)';
500
500
  export const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)';
501
501
  export const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)';
502
- export const GL_AVATAR_BORDER_COLOR_DEFAULT = 'rgba(31, 30, 36, 0.08)'; // Used to define the edge of an avatar.
503
- export const GL_AVATAR_BORDER_COLOR_HOVER = 'rgba(31, 30, 36, 0.24)'; // Used to increase the edge definition of an avatar in the hover state.
502
+ export const GL_AVATAR_BORDER_COLOR_DEFAULT = 'rgba(05, 05, 06, 0.08)'; // Used to define the edge of an avatar.
503
+ export const GL_AVATAR_BORDER_COLOR_HOVER = 'rgba(05, 05, 06, 0.24)'; // Used to increase the edge definition of an avatar in the hover state.
504
504
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED = '#660e00'; // Red background for avatar fallback with no particular meaning.
505
505
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE = '#232150'; // Purple background for avatar fallback with no particular meaning.
506
506
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE = '#033464'; // Blue background for avatar fallback with no particular meaning.
507
507
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN = '#0a4020'; // Green background for avatar fallback with no particular meaning.
508
508
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE = '#5c2900'; // Orange background for avatar fallback with no particular meaning.
509
- export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL = '#333238'; // Neutral background for avatar fallback with no particular meaning.
509
+ export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL = '#28272d'; // Neutral background for avatar fallback with no particular meaning.
510
510
  export const GL_BANNER_INTRO_BORDER_COLOR = '#1068bf'; // Used to compliment the info banner.
511
- export const GL_BANNER_PROMO_BACKGROUND_COLOR = '#333238'; // Used as background for the default banner type.
512
- export const GL_BREADCRUMB_SEPARATOR_COLOR = '#535158'; // Used for the breadcrumb level separator.
513
- export const GL_LABEL_LIGHT_TEXT_COLOR = '#1f1e24'; // Used for the label text color on a light background color.
511
+ export const GL_BANNER_PROMO_BACKGROUND_COLOR = '#28272d'; // Used as background for the default banner type.
512
+ export const GL_BREADCRUMB_SEPARATOR_COLOR = '#4c4b51'; // Used for the breadcrumb level separator.
513
+ export const GL_LABEL_LIGHT_TEXT_COLOR = '#18171d'; // Used for the label text color on a light background color.
514
514
  export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_DEFAULT = 'transparent'; // Used for the label remove button background on a light background color in the default state.
515
- export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_HOVER = '#1f1e24'; // Used for the label remove button background on a light background color in the hover state.
516
- export const GL_LABEL_LIGHT_BUTTON_ICON_COLOR_DEFAULT = '#1f1e24'; // Used for the label remove button icon on a light background color in the default state.
515
+ export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_HOVER = '#18171d'; // Used for the label remove button background on a light background color in the hover state.
516
+ export const GL_LABEL_LIGHT_BUTTON_ICON_COLOR_DEFAULT = '#18171d'; // Used for the label remove button icon on a light background color in the default state.
517
517
  export const GL_LABEL_DARK_TEXT_COLOR = '#fff'; // Used for the label text color on a dark background color.
518
518
  export const GL_LABEL_DARK_BUTTON_BACKGROUND_COLOR_DEFAULT = 'transparent'; // Used for the label remove button background on a dark background color in the default state.
519
519
  export const GL_LABEL_DARK_BUTTON_BACKGROUND_COLOR_HOVER = '#fff'; // Used for the label remove button background on a dark background color in the hover state.
@@ -521,25 +521,25 @@ export const GL_LABEL_DARK_BUTTON_ICON_COLOR_DEFAULT = '#fff'; // Used for the l
521
521
  export const GL_LABEL_SCOPED_TEXT_COLOR = '#fff'; // Used for the scoped label text color.
522
522
  export const GL_LABEL_SCOPED_BUTTON_BACKGROUND_COLOR_HOVER = '#fff'; // Used for the scoped label remove button background in the hover state.
523
523
  export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_DEFAULT = '#fff'; // Used for the scoped label remove button icon in the default state.
524
- export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_HOVER = '#1f1e24'; // Used for the scoped label remove button icon in the hover state.
525
- export const GL_POPOVER_BACKGROUND_COLOR = '#333238'; // Used for the background color of popover.
526
- export const GL_SKELETON_LOADER_BACKGROUND_COLOR = '#434248'; // Used for the skeleton loader background color.
527
- export const GL_SKELETON_LOADER_SHIMMER_COLOR = '#535158'; // Used for the animated shimmer effect in a skeleton loader.
528
- export const GL_SPINNER_TRACK_COLOR_DEFAULT = '#434248'; // Used for the static track (background) of a loading spinner.
529
- export const GL_SPINNER_TRACK_COLOR_LIGHT = '#434248'; // Used for the static track (background) of a loading spinner on a dark background.
524
+ export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_HOVER = '#18171d'; // Used for the scoped label remove button icon in the hover state.
525
+ export const GL_POPOVER_BACKGROUND_COLOR = '#28272d'; // Used for the background color of popover.
526
+ export const GL_SKELETON_LOADER_BACKGROUND_COLOR = '#3a383f'; // Used for the skeleton loader background color.
527
+ export const GL_SKELETON_LOADER_SHIMMER_COLOR = '#4c4b51'; // Used for the animated shimmer effect in a skeleton loader.
528
+ export const GL_SPINNER_TRACK_COLOR_DEFAULT = '#3a383f'; // Used for the static track (background) of a loading spinner.
529
+ export const GL_SPINNER_TRACK_COLOR_LIGHT = '#3a383f'; // Used for the static track (background) of a loading spinner on a dark background.
530
530
  export const GL_SPINNER_SEGMENT_COLOR_DEFAULT = '#bfbfc3'; // Used for the animated segment of a loading spinner.
531
531
  export const GL_SPINNER_SEGMENT_COLOR_LIGHT = '#bfbfc3'; // Used for the animated segment of a loading spinner on a dark background.
532
- export const GL_TABLE_ROW_BACKGROUND_COLOR_HOVER = '#333238'; // Used for the background of a table row in hover state.
532
+ export const GL_TABLE_ROW_BACKGROUND_COLOR_HOVER = '#28272d'; // Used for the background of a table row in hover state.
533
533
  export const GL_TABLE_SORTING_ICON_COLOR = '#fff'; // Used for the color of the sorting icons in the column headers.
534
- export const GL_CONTROL_BACKGROUND_COLOR_DEFAULT = '#333238'; // Used for form control (input, radio button, checkbox, textarea) default background.
535
- export const GL_CONTROL_BACKGROUND_COLOR_DISABLED = '#1f1e24'; // Used for disabled form control (checkbox, input, radio button, textarea) background.
534
+ export const GL_CONTROL_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for form control (input, radio button, checkbox, textarea) default background.
535
+ export const GL_CONTROL_BACKGROUND_COLOR_DISABLED = '#18171d'; // Used for disabled form control (checkbox, input, radio button, textarea) background.
536
536
  export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT = '#428fdc'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) background.
537
537
  export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER = '#9dc7f1'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.
538
538
  export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS = '#9dc7f1'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.
539
539
  export const GL_CONTROL_BORDER_COLOR_DEFAULT = '#737278'; // Used for form control (input, radio button, checkbox, textarea) default border.
540
540
  export const GL_CONTROL_BORDER_COLOR_HOVER = '#a4a3a8'; // Used for form control (input, radio button, checkbox, textarea) border on hover.
541
541
  export const GL_CONTROL_BORDER_COLOR_FOCUS = '#ececef'; // Used for form control (input, radio button, checkbox, textarea) border on focus.
542
- export const GL_CONTROL_BORDER_COLOR_DISABLED = '#434248'; // Used for disabled form control (input, radio button, checkbox, textarea) border.
542
+ export const GL_CONTROL_BORDER_COLOR_DISABLED = '#3a383f'; // Used for disabled form control (input, radio button, checkbox, textarea) border.
543
543
  export const GL_CONTROL_BORDER_COLOR_ERROR = '#ec5941'; // Used for invalid form control (input, textarea) border.
544
544
  export const GL_CONTROL_BORDER_COLOR_SELECTED_DEFAULT = '#428fdc'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) border.
545
545
  export const GL_CONTROL_BORDER_COLOR_SELECTED_HOVER = '#9dc7f1'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) border on hover.
@@ -547,13 +547,13 @@ export const GL_CONTROL_BORDER_COLOR_SELECTED_FOCUS = '#9dc7f1'; // Used for che
547
547
  export const GL_CONTROL_TEXT_COLOR_ERROR = '#ec5941'; // Used for the helper text when the input is invalid.
548
548
  export const GL_CONTROL_TEXT_COLOR_VALID = '#2da160'; // Used for the helper text when the input is valid.
549
549
  export const GL_CONTROL_PLACEHOLDER_COLOR = '#737278'; // Used for placeholder text within inputs.
550
- export const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#333238'; // Used for checkbox and radio button state indicators.
550
+ export const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#28272d'; // Used for checkbox and radio button state indicators.
551
551
  export const GL_CONTROL_INDICATOR_COLOR_DISABLED = '#89888d'; // Used for disabled checkbox and radio button state indicators.
552
552
  export const GL_FEEDBACK_BACKGROUND_COLOR_STRONG = '#fbfafd'; // Used for a background associated with feedback like a tooltip or toast message.
553
- export const GL_FEEDBACK_TEXT_COLOR_STRONG = '#333238'; // Used for text on a strong feedback background.
554
- export const GL_FEEDBACK_ICON_COLOR_STRONG = '#333238'; // Used for an icon on a strong feedback background.
553
+ export const GL_FEEDBACK_TEXT_COLOR_STRONG = '#28272d'; // Used for text on a strong feedback background.
554
+ export const GL_FEEDBACK_ICON_COLOR_STRONG = '#28272d'; // Used for an icon on a strong feedback background.
555
555
  export const GL_FEEDBACK_LINK_COLOR_STRONG = '#0b5cad'; // Used for a link on a strong feedback background.
556
- export const GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR = '#333238'; // Used for a background associated with neutral feedback.
556
+ export const GL_FEEDBACK_NEUTRAL_BACKGROUND_COLOR = '#28272d'; // Used for a background associated with neutral feedback.
557
557
  export const GL_FEEDBACK_NEUTRAL_ICON_COLOR = '#a4a3a8'; // Used for an icon associated with a neutral feedback section.
558
558
  export const GL_FEEDBACK_INFO_BACKGROUND_COLOR = '#033464'; // Used for a background associated with informational feedback or a highlighted section resulting from a user action.
559
559
  export const GL_FEEDBACK_INFO_ICON_COLOR = '#63a6e9'; // Used for an icon associated with informational feedback.
@@ -564,7 +564,7 @@ export const GL_FEEDBACK_WARNING_ICON_COLOR = '#d99530'; // Used for an icon ass
564
564
  export const GL_FEEDBACK_DANGER_BACKGROUND_COLOR = '#660e00'; // Used for a background associated with danger or critical feedback.
565
565
  export const GL_FEEDBACK_DANGER_ICON_COLOR = '#f57f6c'; // Used for an icon associated with danger or critical feedback.
566
566
  export const GL_FOCUS_RING_OUTER_COLOR = '#428fdc'; // Used for the outer color portion of the focus ring.
567
- export const GL_FOCUS_RING_INNER_COLOR = '#1f1e24'; // Used for the inner neutral portion of the focus ring.
567
+ export const GL_FOCUS_RING_INNER_COLOR = '#18171d'; // Used for the inner neutral portion of the focus ring.
568
568
  export const GL_ICON_COLOR_DEFAULT = '#dcdcde'; // Used for the default icon color. Can be paired with default text.
569
569
  export const GL_ICON_COLOR_SUBTLE = '#a4a3a8'; // Used for a static or decorational icon. Can be paired with subtle text.
570
570
  export const GL_ICON_COLOR_STRONG = '#fbfafd'; // Used for an icon with the highest contrast.
@@ -584,10 +584,10 @@ export const GL_LINE_HEIGHT_36 = '2.25rem';
584
584
  export const GL_LINE_HEIGHT_42 = '2.625rem';
585
585
  export const GL_LINE_HEIGHT_44 = '2.75rem';
586
586
  export const GL_LINE_HEIGHT_52 = '3.25rem';
587
- export const GL_SHADOW_COLOR_DEFAULT = 'rgba(5, 5, 6, 0.24)'; // Used for the default shadow color.
588
- export const GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT = '#333238'; // Used for the background of a subtle neutral status item when static or the default state when linked.
589
- export const GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE = '#434248'; // Used for the background of a subtle neutral status item in the active state.
590
- export const GL_STATUS_MUTED_BORDER_COLOR_HOVER = '#535158'; // Used for the border of a subtle neutral status item in the hover state.
587
+ export const GL_SHADOW_COLOR_DEFAULT = 'rgba(05, 05, 06, 0.24)'; // Used for the default shadow color.
588
+ export const GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of a subtle neutral status item when static or the default state when linked.
589
+ export const GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE = '#3a383f'; // Used for the background of a subtle neutral status item in the active state.
590
+ export const GL_STATUS_MUTED_BORDER_COLOR_HOVER = '#4c4b51'; // Used for the border of a subtle neutral status item in the hover state.
591
591
  export const GL_STATUS_MUTED_TEXT_COLOR_DEFAULT = '#a4a3a8'; // Used for the text of a subtle neutral status item when static or the default state when linked.
592
592
  export const GL_STATUS_MUTED_TEXT_COLOR_HOVER = '#bfbfc3'; // Used for the text of a subtle neutral status item in the hover state.
593
593
  export const GL_STATUS_MUTED_TEXT_COLOR_FOCUS = '#bfbfc3'; // Used for the text of a subtle neutral status item in the focus state.
@@ -596,9 +596,9 @@ export const GL_STATUS_MUTED_ICON_COLOR_DEFAULT = '#89888d'; // Used for the ico
596
596
  export const GL_STATUS_MUTED_ICON_COLOR_HOVER = '#a4a3a8'; // Used for the icon of a subtle neutral status item in the hover state.
597
597
  export const GL_STATUS_MUTED_ICON_COLOR_FOCUS = '#a4a3a8'; // Used for the icon of a subtle neutral status item in the focus state.
598
598
  export const GL_STATUS_MUTED_ICON_COLOR_ACTIVE = '#bfbfc3'; // Used for the icon of a subtle neutral status item in the active state.
599
- export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#434248'; // Used for the background of a neutral status item when static or the default state when linked.
600
- export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#535158'; // Used for the background of a neutral status item in the active state.
601
- export const GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER = '#535158'; // Used for the border of a neutral status item in the hover state.
599
+ export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#3a383f'; // Used for the background of a neutral status item when static or the default state when linked.
600
+ export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#4c4b51'; // Used for the background of a neutral status item in the active state.
601
+ export const GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER = '#4c4b51'; // Used for the border of a neutral status item in the hover state.
602
602
  export const GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT = '#bfbfc3'; // Used for the text of a neutral status item when static or the default state when linked.
603
603
  export const GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER = '#dcdcde'; // Used for the text of a neutral status item in the hover state.
604
604
  export const GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS = '#dcdcde'; // Used for the text of a neutral status item in the focus state.
package/dist/tokens/js/tokens.js CHANGED
@@ -18,25 +18,25 @@ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_SUBTLE_ACTIVE = '#dcdcde'; // Us
18
18
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_DEFAULT = '#737278'; // Used for the background of a solid, strong neutral action in the default state.
19
19
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_HOVER = '#626168'; // Used for the background of a solid, strong neutral action in the hover state.
20
20
  export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_FOCUS = '#626168'; // Used for the background of a solid, strong neutral action in the focus state.
21
- export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE = '#535158'; // Used for the background of a solid, strong neutral action in the active state.
21
+ export const GL_ACTION_NEUTRAL_BACKGROUND_COLOR_STRONG_ACTIVE = '#4c4b51'; // Used for the background of a solid, strong neutral action in the active state.
22
22
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_DEFAULT = '#bfbfc3'; // Used for the border of an outlined neutral action in the default state.
23
23
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_HOVER = '#89888d'; // Used for the border of an outlined neutral action in the hover state.
24
24
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_FOCUS = '#89888d'; // Used for the border of an outlined neutral action in the focus state.
25
25
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_ACTIVE = '#626168'; // Used for the border of an outlined neutral action in the active state.
26
26
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_SELECTED = '#a4a3a8'; // Used for the border of a outlined neutral action when in a selected or current state.
27
27
  export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_DEFAULT = '#626168'; // Used for the border of a solid, strong neutral action in the default state.
28
- export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER = '#434248'; // Used for the border of a solid, strong neutral action in the hover state.
29
- export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS = '#434248'; // Used for the border of a solid, strong neutral action in the focus state.
30
- export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE = '#333238'; // Used for the border of a solid, strong neutral action in the active state.
31
- export const GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT = '#333238'; // Used for the text of outlined and borderless neutral actions.
32
- export const GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER = '#333238'; // Used for the text of a neutral action in the hover state.
33
- export const GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS = '#333238'; // Used for the text of a neutral action in the focus state.
34
- export const GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE = '#333238'; // Used for the text of a neutral action in the active state.
28
+ export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_HOVER = '#3a383f'; // Used for the border of a solid, strong neutral action in the hover state.
29
+ export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_FOCUS = '#3a383f'; // Used for the border of a solid, strong neutral action in the focus state.
30
+ export const GL_ACTION_NEUTRAL_BORDER_COLOR_STRONG_ACTIVE = '#28272d'; // Used for the border of a solid, strong neutral action in the active state.
31
+ export const GL_ACTION_NEUTRAL_TEXT_COLOR_DEFAULT = '#28272d'; // Used for the text of outlined and borderless neutral actions.
32
+ export const GL_ACTION_NEUTRAL_TEXT_COLOR_HOVER = '#28272d'; // Used for the text of a neutral action in the hover state.
33
+ export const GL_ACTION_NEUTRAL_TEXT_COLOR_FOCUS = '#28272d'; // Used for the text of a neutral action in the focus state.
34
+ export const GL_ACTION_NEUTRAL_TEXT_COLOR_ACTIVE = '#28272d'; // Used for the text of a neutral action in the active state.
35
35
  export const GL_ACTION_NEUTRAL_TEXT_COLOR_STRONG = '#fff'; // Used for the text on a solid, strong neutral action background.
36
36
  export const GL_ACTION_NEUTRAL_ICON_COLOR_DEFAULT = '#737278'; // Used for the icon of outlined and borderless neutral actions.
37
- export const GL_ACTION_NEUTRAL_ICON_COLOR_HOVER = '#535158'; // Used for the icon of outlined and borderless neutral actions in the hover state.
38
- export const GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS = '#535158'; // Used for the icon of outlined and borderless neutral actions in the focus state.
39
- export const GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE = '#333238'; // Used for the icon of outlined and borderless neutral actions in the active state.
37
+ export const GL_ACTION_NEUTRAL_ICON_COLOR_HOVER = '#4c4b51'; // Used for the icon of outlined and borderless neutral actions in the hover state.
38
+ export const GL_ACTION_NEUTRAL_ICON_COLOR_FOCUS = '#4c4b51'; // Used for the icon of outlined and borderless neutral actions in the focus state.
39
+ export const GL_ACTION_NEUTRAL_ICON_COLOR_ACTIVE = '#28272d'; // Used for the icon of outlined and borderless neutral actions in the active state.
40
40
  export const GL_ACTION_NEUTRAL_ICON_COLOR_STRONG = '#fff'; // Used for the icon on a solid, strong neutral action background.
41
41
  export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for the background of an outlined confirm (positive) action in the default state.
42
42
  export const GL_ACTION_CONFIRM_BACKGROUND_COLOR_HOVER = '#e9f3fc'; // Used for the background of an outlined confirm (positive) action in the hover state.
@@ -104,18 +104,18 @@ export const GL_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for the default backg
104
104
  export const GL_BACKGROUND_COLOR_SUBTLE = '#fbfafd'; // Used to slightly differentiate the background from the default.
105
105
  export const GL_BACKGROUND_COLOR_STRONG = '#ececef'; // Used to make the background easily stand out from the default.
106
106
  export const GL_BACKGROUND_COLOR_DISABLED = '#fbfafd'; // Used to identify a disabled section.
107
- export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(31, 30, 36, 0.24)'; // Used for an overlay that covers other content.
107
+ export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(05, 05, 06, 0.24)'; // Used for an overlay that covers other content.
108
108
  export const GL_BORDER_COLOR_DEFAULT = '#dcdcde'; // Used for the default border color.
109
109
  export const GL_BORDER_COLOR_SUBTLE = '#ececef'; // Used for a subtle border in combination with the default background.
110
110
  export const GL_BORDER_COLOR_STRONG = '#89888d'; // Used for a distinct border that emphasizes an edge or boundaries.
111
111
  export const GL_BORDER_COLOR_TRANSPARENT = 'transparent'; // Used when a border needs to be present, but not visibly perceived.
112
112
  export const GL_COLOR_ALPHA_0 = 'transparent';
113
- export const GL_COLOR_ALPHA_DARK_2 = 'rgba(31, 30, 36, 0.02)';
114
- export const GL_COLOR_ALPHA_DARK_4 = 'rgba(31, 30, 36, 0.04)';
115
- export const GL_COLOR_ALPHA_DARK_6 = 'rgba(31, 30, 36, 0.06)';
116
- export const GL_COLOR_ALPHA_DARK_8 = 'rgba(31, 30, 36, 0.08)';
117
- export const GL_COLOR_ALPHA_DARK_16 = 'rgba(31, 30, 36, 0.16)';
118
- export const GL_COLOR_ALPHA_DARK_24 = 'rgba(31, 30, 36, 0.24)';
113
+ export const GL_COLOR_ALPHA_DARK_2 = 'rgba(05, 05, 06, 0.02)';
114
+ export const GL_COLOR_ALPHA_DARK_4 = 'rgba(05, 05, 06, 0.04)';
115
+ export const GL_COLOR_ALPHA_DARK_6 = 'rgba(05, 05, 06, 0.06)';
116
+ export const GL_COLOR_ALPHA_DARK_8 = 'rgba(05, 05, 06, 0.08)';
117
+ export const GL_COLOR_ALPHA_DARK_16 = 'rgba(05, 05, 06, 0.16)';
118
+ export const GL_COLOR_ALPHA_DARK_24 = 'rgba(05, 05, 06, 0.24)';
119
119
  export const GL_COLOR_ALPHA_LIGHT_2 = 'rgba(255, 255, 255, 0.02)';
120
120
  export const GL_COLOR_ALPHA_LIGHT_4 = 'rgba(255, 255, 255, 0.04)';
121
121
  export const GL_COLOR_ALPHA_LIGHT_6 = 'rgba(255, 255, 255, 0.06)';
@@ -143,11 +143,11 @@ export const GL_COLOR_NEUTRAL_300 = '#a4a3a8';
143
143
  export const GL_COLOR_NEUTRAL_400 = '#89888d';
144
144
  export const GL_COLOR_NEUTRAL_500 = '#737278';
145
145
  export const GL_COLOR_NEUTRAL_600 = '#626168';
146
- export const GL_COLOR_NEUTRAL_700 = '#535158';
147
- export const GL_COLOR_NEUTRAL_800 = '#434248';
148
- export const GL_COLOR_NEUTRAL_900 = '#333238';
149
- export const GL_COLOR_NEUTRAL_950 = '#1f1e24';
150
- export const GL_COLOR_NEUTRAL_1000 = '#000';
146
+ export const GL_COLOR_NEUTRAL_700 = '#4c4b51';
147
+ export const GL_COLOR_NEUTRAL_800 = '#3a383f';
148
+ export const GL_COLOR_NEUTRAL_900 = '#28272d';
149
+ export const GL_COLOR_NEUTRAL_950 = '#18171d';
150
+ export const GL_COLOR_NEUTRAL_1000 = '#050506';
151
151
  export const GL_COLOR_GREEN_50 = '#ecf4ee';
152
152
  export const GL_COLOR_GREEN_100 = '#c3e6cd';
153
153
  export const GL_COLOR_GREEN_200 = '#91d4a8';
@@ -406,7 +406,7 @@ export const THEME_LIGHT_RED_700 = '#a02e1c';
406
406
  export const THEME_LIGHT_RED_800 = '#8b2212';
407
407
  export const THEME_LIGHT_RED_900 = '#751709';
408
408
  export const THEME_LIGHT_RED_950 = '#5c1105';
409
- export const BLACK = '#000';
409
+ export const BLACK = '#050506';
410
410
  export const WHITE = '#fff';
411
411
  export const BLUE_50 = '#e9f3fc';
412
412
  export const BLUE_100 = '#cbe2f9';
@@ -427,10 +427,10 @@ export const GRAY_300 = '#a4a3a8';
427
427
  export const GRAY_400 = '#89888d';
428
428
  export const GRAY_500 = '#737278';
429
429
  export const GRAY_600 = '#626168';
430
- export const GRAY_700 = '#535158';
431
- export const GRAY_800 = '#434248';
432
- export const GRAY_900 = '#333238';
433
- export const GRAY_950 = '#1f1e24';
430
+ export const GRAY_700 = '#4c4b51';
431
+ export const GRAY_800 = '#3a383f';
432
+ export const GRAY_900 = '#28272d';
433
+ export const GRAY_950 = '#18171d';
434
434
  export const GREEN_50 = '#ecf4ee';
435
435
  export const GREEN_100 = '#c3e6cd';
436
436
  export const GREEN_200 = '#91d4a8';
@@ -486,12 +486,12 @@ export const BRAND_GRAY_02 = '#a2a1a6';
486
486
  export const BRAND_GRAY_03 = '#74717a';
487
487
  export const BRAND_GRAY_04 = '#45424d';
488
488
  export const BRAND_GRAY_05 = '#2b2838';
489
- export const T_GRAY_A_16 = 'rgba(31, 30, 36, 0.16)';
490
- export const T_GRAY_A_24 = 'rgba(31, 30, 36, 0.24)';
491
- export const T_GRAY_A_02 = 'rgba(31, 30, 36, 0.02)';
492
- export const T_GRAY_A_04 = 'rgba(31, 30, 36, 0.04)';
493
- export const T_GRAY_A_06 = 'rgba(31, 30, 36, 0.06)';
494
- export const T_GRAY_A_08 = 'rgba(31, 30, 36, 0.08)';
489
+ export const T_GRAY_A_16 = 'rgba(05, 05, 06, 0.16)';
490
+ export const T_GRAY_A_24 = 'rgba(05, 05, 06, 0.24)';
491
+ export const T_GRAY_A_02 = 'rgba(05, 05, 06, 0.02)';
492
+ export const T_GRAY_A_04 = 'rgba(05, 05, 06, 0.04)';
493
+ export const T_GRAY_A_06 = 'rgba(05, 05, 06, 0.06)';
494
+ export const T_GRAY_A_08 = 'rgba(05, 05, 06, 0.08)';
495
495
  export const T_WHITE_A_16 = 'rgba(255, 255, 255, 0.16)';
496
496
  export const T_WHITE_A_24 = 'rgba(255, 255, 255, 0.24)';
497
497
  export const T_WHITE_A_36 = 'rgba(255, 255, 255, 0.36)';
@@ -499,8 +499,8 @@ export const T_WHITE_A_02 = 'rgba(255, 255, 255, 0.02)';
499
499
  export const T_WHITE_A_04 = 'rgba(255, 255, 255, 0.04)';
500
500
  export const T_WHITE_A_06 = 'rgba(255, 255, 255, 0.06)';
501
501
  export const T_WHITE_A_08 = 'rgba(255, 255, 255, 0.08)';
502
- export const GL_AVATAR_BORDER_COLOR_DEFAULT = 'rgba(31, 30, 36, 0.08)'; // Used to define the edge of an avatar.
503
- export const GL_AVATAR_BORDER_COLOR_HOVER = 'rgba(31, 30, 36, 0.24)'; // Used to increase the edge definition of an avatar in the hover state.
502
+ export const GL_AVATAR_BORDER_COLOR_DEFAULT = 'rgba(05, 05, 06, 0.08)'; // Used to define the edge of an avatar.
503
+ export const GL_AVATAR_BORDER_COLOR_HOVER = 'rgba(05, 05, 06, 0.24)'; // Used to increase the edge definition of an avatar in the hover state.
504
504
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_RED = '#fcf1ef'; // Red background for avatar fallback with no particular meaning.
505
505
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_PURPLE = '#f4f0ff'; // Purple background for avatar fallback with no particular meaning.
506
506
  export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE = '#e9f3fc'; // Blue background for avatar fallback with no particular meaning.
@@ -510,27 +510,27 @@ export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL = '#ececef'; // Neutral
510
510
  export const GL_BANNER_INTRO_BORDER_COLOR = '#63a6e9'; // Used to compliment the info banner.
511
511
  export const GL_BANNER_PROMO_BACKGROUND_COLOR = '#fbfafd'; // Used as background for the default banner type.
512
512
  export const GL_BREADCRUMB_SEPARATOR_COLOR = '#bfbfc3'; // Used for the breadcrumb level separator.
513
- export const GL_LABEL_LIGHT_TEXT_COLOR = '#1f1e24'; // Used for the label text color on a light background color.
513
+ export const GL_LABEL_LIGHT_TEXT_COLOR = '#18171d'; // Used for the label text color on a light background color.
514
514
  export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_DEFAULT = 'transparent'; // Used for the label remove button background on a light background color in the default state.
515
- export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_HOVER = '#1f1e24'; // Used for the label remove button background on a light background color in the hover state.
516
- export const GL_LABEL_LIGHT_BUTTON_ICON_COLOR_DEFAULT = '#1f1e24'; // Used for the label remove button icon on a light background color in the default state.
515
+ export const GL_LABEL_LIGHT_BUTTON_BACKGROUND_COLOR_HOVER = '#18171d'; // Used for the label remove button background on a light background color in the hover state.
516
+ export const GL_LABEL_LIGHT_BUTTON_ICON_COLOR_DEFAULT = '#18171d'; // Used for the label remove button icon on a light background color in the default state.
517
517
  export const GL_LABEL_DARK_TEXT_COLOR = '#fff'; // Used for the label text color on a dark background color.
518
518
  export const GL_LABEL_DARK_BUTTON_BACKGROUND_COLOR_DEFAULT = 'transparent'; // Used for the label remove button background on a dark background color in the default state.
519
519
  export const GL_LABEL_DARK_BUTTON_BACKGROUND_COLOR_HOVER = '#fff'; // Used for the label remove button background on a dark background color in the hover state.
520
520
  export const GL_LABEL_DARK_BUTTON_ICON_COLOR_DEFAULT = '#fff'; // Used for the label remove button icon on a dark background color in the default state.
521
- export const GL_LABEL_SCOPED_TEXT_COLOR = '#1f1e24'; // Used for the scoped label text color.
522
- export const GL_LABEL_SCOPED_BUTTON_BACKGROUND_COLOR_HOVER = '#1f1e24'; // Used for the scoped label remove button background in the hover state.
523
- export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_DEFAULT = '#1f1e24'; // Used for the scoped label remove button icon in the default state.
521
+ export const GL_LABEL_SCOPED_TEXT_COLOR = '#18171d'; // Used for the scoped label text color.
522
+ export const GL_LABEL_SCOPED_BUTTON_BACKGROUND_COLOR_HOVER = '#18171d'; // Used for the scoped label remove button background in the hover state.
523
+ export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_DEFAULT = '#18171d'; // Used for the scoped label remove button icon in the default state.
524
524
  export const GL_LABEL_SCOPED_BUTTON_ICON_COLOR_HOVER = '#fff'; // Used for the scoped label remove button icon in the hover state.
525
525
  export const GL_POPOVER_BACKGROUND_COLOR = '#fff'; // Used for the background color of popover.
526
526
  export const GL_SKELETON_LOADER_BACKGROUND_COLOR = '#dcdcde'; // Used for the skeleton loader background color.
527
527
  export const GL_SKELETON_LOADER_SHIMMER_COLOR = '#ececef'; // Used for the animated shimmer effect in a skeleton loader.
528
528
  export const GL_SPINNER_TRACK_COLOR_DEFAULT = '#dcdcde'; // Used for the static track (background) of a loading spinner.
529
- export const GL_SPINNER_TRACK_COLOR_LIGHT = '#434248'; // Used for the static track (background) of a loading spinner on a dark background.
530
- export const GL_SPINNER_SEGMENT_COLOR_DEFAULT = '#535158'; // Used for the animated segment of a loading spinner.
529
+ export const GL_SPINNER_TRACK_COLOR_LIGHT = '#3a383f'; // Used for the static track (background) of a loading spinner on a dark background.
530
+ export const GL_SPINNER_SEGMENT_COLOR_DEFAULT = '#4c4b51'; // Used for the animated segment of a loading spinner.
531
531
  export const GL_SPINNER_SEGMENT_COLOR_LIGHT = '#bfbfc3'; // Used for the animated segment of a loading spinner on a dark background.
532
532
  export const GL_TABLE_ROW_BACKGROUND_COLOR_HOVER = '#fbfafd'; // Used for the background of a table row in hover state.
533
- export const GL_TABLE_SORTING_ICON_COLOR = '#1f1e24'; // Used for the color of the sorting icons in the column headers.
533
+ export const GL_TABLE_SORTING_ICON_COLOR = '#18171d'; // Used for the color of the sorting icons in the column headers.
534
534
  export const GL_CONTROL_BACKGROUND_COLOR_DEFAULT = '#fff'; // Used for form control (input, radio button, checkbox, textarea) default background.
535
535
  export const GL_CONTROL_BACKGROUND_COLOR_DISABLED = '#fbfafd'; // Used for disabled form control (checkbox, input, radio button, textarea) background.
536
536
  export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_DEFAULT = '#1f75cb'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) background.
@@ -538,7 +538,7 @@ export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_HOVER = '#0b5cad'; // Used for
538
538
  export const GL_CONTROL_BACKGROUND_COLOR_SELECTED_FOCUS = '#0b5cad'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) background on hover.
539
539
  export const GL_CONTROL_BORDER_COLOR_DEFAULT = '#89888d'; // Used for form control (input, radio button, checkbox, textarea) default border.
540
540
  export const GL_CONTROL_BORDER_COLOR_HOVER = '#626168'; // Used for form control (input, radio button, checkbox, textarea) border on hover.
541
- export const GL_CONTROL_BORDER_COLOR_FOCUS = '#333238'; // Used for form control (input, radio button, checkbox, textarea) border on focus.
541
+ export const GL_CONTROL_BORDER_COLOR_FOCUS = '#28272d'; // Used for form control (input, radio button, checkbox, textarea) border on focus.
542
542
  export const GL_CONTROL_BORDER_COLOR_DISABLED = '#dcdcde'; // Used for disabled form control (input, radio button, checkbox, textarea) border.
543
543
  export const GL_CONTROL_BORDER_COLOR_ERROR = '#dd2b0e'; // Used for invalid form control (input, textarea) border.
544
544
  export const GL_CONTROL_BORDER_COLOR_SELECTED_DEFAULT = '#1f75cb'; // Used for checked and indeterminate (selected) form control (checkbox, radio button) border.
@@ -549,7 +549,7 @@ export const GL_CONTROL_TEXT_COLOR_VALID = '#108548'; // Used for the helper tex
549
549
  export const GL_CONTROL_PLACEHOLDER_COLOR = '#89888d'; // Used for placeholder text within inputs.
550
550
  export const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#fff'; // Used for checkbox and radio button state indicators.
551
551
  export const GL_CONTROL_INDICATOR_COLOR_DISABLED = '#737278'; // Used for disabled checkbox and radio button state indicators.
552
- export const GL_FEEDBACK_BACKGROUND_COLOR_STRONG = '#1f1e24'; // Used for a background associated with feedback like a tooltip or toast message.
552
+ export const GL_FEEDBACK_BACKGROUND_COLOR_STRONG = '#18171d'; // Used for a background associated with feedback like a tooltip or toast message.
553
553
  export const GL_FEEDBACK_TEXT_COLOR_STRONG = '#fff'; // Used for text on a strong feedback background.
554
554
  export const GL_FEEDBACK_ICON_COLOR_STRONG = '#fff'; // Used for an icon on a strong feedback background.
555
555
  export const GL_FEEDBACK_LINK_COLOR_STRONG = '#63a6e9'; // Used for a link on a strong feedback background.
@@ -565,9 +565,9 @@ export const GL_FEEDBACK_DANGER_BACKGROUND_COLOR = '#fcf1ef'; // Used for a back
565
565
  export const GL_FEEDBACK_DANGER_ICON_COLOR = '#c91c00'; // Used for an icon associated with danger or critical feedback.
566
566
  export const GL_FOCUS_RING_OUTER_COLOR = '#1f75cb'; // Used for the outer color portion of the focus ring.
567
567
  export const GL_FOCUS_RING_INNER_COLOR = '#fff'; // Used for the inner neutral portion of the focus ring.
568
- export const GL_ICON_COLOR_DEFAULT = '#535158'; // Used for the default icon color. Can be paired with default text.
568
+ export const GL_ICON_COLOR_DEFAULT = '#4c4b51'; // Used for the default icon color. Can be paired with default text.
569
569
  export const GL_ICON_COLOR_SUBTLE = '#737278'; // Used for a static or decorational icon. Can be paired with subtle text.
570
- export const GL_ICON_COLOR_STRONG = '#333238'; // Used for an icon with the highest contrast.
570
+ export const GL_ICON_COLOR_STRONG = '#28272d'; // Used for an icon with the highest contrast.
571
571
  export const GL_ICON_COLOR_DISABLED = '#a4a3a8'; // Used for an icon within a disabled section.
572
572
  export const GL_ICON_COLOR_LINK = '#1068bf'; // Used for an icon within a link.
573
573
  export const GL_ICON_COLOR_INFO = '#1068bf'; // Used for an icon associated with information or help.
@@ -584,29 +584,29 @@ export const GL_LINE_HEIGHT_36 = '2.25rem';
584
584
  export const GL_LINE_HEIGHT_42 = '2.625rem';
585
585
  export const GL_LINE_HEIGHT_44 = '2.75rem';
586
586
  export const GL_LINE_HEIGHT_52 = '3.25rem';
587
- export const GL_SHADOW_COLOR_DEFAULT = 'rgba(5, 5, 6, 0.16)'; // Used for the default shadow color.
587
+ export const GL_SHADOW_COLOR_DEFAULT = 'rgba(05, 05, 06, 0.16)'; // Used for the default shadow color.
588
588
  export const GL_STATUS_MUTED_BACKGROUND_COLOR_DEFAULT = '#ececef'; // Used for the background of a subtle neutral status item when static or the default state when linked.
589
589
  export const GL_STATUS_MUTED_BACKGROUND_COLOR_ACTIVE = '#dcdcde'; // Used for the background of a subtle neutral status item in the active state.
590
590
  export const GL_STATUS_MUTED_BORDER_COLOR_HOVER = '#bfbfc3'; // Used for the border of a subtle neutral status item in the hover state.
591
591
  export const GL_STATUS_MUTED_TEXT_COLOR_DEFAULT = '#626168'; // Used for the text of a subtle neutral status item when static or the default state when linked.
592
- export const GL_STATUS_MUTED_TEXT_COLOR_HOVER = '#535158'; // Used for the text of a subtle neutral status item in the hover state.
593
- export const GL_STATUS_MUTED_TEXT_COLOR_FOCUS = '#535158'; // Used for the text of a subtle neutral status item in the focus state.
594
- export const GL_STATUS_MUTED_TEXT_COLOR_ACTIVE = '#434248'; // Used for the text of a subtle neutral status item in the active state.
592
+ export const GL_STATUS_MUTED_TEXT_COLOR_HOVER = '#4c4b51'; // Used for the text of a subtle neutral status item in the hover state.
593
+ export const GL_STATUS_MUTED_TEXT_COLOR_FOCUS = '#4c4b51'; // Used for the text of a subtle neutral status item in the focus state.
594
+ export const GL_STATUS_MUTED_TEXT_COLOR_ACTIVE = '#3a383f'; // Used for the text of a subtle neutral status item in the active state.
595
595
  export const GL_STATUS_MUTED_ICON_COLOR_DEFAULT = '#737278'; // Used for the icon of a subtle neutral status item when static or the default state when linked.
596
596
  export const GL_STATUS_MUTED_ICON_COLOR_HOVER = '#626168'; // Used for the icon of a subtle neutral status item in the hover state.
597
597
  export const GL_STATUS_MUTED_ICON_COLOR_FOCUS = '#626168'; // Used for the icon of a subtle neutral status item in the focus state.
598
- export const GL_STATUS_MUTED_ICON_COLOR_ACTIVE = '#535158'; // Used for the icon of a subtle neutral status item in the active state.
598
+ export const GL_STATUS_MUTED_ICON_COLOR_ACTIVE = '#4c4b51'; // Used for the icon of a subtle neutral status item in the active state.
599
599
  export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#dcdcde'; // Used for the background of a neutral status item when static or the default state when linked.
600
600
  export const GL_STATUS_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#bfbfc3'; // Used for the background of a neutral status item in the active state.
601
601
  export const GL_STATUS_NEUTRAL_BORDER_COLOR_HOVER = '#bfbfc3'; // Used for the border of a neutral status item in the hover state.
602
- export const GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT = '#535158'; // Used for the text of a neutral status item when static or the default state when linked.
603
- export const GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER = '#434248'; // Used for the text of a neutral status item in the hover state.
604
- export const GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS = '#434248'; // Used for the text of a neutral status item in the focus state.
605
- export const GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE = '#333238'; // Used for the text of a neutral status item in the active state.
602
+ export const GL_STATUS_NEUTRAL_TEXT_COLOR_DEFAULT = '#4c4b51'; // Used for the text of a neutral status item when static or the default state when linked.
603
+ export const GL_STATUS_NEUTRAL_TEXT_COLOR_HOVER = '#3a383f'; // Used for the text of a neutral status item in the hover state.
604
+ export const GL_STATUS_NEUTRAL_TEXT_COLOR_FOCUS = '#3a383f'; // Used for the text of a neutral status item in the focus state.
605
+ export const GL_STATUS_NEUTRAL_TEXT_COLOR_ACTIVE = '#28272d'; // Used for the text of a neutral status item in the active state.
606
606
  export const GL_STATUS_NEUTRAL_ICON_COLOR_DEFAULT = '#737278'; // Used for the icon of a neutral status item when static or the default state when linked.
607
607
  export const GL_STATUS_NEUTRAL_ICON_COLOR_HOVER = '#626168'; // Used for the icon of a neutral status item in the hover state.
608
608
  export const GL_STATUS_NEUTRAL_ICON_COLOR_FOCUS = '#626168'; // Used for the icon of a neutral status item in the focus state.
609
- export const GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE = '#535158'; // Used for the icon of a neutral status item in the active state.
609
+ export const GL_STATUS_NEUTRAL_ICON_COLOR_ACTIVE = '#4c4b51'; // Used for the icon of a neutral status item in the active state.
610
610
  export const GL_STATUS_INFO_BACKGROUND_COLOR_DEFAULT = '#cbe2f9'; // Used for the background of an informational status item when static or the default state when linked.
611
611
  export const GL_STATUS_INFO_BACKGROUND_COLOR_ACTIVE = '#9dc7f1'; // Used for the background of an informational status item in the active state.
612
612
  export const GL_STATUS_INFO_BORDER_COLOR_HOVER = '#9dc7f1'; // Used for the border of an informational status item in the hover state.
@@ -662,13 +662,13 @@ export const GL_STATUS_BRAND_ICON_COLOR_DEFAULT = '#7b58cf'; // Used for the ico
662
662
  export const GL_STATUS_BRAND_ICON_COLOR_HOVER = '#694cc0'; // Used for the icon of a brand related status item in the hover state.
663
663
  export const GL_STATUS_BRAND_ICON_COLOR_FOCUS = '#694cc0'; // Used for the icon of a brand related status item in the focus state.
664
664
  export const GL_STATUS_BRAND_ICON_COLOR_ACTIVE = '#5943b6'; // Used for the icon of a brand related status item in the active state.
665
- export const GL_TEXT_PRIMARY = '#333238'; // Use text.color.default instead
665
+ export const GL_TEXT_PRIMARY = '#28272d'; // Use text.color.default instead
666
666
  export const GL_TEXT_SECONDARY = '#737278'; // Use text.color.subtle instead
667
667
  export const GL_TEXT_TERTIARY = '#89888d'; // Use text.color.disabled instead
668
- export const GL_TEXT_COLOR_DEFAULT = '#434248'; // Used for the default text color.
668
+ export const GL_TEXT_COLOR_DEFAULT = '#3a383f'; // Used for the default text color.
669
669
  export const GL_TEXT_COLOR_SUBTLE = '#626168'; // Used for supplemental text that doesn't need to be as prominent as other text.
670
- export const GL_TEXT_COLOR_STRONG = '#1f1e24'; // Used for text with the highest contrast.
671
- export const GL_TEXT_COLOR_HEADING = '#1f1e24'; // Used for headings level 1-6.
670
+ export const GL_TEXT_COLOR_STRONG = '#18171d'; // Used for text with the highest contrast.
671
+ export const GL_TEXT_COLOR_HEADING = '#18171d'; // Used for headings level 1-6.
672
672
  export const GL_TEXT_COLOR_LINK = '#0b5cad'; // Used for default text links.
673
673
  export const GL_TEXT_COLOR_DANGER = '#c91c00'; // Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination.
674
674
  export const GL_TEXT_COLOR_SUCCESS = '#217645'; // Used for text indicating success or validity.