@k8slens/lds-tokens 0.1.20 → 0.2.1
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/lib/docs/token-map.dark.d.ts +1 -1
- package/lib/docs/token-map.dark.js +4 -6
- package/lib/docs/token-map.light.d.ts +1 -1
- package/lib/docs/token-map.light.js +6 -6
- package/lib/electron/font-face.css +1 -1
- package/lib/electron/icons/action.js +1 -1
- package/lib/electron/icons/base.js +1 -1
- package/lib/electron/icons/idp.js +1 -1
- package/lib/electron/icons/misc.js +1 -1
- package/lib/electron/icons/navigation.js +1 -1
- package/lib/electron/images/index.js +1 -1
- package/lib/electron/tokens.dark.css +2 -2
- package/lib/electron/tokens.dark.js +2 -2
- package/lib/electron/tokens.dark.scoped.css +2 -2
- package/lib/electron/tokens.dark.ts +233 -0
- package/lib/electron/tokens.light.css +2 -2
- package/lib/electron/tokens.light.js +2 -2
- package/lib/electron/tokens.light.scoped.css +2 -2
- package/lib/electron/tokens.light.ts +233 -0
- package/lib/web/colors/dark.js +1 -1
- package/lib/web/colors/light.js +1 -1
- package/lib/web/font-imports.css +1 -1
- package/lib/web/icons/action.js +1 -1
- package/lib/web/icons/base.js +1 -1
- package/lib/web/icons/idp.js +1 -1
- package/lib/web/icons/misc.js +1 -1
- package/lib/web/icons/navigation.js +1 -1
- package/lib/web/images/index.js +1 -1
- package/lib/web/tailwind.config.cjs +1 -1
- package/lib/web/tailwind.config.js +1 -1
- package/lib/web/tokens.dark.css +2 -2
- package/lib/web/tokens.dark.js +2 -2
- package/lib/web/tokens.dark.scoped.css +2 -2
- package/lib/web/tokens.dark.ts +237 -0
- package/lib/web/tokens.light.css +2 -2
- package/lib/web/tokens.light.js +2 -2
- package/lib/web/tokens.light.scoped.css +2 -2
- package/lib/web/tokens.light.ts +237 -0
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:40 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
const tokenMap = {
|
|
@@ -1069,6 +1069,7 @@ const tokenMap = {
|
|
|
1069
1069
|
"hues.blue-gray.hue"
|
|
1070
1070
|
],
|
|
1071
1071
|
"inheritedBy": [
|
|
1072
|
+
"alias.color.text.primary",
|
|
1072
1073
|
"alias.color.border.strong"
|
|
1073
1074
|
]
|
|
1074
1075
|
},
|
|
@@ -1153,9 +1154,6 @@ const tokenMap = {
|
|
|
1153
1154
|
"attributes": {},
|
|
1154
1155
|
"inherits": [
|
|
1155
1156
|
"color.base.blue-gray.450"
|
|
1156
|
-
],
|
|
1157
|
-
"inheritedBy": [
|
|
1158
|
-
"alias.color.text.primary"
|
|
1159
1157
|
]
|
|
1160
1158
|
}
|
|
1161
1159
|
},
|
|
@@ -3581,14 +3579,14 @@ const tokenMap = {
|
|
|
3581
3579
|
"name": "AliasColorTextPrimary",
|
|
3582
3580
|
"code": "$alias-color-text-primary",
|
|
3583
3581
|
"variable": "alias-color-text-primary",
|
|
3584
|
-
"value": "hsl(206deg, 6%,
|
|
3582
|
+
"value": "hsl(206deg, 6%, 55%)",
|
|
3585
3583
|
"attributes": {
|
|
3586
3584
|
"tailwind": [
|
|
3587
3585
|
"textColor.DEFAULT"
|
|
3588
3586
|
]
|
|
3589
3587
|
},
|
|
3590
3588
|
"inherits": [
|
|
3591
|
-
"color.base.blue-gray.
|
|
3589
|
+
"color.base.blue-gray.550"
|
|
3592
3590
|
]
|
|
3593
3591
|
},
|
|
3594
3592
|
"secondary": {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:40 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
const tokenMap = {
|
|
@@ -1027,6 +1027,9 @@ const tokenMap = {
|
|
|
1027
1027
|
"attributes": {},
|
|
1028
1028
|
"inherits": [
|
|
1029
1029
|
"hues.blue-gray.hue"
|
|
1030
|
+
],
|
|
1031
|
+
"inheritedBy": [
|
|
1032
|
+
"alias.color.text.primary"
|
|
1030
1033
|
]
|
|
1031
1034
|
},
|
|
1032
1035
|
"450": {
|
|
@@ -1151,9 +1154,6 @@ const tokenMap = {
|
|
|
1151
1154
|
"attributes": {},
|
|
1152
1155
|
"inherits": [
|
|
1153
1156
|
"color.base.blue-gray.450"
|
|
1154
|
-
],
|
|
1155
|
-
"inheritedBy": [
|
|
1156
|
-
"alias.color.text.primary"
|
|
1157
1157
|
]
|
|
1158
1158
|
}
|
|
1159
1159
|
},
|
|
@@ -3579,14 +3579,14 @@ const tokenMap = {
|
|
|
3579
3579
|
"name": "AliasColorTextPrimary",
|
|
3580
3580
|
"code": "$alias-color-text-primary",
|
|
3581
3581
|
"variable": "alias-color-text-primary",
|
|
3582
|
-
"value": "hsl(206deg, 6%,
|
|
3582
|
+
"value": "hsl(206deg, 6%, 35%)",
|
|
3583
3583
|
"attributes": {
|
|
3584
3584
|
"tailwind": [
|
|
3585
3585
|
"textColor.DEFAULT"
|
|
3586
3586
|
]
|
|
3587
3587
|
},
|
|
3588
3588
|
"inherits": [
|
|
3589
|
-
"color.base.blue-gray.
|
|
3589
|
+
"color.base.blue-gray.350"
|
|
3590
3590
|
]
|
|
3591
3591
|
},
|
|
3592
3592
|
"secondary": {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -197,12 +197,12 @@
|
|
|
197
197
|
--alias-color-text-quarternary: var(--color-base-blue-gray-850);
|
|
198
198
|
--alias-color-text-tertiary: var(--color-base-blue-gray-650);
|
|
199
199
|
--alias-color-text-secondary: var(--color-base-blue-gray-350);
|
|
200
|
+
--alias-color-text-primary: var(--color-base-blue-gray-550);
|
|
200
201
|
--alias-color-brand-primary: var(--color-base-blue-default);
|
|
201
202
|
--spacing-button-bar-gap: var(--spacing-button-bar-padding-block);
|
|
202
203
|
--color-background-switch-track-active: var(--color-base-bright-green-default);
|
|
203
204
|
--color-background-button-caution-base: var(--alias-color-caution-dark);
|
|
204
205
|
--color-base-blue-gray-default: var(--color-base-blue-gray-450); /* Background, text, borders, etc. */
|
|
205
|
-
--alias-color-text-primary: var(--color-base-blue-gray-default);
|
|
206
206
|
--color-font-input-placeholder: var(--alias-color-text-secondary);
|
|
207
207
|
--color-font-input-default: var(--alias-color-text-tertiary);
|
|
208
208
|
--color-font-button-danger-discreet: var(--alias-color-danger);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
|
|
@@ -197,12 +197,12 @@ export const AliasColorBorderWeak = ColorBaseBlueGray230;
|
|
|
197
197
|
export const AliasColorTextQuarternary = ColorBaseBlueGray850;
|
|
198
198
|
export const AliasColorTextTertiary = ColorBaseBlueGray650;
|
|
199
199
|
export const AliasColorTextSecondary = ColorBaseBlueGray350;
|
|
200
|
+
export const AliasColorTextPrimary = ColorBaseBlueGray550;
|
|
200
201
|
export const AliasColorBrandPrimary = `${ColorBaseBlueDefault}`;
|
|
201
202
|
export const SpacingButtonBarGap = SpacingButtonBarPaddingBlock;
|
|
202
203
|
export const ColorBackgroundSwitchTrackActive = `${ColorBaseBrightGreenDefault}`;
|
|
203
204
|
export const ColorBackgroundButtonCautionBase = AliasColorCautionDark;
|
|
204
205
|
export const ColorBaseBlueGrayDefault = ColorBaseBlueGray450; // Background, text, borders, etc.
|
|
205
|
-
export const AliasColorTextPrimary = ColorBaseBlueGrayDefault;
|
|
206
206
|
export const ColorFontInputPlaceholder = AliasColorTextSecondary;
|
|
207
207
|
export const ColorFontInputDefault = AliasColorTextTertiary;
|
|
208
208
|
export const ColorFontButtonDangerDiscreet = AliasColorDanger;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
html.dark {
|
|
7
7
|
--alias-color-brand-primary: hsl(206deg, 60%, 52%);
|
|
8
|
-
--alias-color-text-primary: hsl(206deg, 6%,
|
|
8
|
+
--alias-color-text-primary: hsl(206deg, 6%, 55%);
|
|
9
9
|
--alias-color-text-secondary: hsl(206deg, 6%, 35%);
|
|
10
10
|
--alias-color-text-tertiary: hsl(206deg, 5%, 65%);
|
|
11
11
|
--alias-color-text-quarternary: hsl(206deg, 15%, 85%);
|
|
@@ -0,0 +1,233 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Do not edit directly
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
export const TransitionBaseEasingInOut = "ease-in-out";
|
|
8
|
+
export const TransitionBaseEasingDefault = "ease";
|
|
9
|
+
export const TransitionBaseDurationSlow = ".75s";
|
|
10
|
+
export const TransitionBaseDurationDefault = ".25s";
|
|
11
|
+
export const ShadowSwitchThumbFocused = "0 0 0 2px var(--alias-color-brand-primary)";
|
|
12
|
+
export const OpacityBaseDisabled = 0.5;
|
|
13
|
+
export const TypographyBaseLineHeight9xl = 1;
|
|
14
|
+
export const TypographyBaseLineHeight8xl = 1;
|
|
15
|
+
export const TypographyBaseLineHeight7xl = 1;
|
|
16
|
+
export const TypographyBaseLineHeight6xl = 1;
|
|
17
|
+
export const TypographyBaseFontLegacy = "'Roboto', 'Helvetica', 'Arial', sans-serif"; // Legacy Lens font, will be replaced with Open Sans
|
|
18
|
+
export const TypographyBaseFontPrimary = "'Open Sans', sans-serif";
|
|
19
|
+
export const SpacingPMarginTop = "0rem";
|
|
20
|
+
export const SpacingH4MarginBottom = "0rem";
|
|
21
|
+
export const SpacingH3MarginBottom = "0rem";
|
|
22
|
+
export const SpacingSwitchThumbSize = "20px";
|
|
23
|
+
export const SpacingBase95 = "2.375rem"; // Spacing multiplier 9.5
|
|
24
|
+
export const SpacingBase85 = "2.125rem"; // Spacing multiplier 8.5
|
|
25
|
+
export const SpacingBase75 = "1.875rem"; // Spacing multiplier 7.5
|
|
26
|
+
export const SpacingBase65 = "1.625rem"; // Spacing multiplier 6.5
|
|
27
|
+
export const SpacingBase55 = "1.375rem"; // Spacing multiplier 5.5
|
|
28
|
+
export const SpacingBase45 = "1.125rem"; // Spacing multiplier 4.5
|
|
29
|
+
export const SpacingBase35 = "0.875rem"; // Spacing multiplier 3.5
|
|
30
|
+
export const SpacingBase275 = "0.6875rem"; // Spacing multiplier 2.75
|
|
31
|
+
export const SpacingBase25 = "0.625rem"; // Spacing multiplier 2.5
|
|
32
|
+
export const SpacingBase225 = "0.5625rem"; // Spacing multiplier 2.25
|
|
33
|
+
export const SpacingBase175 = "0.4375rem"; // Spacing multiplier 1.75
|
|
34
|
+
export const SpacingBase15 = "0.375rem"; // Spacing multiplier 1.5
|
|
35
|
+
export const SpacingBase125 = "0.3125rem"; // Spacing multiplier 1.25
|
|
36
|
+
export const SpacingBase075 = "0.1875rem"; // Spacing multiplier 0.75
|
|
37
|
+
export const SpacingBase05 = "0.125rem"; // Spacing multiplier 0.5
|
|
38
|
+
export const SpacingBase025 = "0.0625rem"; // Spacing multiplier 0.25
|
|
39
|
+
export const SpacingBase96 = "24rem"; // Spacing multiplier 96
|
|
40
|
+
export const SpacingBase80 = "20rem"; // Spacing multiplier 80
|
|
41
|
+
export const SpacingBase72 = "18rem"; // Spacing multiplier 72
|
|
42
|
+
export const SpacingBase64 = "16rem"; // Spacing multiplier 64
|
|
43
|
+
export const SpacingBase60 = "15rem"; // Spacing multiplier 60
|
|
44
|
+
export const SpacingBase56 = "14rem"; // Spacing multiplier 56
|
|
45
|
+
export const SpacingBase52 = "13rem"; // Spacing multiplier 52
|
|
46
|
+
export const SpacingBase48 = "12rem"; // Spacing multiplier 48
|
|
47
|
+
export const SpacingBase44 = "11rem"; // Spacing multiplier 44
|
|
48
|
+
export const SpacingBase40 = "10rem"; // Spacing multiplier 40
|
|
49
|
+
export const SpacingBase36 = "9rem"; // Spacing multiplier 36
|
|
50
|
+
export const SpacingBase32 = "8rem"; // Spacing multiplier 32
|
|
51
|
+
export const SpacingBase28 = "7rem"; // Spacing multiplier 28
|
|
52
|
+
export const SpacingBase24 = "6rem"; // Spacing multiplier 24
|
|
53
|
+
export const SpacingBase20 = "5rem"; // Spacing multiplier 20
|
|
54
|
+
export const SpacingBase18 = "4.5rem"; // Spacing multiplier 18
|
|
55
|
+
export const SpacingBase16 = "4rem"; // Spacing multiplier 16
|
|
56
|
+
export const SpacingBase14 = "3.5rem"; // Spacing multiplier 14
|
|
57
|
+
export const SpacingBase12 = "3rem"; // Spacing multiplier 12
|
|
58
|
+
export const SpacingBase10 = "2.5rem"; // Spacing multiplier 10
|
|
59
|
+
export const SpacingBase9 = "2.25rem"; // Spacing multiplier 9
|
|
60
|
+
export const SpacingBase8 = "2rem"; // Spacing multiplier 8
|
|
61
|
+
export const SpacingBase7 = "1.75rem"; // Spacing multiplier 7
|
|
62
|
+
export const SpacingBase6 = "1.5rem"; // Spacing multiplier 6
|
|
63
|
+
export const SpacingBase5 = "1.25rem"; // Spacing multiplier 5
|
|
64
|
+
export const SpacingBase4 = "1rem"; // Spacing multiplier 4
|
|
65
|
+
export const SpacingBase3 = "0.75rem"; // Spacing multiplier 3
|
|
66
|
+
export const SpacingBase2 = "0.5rem"; // Spacing multiplier 2
|
|
67
|
+
export const SpacingBase1 = "0.25rem"; // Spacing multiplier 1
|
|
68
|
+
export const HuesBrightGreenLightness = "60%";
|
|
69
|
+
export const HuesBrightGreenSaturation = "60%";
|
|
70
|
+
export const HuesBrightGreenHue = "110";
|
|
71
|
+
export const HuesGreenLightness = "40%";
|
|
72
|
+
export const HuesGreenSaturation = "60%";
|
|
73
|
+
export const HuesGreenHue = "138";
|
|
74
|
+
export const HuesOrangeLightness = "60%";
|
|
75
|
+
export const HuesOrangeSaturation = "100%";
|
|
76
|
+
export const HuesOrangeHue = "38";
|
|
77
|
+
export const HuesRedLightness = "60%";
|
|
78
|
+
export const HuesRedSaturation = "100%";
|
|
79
|
+
export const HuesRedHue = "359";
|
|
80
|
+
export const HuesBlueLightness = "52%";
|
|
81
|
+
export const HuesBlueSaturation = "60%";
|
|
82
|
+
export const HuesBlueHue = "206deg";
|
|
83
|
+
export const ColorBaseTranslucentLight50 = "rgba(255, 255, 255, 0.5)";
|
|
84
|
+
export const ColorBaseTranslucentLight25 = "rgba(255, 255, 255, 0.25)";
|
|
85
|
+
export const ColorBaseTranslucentDark05 = "rgba(0, 0, 0, 0.05)";
|
|
86
|
+
export const ColorBaseTranslucentDark60 = "rgba(0, 0, 0, 0.4)";
|
|
87
|
+
export const ColorBaseTranslucentDark40 = "rgba(0, 0, 0, 0.4)";
|
|
88
|
+
export const ColorBaseTranslucentDark25 = "rgba(0, 0, 0, 0.25)";
|
|
89
|
+
export const ColorBaseTranslucentDark10 = "rgba(0, 0, 0, 0.1)";
|
|
90
|
+
export const ColorBaseBlack = "rgb(0, 0, 0)";
|
|
91
|
+
export const ColorBaseWhite = "rgb(255, 255, 255)";
|
|
92
|
+
export const SizeInputHeight = SpacingBase10;
|
|
93
|
+
export const SizeButtonHeight = SpacingBase10;
|
|
94
|
+
export const ShadowSwitchThumbDisabled = `inset 0 0 0 2px ${ColorBaseTranslucentDark40}`;
|
|
95
|
+
export const ShadowBaseInner = `inset 0 2px 4px 0 ${ColorBaseTranslucentDark05}`;
|
|
96
|
+
export const ShadowBase2xl = `0 25px 50px -12px ${ColorBaseTranslucentDark25}`;
|
|
97
|
+
export const ShadowBaseXl = `0 20px 25px -5px ${ColorBaseTranslucentDark10}, 0 8px 10px -6px ${ColorBaseTranslucentDark10}`;
|
|
98
|
+
export const ShadowBaseLg = `0 10px 15px -3px ${ColorBaseTranslucentDark10}, 0 4px 6px -4px ${ColorBaseTranslucentDark10}`;
|
|
99
|
+
export const ShadowBaseMd = `0 4px 6px -1px ${ColorBaseTranslucentDark10}, 0 2px 4px -2px ${ColorBaseTranslucentDark10}`;
|
|
100
|
+
export const ShadowBaseDefault = `0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px ${ColorBaseTranslucentDark10}`;
|
|
101
|
+
export const ShadowBaseSm = `0 0 0 2px ${ColorBaseTranslucentDark05}`;
|
|
102
|
+
export const AliasColorBackgroundHighlight25 = ColorBaseTranslucentLight25;
|
|
103
|
+
export const AliasColorBackgroundOverlayPopup = ColorBaseTranslucentDark60;
|
|
104
|
+
export const AliasColorBackgroundOverlayBlocked = ColorBaseTranslucentDark40;
|
|
105
|
+
export const AliasColorBackgroundElevationNegative = ColorBaseTranslucentDark40;
|
|
106
|
+
export const AliasColorBorderVivid = `${ColorBaseWhite}`;
|
|
107
|
+
export const AliasColorTextAccent = ColorBaseWhite;
|
|
108
|
+
export const TypographyBaseLineHeight5xl = SpacingBase12;
|
|
109
|
+
export const TypographyBaseLineHeight4xl = SpacingBase12;
|
|
110
|
+
export const TypographyBaseLineHeight3xl = SpacingBase12;
|
|
111
|
+
export const TypographyBaseLineHeight2xl = SpacingBase12;
|
|
112
|
+
export const TypographyBaseLineHeightXl = SpacingBase6;
|
|
113
|
+
export const TypographyBaseLineHeightLg = SpacingBase6;
|
|
114
|
+
export const TypographyBaseLineHeightBase = SpacingBase6;
|
|
115
|
+
export const TypographyBaseLineHeightSm = SpacingBase6;
|
|
116
|
+
export const TypographyBaseLineHeightXs = SpacingBase6;
|
|
117
|
+
export const TypographyBaseSize9xl = SpacingBase24;
|
|
118
|
+
export const TypographyBaseSize8xl = SpacingBase18;
|
|
119
|
+
export const TypographyBaseSize7xl = SpacingBase16;
|
|
120
|
+
export const TypographyBaseSize6xl = SpacingBase12;
|
|
121
|
+
export const TypographyBaseSize5xl = SpacingBase10;
|
|
122
|
+
export const TypographyBaseSize4xl = SpacingBase9;
|
|
123
|
+
export const TypographyBaseSize3xl = SpacingBase8;
|
|
124
|
+
export const TypographyBaseSize2xl = SpacingBase6;
|
|
125
|
+
export const TypographyBaseSizeXl = SpacingBase5;
|
|
126
|
+
export const TypographyBaseSizeLg = SpacingBase4;
|
|
127
|
+
export const TypographyBaseSizeBase = SpacingBase35;
|
|
128
|
+
export const TypographyBaseSizeSm = SpacingBase3;
|
|
129
|
+
export const TypographyBaseSizeXs = SpacingBase275;
|
|
130
|
+
export const SpacingPMarginBottom = SpacingBase6;
|
|
131
|
+
export const SpacingH4MarginTop = SpacingBase4;
|
|
132
|
+
export const SpacingH3MarginTop = SpacingBase4;
|
|
133
|
+
export const SpacingH2MarginBottom = SpacingBase6;
|
|
134
|
+
export const SpacingH2MarginTop = SpacingBase6;
|
|
135
|
+
export const SpacingH1MarginBottom = SpacingBase4;
|
|
136
|
+
export const SpacingH1MarginTop = SpacingBase8;
|
|
137
|
+
export const SpacingInputIconMarginY = SpacingBase25;
|
|
138
|
+
export const SpacingInputIconMarginX = SpacingBase25;
|
|
139
|
+
export const SpacingInputPaddingInlineEnd = SpacingBase10;
|
|
140
|
+
export const SpacingButtonIconSize = SpacingBase5;
|
|
141
|
+
export const SpacingBaseXl2 = SpacingBase8;
|
|
142
|
+
export const SpacingBaseXl = SpacingBase6;
|
|
143
|
+
export const SpacingBaseLg = SpacingBase4;
|
|
144
|
+
export const SpacingBaseMd = SpacingBase3;
|
|
145
|
+
export const SpacingBaseSm = SpacingBase2;
|
|
146
|
+
export const SpacingBaseXs = SpacingBase1;
|
|
147
|
+
export const HuesBlueGrayHue = HuesBlueHue;
|
|
148
|
+
export const ColorBackgroundSwitchThumb = ColorBaseWhite;
|
|
149
|
+
export const ColorBaseBrightGreen600 = `hsl(${HuesBrightGreenHue}, ${HuesBrightGreenSaturation}, ${HuesBrightGreenLightness})`;
|
|
150
|
+
export const ColorBaseGreen400 = `hsl(${HuesGreenHue}, ${HuesGreenSaturation}, ${HuesGreenLightness})`;
|
|
151
|
+
export const ColorBaseOrange600 = `hsl(${HuesOrangeHue}, ${HuesOrangeSaturation}, ${HuesOrangeLightness})`;
|
|
152
|
+
export const ColorBaseOrange400 = `hsl(${HuesOrangeHue}, ${HuesOrangeSaturation}, 40%)`;
|
|
153
|
+
export const ColorBaseRed600 = `hsl(${HuesRedHue}, ${HuesRedSaturation}, ${HuesRedLightness})`;
|
|
154
|
+
export const ColorBaseBlue600 = `hsl(${HuesBlueHue}, ${HuesBlueSaturation}, 60%)`;
|
|
155
|
+
export const ColorBaseBlue500 = `hsl(${HuesBlueHue}, ${HuesBlueSaturation}, ${HuesBlueLightness})`;
|
|
156
|
+
export const AliasColorInfo = ColorBaseBlue600;
|
|
157
|
+
export const AliasColorCautionDark = `${ColorBaseOrange400}`;
|
|
158
|
+
export const SpacingInputPaddingInlineStart = SpacingBaseMd;
|
|
159
|
+
export const SpacingButtonIconMarginInlineEnd = SpacingBaseMd;
|
|
160
|
+
export const SpacingButtonPaddingY = SpacingBaseSm;
|
|
161
|
+
export const SpacingButtonPaddingX = SpacingBaseLg;
|
|
162
|
+
export const SpacingButtonBarPaddingBlock = SpacingBaseLg;
|
|
163
|
+
export const SpacingButtonBarPaddingInlineLarge = SpacingBaseXl;
|
|
164
|
+
export const SpacingButtonBarPaddingInline = SpacingBaseLg;
|
|
165
|
+
export const ColorFontInputFocus = AliasColorTextAccent;
|
|
166
|
+
export const ColorBackgroundSwitchHighlight = AliasColorBackgroundHighlight25;
|
|
167
|
+
export const ColorBaseBrightGreenDefault = ColorBaseBrightGreen600;
|
|
168
|
+
export const ColorBaseGreenDefault = ColorBaseGreen400;
|
|
169
|
+
export const ColorBaseOrangeDefault = ColorBaseOrange600;
|
|
170
|
+
export const ColorBaseRedDefault = ColorBaseRed600;
|
|
171
|
+
export const ColorBaseBlueGray980 = `hsl(${HuesBlueGrayHue}, 15%, 98%)`;
|
|
172
|
+
export const ColorBaseBlueGray900 = `hsl(${HuesBlueGrayHue}, 15%, 90%)`;
|
|
173
|
+
export const ColorBaseBlueGray850 = `hsl(${HuesBlueGrayHue}, 15%, 85%)`;
|
|
174
|
+
export const ColorBaseBlueGray800 = `hsl(${HuesBlueGrayHue}, 10%, 80%)`;
|
|
175
|
+
export const ColorBaseBlueGray750 = `hsl(${HuesBlueGrayHue}, 5%, 75%)`;
|
|
176
|
+
export const ColorBaseBlueGray650 = `hsl(${HuesBlueGrayHue}, 5%, 65%)`;
|
|
177
|
+
export const ColorBaseBlueGray550 = `hsl(${HuesBlueGrayHue}, 6%, 55%)`;
|
|
178
|
+
export const ColorBaseBlueGray450 = `hsl(${HuesBlueGrayHue}, 6%, 45%)`;
|
|
179
|
+
export const ColorBaseBlueGray350 = `hsl(${HuesBlueGrayHue}, 6%, 35%)`;
|
|
180
|
+
export const ColorBaseBlueGray230 = `hsl(${HuesBlueGrayHue}, 8%, 23%)`;
|
|
181
|
+
export const ColorBaseBlueGray200 = `hsl(${HuesBlueGrayHue}, 9%, 20%)`;
|
|
182
|
+
export const ColorBaseBlueGray160 = `hsl(${HuesBlueGrayHue}, 10%, 16%)`;
|
|
183
|
+
export const ColorBaseBlueGray130 = `hsl(${HuesBlueGrayHue}, 7%, 13%)`;
|
|
184
|
+
export const ColorBaseBlueDefault = ColorBaseBlue500; // Brand primary color
|
|
185
|
+
export const AliasColorBackgroundQuinary = ColorBaseBlueGray350;
|
|
186
|
+
export const AliasColorBackgroundQuarternary = ColorBaseBlueGray230;
|
|
187
|
+
export const AliasColorBackgroundTertiary = ColorBaseBlueGray200;
|
|
188
|
+
export const AliasColorBackgroundSecondary = ColorBaseBlueGray160;
|
|
189
|
+
export const AliasColorBackgroundBase = ColorBaseBlueGray130;
|
|
190
|
+
export const AliasColorOk = `${ColorBaseGreenDefault}`;
|
|
191
|
+
export const AliasColorCaution = `${ColorBaseOrangeDefault}`;
|
|
192
|
+
export const AliasColorDanger = `${ColorBaseRedDefault}`;
|
|
193
|
+
export const AliasColorBorderFocus = `${ColorBaseBlueDefault}`;
|
|
194
|
+
export const AliasColorBorderStrong = ColorBaseBlueGray550;
|
|
195
|
+
export const AliasColorBorderDefault = ColorBaseBlueGray350;
|
|
196
|
+
export const AliasColorBorderWeak = ColorBaseBlueGray230;
|
|
197
|
+
export const AliasColorTextQuarternary = ColorBaseBlueGray850;
|
|
198
|
+
export const AliasColorTextTertiary = ColorBaseBlueGray650;
|
|
199
|
+
export const AliasColorTextSecondary = ColorBaseBlueGray350;
|
|
200
|
+
export const AliasColorTextPrimary = ColorBaseBlueGray550;
|
|
201
|
+
export const AliasColorBrandPrimary = `${ColorBaseBlueDefault}`;
|
|
202
|
+
export const SpacingButtonBarGap = SpacingButtonBarPaddingBlock;
|
|
203
|
+
export const ColorBackgroundSwitchTrackActive = `${ColorBaseBrightGreenDefault}`;
|
|
204
|
+
export const ColorBackgroundButtonCautionBase = AliasColorCautionDark;
|
|
205
|
+
export const ColorBaseBlueGrayDefault = ColorBaseBlueGray450; // Background, text, borders, etc.
|
|
206
|
+
export const ColorFontInputPlaceholder = AliasColorTextSecondary;
|
|
207
|
+
export const ColorFontInputDefault = AliasColorTextTertiary;
|
|
208
|
+
export const ColorFontButtonDangerDiscreet = AliasColorDanger;
|
|
209
|
+
export const ColorFontButtonCautionDiscreet = AliasColorCaution;
|
|
210
|
+
export const ColorFontButtonOkDiscreet = AliasColorOk;
|
|
211
|
+
export const ColorFontButtonSecondaryDiscreet = AliasColorTextTertiary;
|
|
212
|
+
export const ColorFontButtonSecondaryBase = AliasColorTextQuarternary;
|
|
213
|
+
export const ColorFontButtonPrimaryDiscreet = AliasColorBrandPrimary;
|
|
214
|
+
export const ColorFontButtonPrimaryBase = AliasColorTextQuarternary;
|
|
215
|
+
export const ColorFontLink = AliasColorBrandPrimary;
|
|
216
|
+
export const ColorBorderInputInvalid = AliasColorDanger;
|
|
217
|
+
export const ColorBorderInputFocus = AliasColorBorderFocus;
|
|
218
|
+
export const ColorBorderInputDefault = AliasColorBorderWeak;
|
|
219
|
+
export const ColorBorderButtonDangerDiscreet = AliasColorDanger;
|
|
220
|
+
export const ColorBorderButtonCautionDiscreet = AliasColorCaution;
|
|
221
|
+
export const ColorBorderButtonOkDiscreet = AliasColorOk;
|
|
222
|
+
export const ColorBorderButtonSecondaryDiscreet = AliasColorBorderStrong;
|
|
223
|
+
export const ColorBorderButtonPrimaryDiscreet = AliasColorBrandPrimary;
|
|
224
|
+
export const ColorBackgroundSwitchTrackInactive = AliasColorBackgroundQuinary;
|
|
225
|
+
export const ColorBackgroundInputFocus = AliasColorBackgroundQuarternary;
|
|
226
|
+
export const ColorBackgroundInputDefault = AliasColorBackgroundBase;
|
|
227
|
+
export const ColorBackgroundButtonDangerBase = AliasColorDanger;
|
|
228
|
+
export const ColorBackgroundButtonOkBase = AliasColorOk;
|
|
229
|
+
export const ColorBackgroundButtonSecondaryBase = AliasColorBackgroundQuarternary;
|
|
230
|
+
export const ColorBackgroundButtonPrimaryBase = AliasColorBrandPrimary;
|
|
231
|
+
export const ColorBackgroundBlockFooter = AliasColorBackgroundSecondary;
|
|
232
|
+
export const ColorBackgroundBlockContent = AliasColorBackgroundTertiary;
|
|
233
|
+
export const ColorBackgroundBlockHeader = AliasColorBackgroundQuarternary;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root {
|
|
@@ -197,12 +197,12 @@
|
|
|
197
197
|
--alias-color-text-quarternary: var(--color-base-blue-gray-980);
|
|
198
198
|
--alias-color-text-tertiary: var(--color-base-blue-gray-230);
|
|
199
199
|
--alias-color-text-secondary: var(--color-base-blue-gray-750);
|
|
200
|
+
--alias-color-text-primary: var(--color-base-blue-gray-350);
|
|
200
201
|
--alias-color-brand-primary: var(--color-base-blue-default);
|
|
201
202
|
--spacing-button-bar-gap: var(--spacing-button-bar-padding-block);
|
|
202
203
|
--color-background-switch-track-active: var(--color-base-bright-green-default);
|
|
203
204
|
--color-background-button-caution-base: var(--alias-color-caution-dark);
|
|
204
205
|
--color-base-blue-gray-default: var(--color-base-blue-gray-450); /* Background, text, borders, etc. */
|
|
205
|
-
--alias-color-text-primary: var(--color-base-blue-gray-default);
|
|
206
206
|
--color-font-input-placeholder: var(--alias-color-text-secondary);
|
|
207
207
|
--color-font-input-default: var(--alias-color-text-tertiary);
|
|
208
208
|
--color-font-button-danger-discreet: var(--alias-color-danger);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
|
|
@@ -197,12 +197,12 @@ export const AliasColorBorderWeak = ColorBaseBlueGray850;
|
|
|
197
197
|
export const AliasColorTextQuarternary = ColorBaseBlueGray980;
|
|
198
198
|
export const AliasColorTextTertiary = ColorBaseBlueGray230;
|
|
199
199
|
export const AliasColorTextSecondary = ColorBaseBlueGray750;
|
|
200
|
+
export const AliasColorTextPrimary = ColorBaseBlueGray350;
|
|
200
201
|
export const AliasColorBrandPrimary = `${ColorBaseBlueDefault}`;
|
|
201
202
|
export const SpacingButtonBarGap = SpacingButtonBarPaddingBlock;
|
|
202
203
|
export const ColorBackgroundSwitchTrackActive = `${ColorBaseBrightGreenDefault}`;
|
|
203
204
|
export const ColorBackgroundButtonCautionBase = AliasColorCautionDark;
|
|
204
205
|
export const ColorBaseBlueGrayDefault = ColorBaseBlueGray450; // Background, text, borders, etc.
|
|
205
|
-
export const AliasColorTextPrimary = ColorBaseBlueGrayDefault;
|
|
206
206
|
export const ColorFontInputPlaceholder = AliasColorTextSecondary;
|
|
207
207
|
export const ColorFontInputDefault = AliasColorTextTertiary;
|
|
208
208
|
export const ColorFontButtonDangerDiscreet = AliasColorDanger;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on
|
|
3
|
+
* Generated on Fri, 18 Nov 2022 10:01:39 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
html.light {
|
|
7
7
|
--alias-color-brand-primary: hsl(206deg, 60%, 52%);
|
|
8
|
-
--alias-color-text-primary: hsl(206deg, 6%,
|
|
8
|
+
--alias-color-text-primary: hsl(206deg, 6%, 35%);
|
|
9
9
|
--alias-color-text-secondary: hsl(206deg, 5%, 75%);
|
|
10
10
|
--alias-color-text-tertiary: hsl(206deg, 8%, 23%);
|
|
11
11
|
--alias-color-text-quarternary: hsl(206deg, 15%, 98%);
|