nve-designsystem 3.2.0 → 3.5.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.
- package/css/nve.css +795 -346
- package/css/nve_dark.css +351 -273
- package/css/rme.css +800 -351
- package/css/rme_dark.css +356 -278
- package/css/varsom.css +793 -344
- package/css/varsom_dark.css +349 -271
- package/custom-elements.json +1 -1
- package/package.json +5 -1
package/css/nve.css
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
--color-shades-brand-150: #ff525d;
|
|
9
9
|
--color-shades-brand-200: #f8253a;
|
|
10
10
|
--color-shades-brand-250: #f3203c;
|
|
11
|
-
--color-shades-brand-300: #
|
|
11
|
+
--color-shades-brand-300: #e71336;
|
|
12
12
|
--color-shades-brand-400: #d91232;
|
|
13
13
|
--color-shades-brand-500: #c8102e;
|
|
14
14
|
--color-shades-brand-600: #a40d26;
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
--color-shades-brand-900: #5e0816;
|
|
19
19
|
--color-shades-brand-950: #500713;
|
|
20
20
|
--color-shades-brand-999: #2b030a;
|
|
21
|
-
--color-shades-brand-000: #
|
|
21
|
+
--color-shades-brand-000: #ffffff; /** This token has a dark color on Varsom */
|
|
22
22
|
--color-shades-brand-050: #ff8083;
|
|
23
23
|
--color-shades-grey-100: #efeff1;
|
|
24
24
|
--color-shades-grey-150: #e4e5e7;
|
|
@@ -35,171 +35,191 @@
|
|
|
35
35
|
--color-shades-grey-999: #050505;
|
|
36
36
|
--color-shades-grey-000: #ffffff;
|
|
37
37
|
--color-shades-grey-050: #f7f7f8;
|
|
38
|
-
--color-shades-
|
|
39
|
-
--color-shades-
|
|
40
|
-
--color-shades-
|
|
41
|
-
--color-shades-
|
|
42
|
-
--color-shades-
|
|
43
|
-
--color-shades-
|
|
44
|
-
--color-shades-
|
|
45
|
-
--color-shades-
|
|
46
|
-
--color-shades-
|
|
47
|
-
--color-shades-
|
|
48
|
-
--color-shades-
|
|
49
|
-
--color-shades-
|
|
50
|
-
--color-shades-
|
|
51
|
-
--color-shades-
|
|
52
|
-
--color-shades-
|
|
53
|
-
--color-shades-
|
|
54
|
-
--color-shades-
|
|
55
|
-
--color-shades-
|
|
56
|
-
--color-shades-
|
|
57
|
-
--color-shades-
|
|
58
|
-
--color-shades-
|
|
59
|
-
--color-shades-
|
|
60
|
-
--color-shades-
|
|
61
|
-
--color-shades-
|
|
62
|
-
--color-shades-
|
|
63
|
-
--color-shades-
|
|
64
|
-
--color-shades-
|
|
65
|
-
--color-shades-
|
|
66
|
-
--color-shades-
|
|
67
|
-
--color-shades-
|
|
68
|
-
--color-shades-
|
|
69
|
-
--color-shades-
|
|
70
|
-
--color-shades-
|
|
71
|
-
--color-shades-
|
|
72
|
-
--color-shades-
|
|
73
|
-
--color-shades-blue-
|
|
74
|
-
--color-shades-blue-
|
|
75
|
-
--color-shades-blue-
|
|
76
|
-
--color-shades-blue-
|
|
77
|
-
--color-shades-blue-
|
|
78
|
-
--color-shades-blue-
|
|
79
|
-
--color-shades-blue-
|
|
80
|
-
--color-shades-blue-
|
|
81
|
-
--color-shades-blue-
|
|
82
|
-
--color-shades-blue-
|
|
83
|
-
--color-shades-
|
|
84
|
-
--color-shades-
|
|
85
|
-
--color-shades-
|
|
86
|
-
--color-shades-
|
|
87
|
-
--color-shades-
|
|
88
|
-
--color-shades-
|
|
89
|
-
--color-shades-
|
|
90
|
-
--color-shades-
|
|
91
|
-
--color-shades-
|
|
92
|
-
--color-shades-
|
|
93
|
-
--color-shades-
|
|
94
|
-
--color-shades-
|
|
95
|
-
--color-shades-
|
|
96
|
-
--color-shades-
|
|
97
|
-
--color-shades-
|
|
98
|
-
--color-shades-
|
|
99
|
-
--color-shades-
|
|
100
|
-
--color-shades-
|
|
101
|
-
--color-shades-
|
|
102
|
-
--color-shades-
|
|
103
|
-
--color-shades-orange-
|
|
104
|
-
--color-shades-orange-
|
|
105
|
-
--color-shades-orange-
|
|
106
|
-
--color-shades-orange-
|
|
107
|
-
--color-shades-orange-
|
|
108
|
-
--color-shades-orange-
|
|
109
|
-
--color-shades-orange-
|
|
110
|
-
--color-shades-orange-
|
|
111
|
-
--color-shades-orange-
|
|
112
|
-
--color-shades-orange-
|
|
113
|
-
--color-shades-
|
|
114
|
-
--color-shades-
|
|
115
|
-
--color-shades-
|
|
116
|
-
--color-shades-
|
|
117
|
-
--color-shades-
|
|
118
|
-
--color-shades-
|
|
119
|
-
--color-shades-
|
|
120
|
-
--color-shades-
|
|
121
|
-
--color-shades-
|
|
122
|
-
--color-shades-
|
|
123
|
-
--color-shades-
|
|
124
|
-
--color-shades-
|
|
125
|
-
--color-shades-
|
|
126
|
-
--color-shades-
|
|
127
|
-
--color-shades-
|
|
128
|
-
--color-shades-
|
|
129
|
-
--color-shades-
|
|
130
|
-
--color-shades-
|
|
131
|
-
--color-shades-
|
|
132
|
-
--color-shades-
|
|
133
|
-
--color-shades-
|
|
134
|
-
--color-shades-
|
|
135
|
-
--color-shades-
|
|
136
|
-
--color-shades-
|
|
137
|
-
--color-shades-
|
|
138
|
-
--color-shades-
|
|
139
|
-
--color-shades-
|
|
140
|
-
--color-shades-
|
|
141
|
-
--color-shades-
|
|
142
|
-
--color-shades-
|
|
143
|
-
--color-shades-
|
|
144
|
-
--color-shades-
|
|
145
|
-
--color-shades-
|
|
146
|
-
--color-shades-
|
|
147
|
-
--color-shades-
|
|
148
|
-
--color-shades-
|
|
149
|
-
--color-shades-
|
|
150
|
-
--color-shades-
|
|
151
|
-
--color-shades-
|
|
152
|
-
--color-shades-
|
|
153
|
-
--color-shades-
|
|
154
|
-
--color-shades-
|
|
155
|
-
--color-shades-
|
|
156
|
-
--color-shades-
|
|
157
|
-
--color-shades-
|
|
158
|
-
--color-shades-
|
|
159
|
-
--color-shades-
|
|
160
|
-
--color-shades-
|
|
161
|
-
--color-shades-
|
|
162
|
-
--color-shades-
|
|
163
|
-
--color-shades-lime-
|
|
164
|
-
--color-shades-lime-
|
|
165
|
-
--color-shades-lime-
|
|
166
|
-
--color-shades-lime-
|
|
167
|
-
--color-shades-lime-
|
|
168
|
-
--color-shades-lime-
|
|
169
|
-
--color-shades-lime-
|
|
170
|
-
--color-shades-lime-
|
|
171
|
-
--color-shades-lime-
|
|
172
|
-
--color-shades-lime-
|
|
173
|
-
--color-shades-
|
|
174
|
-
--color-shades-
|
|
175
|
-
--color-shades-
|
|
176
|
-
--color-shades-
|
|
177
|
-
--color-shades-
|
|
178
|
-
--color-shades-
|
|
179
|
-
--color-shades-
|
|
180
|
-
--color-shades-
|
|
181
|
-
--color-shades-
|
|
182
|
-
--color-shades-
|
|
183
|
-
--color-shades-
|
|
184
|
-
--color-shades-
|
|
185
|
-
--color-shades-
|
|
186
|
-
--color-shades-
|
|
187
|
-
--color-shades-
|
|
188
|
-
--color-shades-
|
|
189
|
-
--color-shades-
|
|
190
|
-
--color-shades-
|
|
191
|
-
--color-shades-
|
|
192
|
-
--color-shades-
|
|
193
|
-
--color-shades-
|
|
194
|
-
--color-shades-
|
|
195
|
-
--color-shades-
|
|
196
|
-
--color-shades-
|
|
197
|
-
--color-shades-
|
|
198
|
-
--color-shades-
|
|
199
|
-
--color-shades-
|
|
200
|
-
--color-shades-
|
|
201
|
-
--color-shades-
|
|
202
|
-
--color-shades-
|
|
38
|
+
--color-shades-data-color-a-100: #ff858d;
|
|
39
|
+
--color-shades-data-color-a-150: #ff5762;
|
|
40
|
+
--color-shades-data-color-a-250: #f42a45;
|
|
41
|
+
--color-shades-data-color-a-300: #ed1d3f;
|
|
42
|
+
--color-shades-data-color-a-600: #a40d26;
|
|
43
|
+
--color-shades-data-color-a-800: #760a1c;
|
|
44
|
+
--color-shades-data-color-a-950: #500713;
|
|
45
|
+
--color-shades-data-color-a-000: #ffadb3;
|
|
46
|
+
--color-shades-data-color-a-300-005: rgba(231, 19, 54, 0.02);
|
|
47
|
+
--color-shades-data-color-a-300-015: rgba(231, 19, 54, 0.15);
|
|
48
|
+
--color-shades-data-color-b-200: #ffb657;
|
|
49
|
+
--color-shades-data-color-b-400: #ff9914;
|
|
50
|
+
--color-shades-data-color-b-500: #d67900;
|
|
51
|
+
--color-shades-data-color-b-600: #bc6c2f;
|
|
52
|
+
--color-shades-data-color-b-800: #905527;
|
|
53
|
+
--color-shades-data-color-b-900: #683e1c;
|
|
54
|
+
--color-shades-data-color-c-400: #b4c87e;
|
|
55
|
+
--color-shades-data-color-c-500: #97b34d;
|
|
56
|
+
--color-shades-data-color-c-600: #7f9640;
|
|
57
|
+
--color-shades-data-color-c-800: #647632;
|
|
58
|
+
--color-shades-data-color-c-900: #526029;
|
|
59
|
+
--color-shades-data-color-d-400: #57c7b4;
|
|
60
|
+
--color-shades-data-color-d-500: #3db8a3;
|
|
61
|
+
--color-shades-data-color-d-600: #349d8b;
|
|
62
|
+
--color-shades-data-color-d-800: #2b8274;
|
|
63
|
+
--color-shades-data-color-d-900: #246b5f;
|
|
64
|
+
--color-shades-data-color-e-100: #a0ace4;
|
|
65
|
+
--color-shades-data-color-e-200: #8092db;
|
|
66
|
+
--color-shades-data-color-e-300: #687ed4;
|
|
67
|
+
--color-shades-data-color-e-400: #2e47a3;
|
|
68
|
+
--color-shades-data-color-e-500: #223477;
|
|
69
|
+
--color-shades-data-color-f-600: #9f65b8;
|
|
70
|
+
--color-shades-data-color-f-800: #874aa1;
|
|
71
|
+
--color-shades-data-color-g-600: #d289b6;
|
|
72
|
+
--color-shades-data-color-g-800: #c76ba3;
|
|
73
|
+
--color-shades-functional-blue-100: #ceeaff;
|
|
74
|
+
--color-shades-functional-blue-150: #a8daff;
|
|
75
|
+
--color-shades-functional-blue-200: #91d0ff;
|
|
76
|
+
--color-shades-functional-blue-300: #65bdff;
|
|
77
|
+
--color-shades-functional-blue-400: #38a9ff;
|
|
78
|
+
--color-shades-functional-blue-500: #008ffb;
|
|
79
|
+
--color-shades-functional-blue-600: #0f81fa;
|
|
80
|
+
--color-shades-functional-blue-700: #1e6fdc;
|
|
81
|
+
--color-shades-functional-blue-800: #0668b1;
|
|
82
|
+
--color-shades-functional-blue-850: #044b81;
|
|
83
|
+
--color-shades-functional-blue-900: #034272;
|
|
84
|
+
--color-shades-functional-blue-950: #0f3970;
|
|
85
|
+
--color-shades-functional-blue-999: #0b2951;
|
|
86
|
+
--color-shades-functional-blue-000: #e5f4ff;
|
|
87
|
+
--color-shades-functional-blue-050: #d5edff;
|
|
88
|
+
--color-shades-functional-red-100: #ffc2c2;
|
|
89
|
+
--color-shades-functional-red-150: #ffa8a8;
|
|
90
|
+
--color-shades-functional-red-200: #ff9494;
|
|
91
|
+
--color-shades-functional-red-300: #ff7575;
|
|
92
|
+
--color-shades-functional-red-400: #ff5757;
|
|
93
|
+
--color-shades-functional-red-500: #ff3131;
|
|
94
|
+
--color-shades-functional-red-600: #ea2020;
|
|
95
|
+
--color-shades-functional-red-700: #cc0000;
|
|
96
|
+
--color-shades-functional-red-800: #bc0303;
|
|
97
|
+
--color-shades-functional-red-850: #a80303;
|
|
98
|
+
--color-shades-functional-red-900: #8f0a0a;
|
|
99
|
+
--color-shades-functional-red-950: #6b0000;
|
|
100
|
+
--color-shades-functional-red-999: #540000;
|
|
101
|
+
--color-shades-functional-red-000: #ffebee;
|
|
102
|
+
--color-shades-functional-red-050: #ffd8de;
|
|
103
|
+
--color-shades-functional-orange-100: #ffe3c2;
|
|
104
|
+
--color-shades-functional-orange-150: #ffd9ad;
|
|
105
|
+
--color-shades-functional-orange-200: #ffc98a;
|
|
106
|
+
--color-shades-functional-orange-300: #ffb35c;
|
|
107
|
+
--color-shades-functional-orange-400: #ff9a24;
|
|
108
|
+
--color-shades-functional-orange-500: #ff8d0a;
|
|
109
|
+
--color-shades-functional-orange-600: #f57a00;
|
|
110
|
+
--color-shades-functional-orange-700: #e06900;
|
|
111
|
+
--color-shades-functional-orange-800: #c25400;
|
|
112
|
+
--color-shades-functional-orange-850: #b34d09;
|
|
113
|
+
--color-shades-functional-orange-900: #a2420c;
|
|
114
|
+
--color-shades-functional-orange-950: #933d0b;
|
|
115
|
+
--color-shades-functional-orange-999: #5f2707;
|
|
116
|
+
--color-shades-functional-orange-000: #fff8f0;
|
|
117
|
+
--color-shades-functional-orange-050: #ffecd6;
|
|
118
|
+
--color-shades-functional-yellow-100: #fff4d1;
|
|
119
|
+
--color-shades-functional-yellow-150: #ffedb8;
|
|
120
|
+
--color-shades-functional-yellow-200: #ffe8a5;
|
|
121
|
+
--color-shades-functional-yellow-300: #ffe087;
|
|
122
|
+
--color-shades-functional-yellow-400: #ffd867;
|
|
123
|
+
--color-shades-functional-yellow-500: #ffd046;
|
|
124
|
+
--color-shades-functional-yellow-600: #ecbf38;
|
|
125
|
+
--color-shades-functional-yellow-700: #daad2a;
|
|
126
|
+
--color-shades-functional-yellow-800: #c79c1c;
|
|
127
|
+
--color-shades-functional-yellow-850: #be9315;
|
|
128
|
+
--color-shades-functional-yellow-900: #b58a0e;
|
|
129
|
+
--color-shades-functional-yellow-950: #ab8207;
|
|
130
|
+
--color-shades-functional-yellow-999: #856300;
|
|
131
|
+
--color-shades-functional-yellow-000: #fff9e9;
|
|
132
|
+
--color-shades-functional-yellow-050: #fff5d9;
|
|
133
|
+
--color-shades-functional-green-100: #e8fce8;
|
|
134
|
+
--color-shades-functional-green-150: #cbf9cb;
|
|
135
|
+
--color-shades-functional-green-200: #8af0a1;
|
|
136
|
+
--color-shades-functional-green-300: #97f2a8;
|
|
137
|
+
--color-shades-functional-green-400: #8af0a1;
|
|
138
|
+
--color-shades-functional-green-500: #6bf198;
|
|
139
|
+
--color-shades-functional-green-600: #57ce7f;
|
|
140
|
+
--color-shades-functional-green-700: #43ab66;
|
|
141
|
+
--color-shades-functional-green-800: #00814b;
|
|
142
|
+
--color-shades-functional-green-850: #247740;
|
|
143
|
+
--color-shades-functional-green-900: #1a6533;
|
|
144
|
+
--color-shades-functional-green-950: #004126;
|
|
145
|
+
--color-shades-functional-green-999: #00301c;
|
|
146
|
+
--color-shades-functional-green-000: #f6fff9;
|
|
147
|
+
--color-shades-functional-green-050: #f0fef5;
|
|
148
|
+
--color-shades-functional-neutralgrey-100: #edeef0;
|
|
149
|
+
--color-shades-functional-neutralgrey-150: #e4e5e7;
|
|
150
|
+
--color-shades-functional-neutralgrey-200: #c9cbcf;
|
|
151
|
+
--color-shades-functional-neutralgrey-300: #b7babf;
|
|
152
|
+
--color-shades-functional-neutralgrey-400: #9fa3a9;
|
|
153
|
+
--color-shades-functional-neutralgrey-500: #878c94;
|
|
154
|
+
--color-shades-functional-neutralgrey-600: #60656c;
|
|
155
|
+
--color-shades-functional-neutralgrey-700: #515459;
|
|
156
|
+
--color-shades-functional-neutralgrey-800: #3c3f44;
|
|
157
|
+
--color-shades-functional-neutralgrey-850: #292a2c;
|
|
158
|
+
--color-shades-functional-neutralgrey-900: #1b1c1e;
|
|
159
|
+
--color-shades-functional-neutralgrey-950: #0d0d0e;
|
|
160
|
+
--color-shades-functional-neutralgrey-999: #0d0d0e;
|
|
161
|
+
--color-shades-functional-neutralgrey-000: #ffffff;
|
|
162
|
+
--color-shades-functional-neutralgrey-050: #f7f7f8;
|
|
163
|
+
--color-shades-additional-lime-100: #eaf4da;
|
|
164
|
+
--color-shades-additional-lime-150: #dfeec8;
|
|
165
|
+
--color-shades-additional-lime-200: #d4e9b6;
|
|
166
|
+
--color-shades-additional-lime-300: #bfdd91;
|
|
167
|
+
--color-shades-additional-lime-400: #a9d26d;
|
|
168
|
+
--color-shades-additional-lime-500: #87bb3a;
|
|
169
|
+
--color-shades-additional-lime-600: #709636;
|
|
170
|
+
--color-shades-additional-lime-700: #59772b;
|
|
171
|
+
--color-shades-additional-lime-800: #3b501d;
|
|
172
|
+
--color-shades-additional-lime-850: #2c3c16;
|
|
173
|
+
--color-shades-additional-lime-900: #1e280e;
|
|
174
|
+
--color-shades-additional-lime-950: #0f1407;
|
|
175
|
+
--color-shades-additional-lime-999: #000000;
|
|
176
|
+
--color-shades-additional-lime-000: #ffffff;
|
|
177
|
+
--color-shades-additional-lime-050: #f4f9ed;
|
|
178
|
+
--color-shades-additional-purple-100: #ece9fc;
|
|
179
|
+
--color-shades-additional-purple-150: #e2ddfa;
|
|
180
|
+
--color-shades-additional-purple-200: #d9d2f9;
|
|
181
|
+
--color-shades-additional-purple-300: #c5bcf5;
|
|
182
|
+
--color-shades-additional-purple-400: #b2a5f2;
|
|
183
|
+
--color-shades-additional-purple-500: #9f8fef;
|
|
184
|
+
--color-shades-additional-purple-600: #8475ce;
|
|
185
|
+
--color-shades-additional-purple-700: #685aad;
|
|
186
|
+
--color-shades-additional-purple-800: #4d408d;
|
|
187
|
+
--color-shades-additional-purple-850: #3f337c;
|
|
188
|
+
--color-shades-additional-purple-900: #31256c;
|
|
189
|
+
--color-shades-additional-purple-950: #24185b;
|
|
190
|
+
--color-shades-additional-purple-999: #160b4b;
|
|
191
|
+
--color-shades-additional-purple-000: #ffffff;
|
|
192
|
+
--color-shades-additional-purple-050: #f5f4fd;
|
|
193
|
+
--color-shades-additional-magenta-100: #fae3f1;
|
|
194
|
+
--color-shades-additional-magenta-150: #f8d5eb;
|
|
195
|
+
--color-shades-additional-magenta-200: #f5c7e4;
|
|
196
|
+
--color-shades-additional-magenta-300: #f1acd6;
|
|
197
|
+
--color-shades-additional-magenta-400: #ec90c9;
|
|
198
|
+
--color-shades-additional-magenta-500: #e774bb;
|
|
199
|
+
--color-shades-additional-magenta-600: #c76ba4;
|
|
200
|
+
--color-shades-additional-magenta-700: #9c497c;
|
|
201
|
+
--color-shades-additional-magenta-800: #77335d;
|
|
202
|
+
--color-shades-additional-magenta-850: #64284d;
|
|
203
|
+
--color-shades-additional-magenta-900: #511e3d;
|
|
204
|
+
--color-shades-additional-magenta-950: #3f132e;
|
|
205
|
+
--color-shades-additional-magenta-999: #2c081e;
|
|
206
|
+
--color-shades-additional-magenta-000: #ffffff;
|
|
207
|
+
--color-shades-additional-magenta-050: #fdf1f8;
|
|
208
|
+
--color-shades-additional-teal-100: #e2f3f9;
|
|
209
|
+
--color-shades-additional-teal-150: #d3edf6;
|
|
210
|
+
--color-shades-additional-teal-200: #c4e7f3;
|
|
211
|
+
--color-shades-additional-teal-300: #a7dbec;
|
|
212
|
+
--color-shades-additional-teal-400: #89cfe6;
|
|
213
|
+
--color-shades-additional-teal-500: #6cc3e0;
|
|
214
|
+
--color-shades-additional-teal-600: #4893ad;
|
|
215
|
+
--color-shades-additional-teal-700: #407a8c;
|
|
216
|
+
--color-shades-additional-teal-800: #2f5c6c;
|
|
217
|
+
--color-shades-additional-teal-850: #254b58;
|
|
218
|
+
--color-shades-additional-teal-900: #1a3a45;
|
|
219
|
+
--color-shades-additional-teal-950: #102931;
|
|
220
|
+
--color-shades-additional-teal-999: #06181e;
|
|
221
|
+
--color-shades-additional-teal-000: #ffffff;
|
|
222
|
+
--color-shades-additional-teal-050: #f0f9fc;
|
|
203
223
|
--opacity-disabled: 0.38;
|
|
204
224
|
--font-family-source-sans-pro: 'Source Sans Pro';
|
|
205
225
|
--line-height-0: 1.15;
|
|
@@ -221,18 +241,32 @@
|
|
|
221
241
|
--box-shadow-hard: -45px 80px 26px 0 rgba(0,0,0,0.00), -29px 51px 23px 0 rgba(0,0,0,0.01), -16px 29px 20px 0 rgba(0,0,0,0.02), -7px 13px 15px 0 rgba(0,0,0,0.03), -2px 3px 8px 0 rgba(0,0,0,0.04);
|
|
222
242
|
--box-shadow-header: 0 4px 032px 0 rgba(0,0,0,0.02);
|
|
223
243
|
--box-shadow-dropdown: 0 54px 15px 0 rgba(0,0,0,0.00), 0 35px 14px 0 rgba(0,0,0,0.00), 0 19px 12px 0 rgba(0,0,0,0.02), 0 9px 9px 0 rgba(0,0,0,0.03), 0 2px 5px 0 rgba(0,0,0,0.03);
|
|
244
|
+
--boolean-brand-nve: true;
|
|
245
|
+
--boolean-brand-varsom: false;
|
|
246
|
+
--boolean-brand-rme: false;
|
|
247
|
+
--boolean-brand-nve-rme: true;
|
|
224
248
|
--color-brand-background-primary: var(--color-shades-brand-500);
|
|
225
|
-
--color-brand-background-secondary: var(--color-shades-brand-
|
|
249
|
+
--color-brand-background-secondary: var(--color-shades-brand-400);
|
|
226
250
|
--color-brand-background-tertiary: var(--color-shades-brand-150);
|
|
227
|
-
--color-brand-
|
|
228
|
-
--color-brand-foreground-
|
|
229
|
-
--color-brand-foreground-
|
|
251
|
+
--color-brand-background-quaternary: var(--color-shades-brand-700);
|
|
252
|
+
--color-brand-foreground-primary: var(--color-shades-brand-500);
|
|
253
|
+
--color-brand-foreground-primary-on-bg: var(--color-shades-brand-000);
|
|
254
|
+
--color-brand-foreground-secondary: var(--color-shades-brand-700); /** was 500 */
|
|
255
|
+
--color-brand-foreground-secondary-on-bg: var(--color-shades-brand-999);
|
|
256
|
+
--color-brand-foreground-tertiary-on-bg: var(--color-shades-brand-200);
|
|
257
|
+
--color-brand-border-primary: var(--color-shades-brand-500);
|
|
258
|
+
--color-brand-border-secondary: var(--color-shades-brand-600);
|
|
259
|
+
--color-brand-border-tertiary: var(--color-shades-brand-700);
|
|
230
260
|
--color-neutrals-background-canvas: var(--color-shades-grey-050);
|
|
231
261
|
--color-neutrals-background-primary: var(--color-shades-grey-000);
|
|
232
262
|
--color-neutrals-background-primary-contrast: var(--color-shades-grey-100);
|
|
233
263
|
--color-neutrals-background-secondary: var(--color-shades-grey-150);
|
|
264
|
+
--color-neutrals-background-secondary-dim: var(--color-shades-grey-850);
|
|
265
|
+
--color-neutrals-background-tertiary-dim: var(--color-shades-grey-700);
|
|
234
266
|
--color-neutrals-foreground-primary: var(--color-shades-grey-999);
|
|
235
|
-
--color-neutrals-foreground-
|
|
267
|
+
--color-neutrals-foreground-secondary: var(--color-shades-functional-neutralgrey-800);
|
|
268
|
+
--color-neutrals-foreground-subtle: var(--color-shades-functional-neutralgrey-600);
|
|
269
|
+
--color-neutrals-foreground-inverted: var(--color-shades-functional-neutralgrey-000);
|
|
236
270
|
--color-neutrals-border-default: var(--color-shades-grey-500);
|
|
237
271
|
--color-neutrals-border-mute: var(--color-shades-grey-300);
|
|
238
272
|
--color-neutrals-border-subtle: var(--color-shades-grey-150);
|
|
@@ -243,144 +277,232 @@
|
|
|
243
277
|
--color-interactive-primary-foreground-default: var(--color-shades-grey-000);
|
|
244
278
|
--color-interactive-primary-foreground-hover: var(--color-shades-grey-000);
|
|
245
279
|
--color-interactive-primary-foreground-disabled: var(--color-shades-grey-000);
|
|
246
|
-
--color-interactive-primary-border-focus: var(--color-shades-blue-500);
|
|
280
|
+
--color-interactive-primary-border-focus: var(--color-shades-functional-blue-500);
|
|
247
281
|
--color-interactive-secondary-background-default: var(--color-shades-grey-150);
|
|
248
282
|
--color-interactive-secondary-background-hover: var(--color-shades-grey-200);
|
|
249
283
|
--color-interactive-secondary-background-disabled: var(--color-shades-grey-150);
|
|
250
284
|
--color-interactive-secondary-foreground-default: var(--color-shades-grey-950);
|
|
251
285
|
--color-interactive-secondary-foreground-hover: var(--color-shades-grey-950);
|
|
252
286
|
--color-interactive-secondary-foreground-disabled: var(--color-shades-grey-950);
|
|
253
|
-
--color-interactive-secondary-border-focus: var(--color-shades-blue-500);
|
|
287
|
+
--color-interactive-secondary-border-focus: var(--color-shades-functional-blue-500);
|
|
254
288
|
--color-interactive-outlined-foreground-default: var(--color-shades-grey-950);
|
|
255
289
|
--color-interactive-outlined-foreground-hover: var(--color-shades-grey-950);
|
|
256
290
|
--color-interactive-outlined-foreground-disabled: var(--color-shades-grey-950);
|
|
257
291
|
--color-interactive-outlined-border-default: var(--color-shades-grey-500);
|
|
258
292
|
--color-interactive-outlined-border-hover: var(--color-shades-grey-950);
|
|
259
|
-
--color-interactive-outlined-border-focus: var(--color-shades-blue-500);
|
|
293
|
+
--color-interactive-outlined-border-focus: var(--color-shades-functional-blue-500);
|
|
260
294
|
--color-interactive-outlined-border-disabled: var(--color-shades-grey-500);
|
|
261
295
|
--color-interactive-ghost-background-hover: var(--color-shades-grey-150);
|
|
262
296
|
--color-interactive-ghost-foreground-default: var(--color-shades-grey-950);
|
|
263
297
|
--color-interactive-ghost-foreground-hover: var(--color-shades-grey-950);
|
|
264
298
|
--color-interactive-ghost-foreground-disabled: var(--color-shades-grey-950);
|
|
265
|
-
--color-interactive-ghost-border-focus: var(--color-shades-blue-500);
|
|
266
|
-
--color-interactive-links-default: var(--color-shades-blue-700);
|
|
299
|
+
--color-interactive-ghost-border-focus: var(--color-shades-functional-blue-500);
|
|
300
|
+
--color-interactive-links-default: var(--color-shades-functional-blue-700);
|
|
267
301
|
--color-interactive-links-hover: var(--color-shades-grey-950);
|
|
268
|
-
--color-interactive-links-focus: var(--color-shades-blue-700);
|
|
302
|
+
--color-interactive-links-focus: var(--color-shades-functional-blue-700);
|
|
269
303
|
--color-interactive-links-visited: var(--color-shades-grey-600);
|
|
270
|
-
--color-interactive-danger-background-default: var(--color-shades-red-700);
|
|
271
|
-
--color-interactive-danger-background-hover: var(--color-shades-red-850);
|
|
272
|
-
--color-interactive-danger-background-disabled: var(--color-shades-red-700);
|
|
304
|
+
--color-interactive-danger-background-default: var(--color-shades-functional-red-700);
|
|
305
|
+
--color-interactive-danger-background-hover: var(--color-shades-functional-red-850);
|
|
306
|
+
--color-interactive-danger-background-disabled: var(--color-shades-functional-red-700);
|
|
273
307
|
--color-interactive-danger-foreground-default: var(--color-shades-grey-000);
|
|
274
308
|
--color-interactive-danger-foreground-hover: var(--color-shades-grey-000);
|
|
275
309
|
--color-interactive-danger-foreground-disabled: var(--color-shades-grey-000);
|
|
276
|
-
--color-interactive-danger-border-focus: var(--color-shades-blue-500);
|
|
277
|
-
--color-feedback-background-default-
|
|
278
|
-
--color-feedback-background-default-
|
|
279
|
-
--color-feedback-background-default-
|
|
280
|
-
--color-feedback-background-default-
|
|
281
|
-
--color-feedback-background-default-
|
|
282
|
-
--color-feedback-background-subtle-
|
|
283
|
-
--color-feedback-background-subtle-
|
|
284
|
-
--color-feedback-background-subtle-
|
|
285
|
-
--color-feedback-background-subtle-
|
|
286
|
-
--color-feedback-background-subtle-
|
|
287
|
-
--color-feedback-background-emphasized-
|
|
288
|
-
--color-feedback-background-emphasized-
|
|
289
|
-
--color-feedback-background-emphasized-
|
|
290
|
-
--color-feedback-background-emphasized-
|
|
291
|
-
--color-feedback-background-emphasized-
|
|
292
|
-
--color-feedback-foreground-
|
|
293
|
-
--color-feedback-foreground-
|
|
294
|
-
--color-feedback-foreground-
|
|
295
|
-
--color-feedback-foreground-
|
|
296
|
-
--color-feedback-foreground-
|
|
297
|
-
--color-feedback-foreground-subtle-
|
|
298
|
-
--color-feedback-foreground-subtle-
|
|
299
|
-
--color-feedback-foreground-subtle-
|
|
300
|
-
--color-feedback-foreground-subtle-
|
|
301
|
-
--color-feedback-foreground-subtle-
|
|
310
|
+
--color-interactive-danger-border-focus: var(--color-shades-functional-blue-500);
|
|
311
|
+
--color-feedback-background-default-neutral: var(--color-shades-functional-neutralgrey-150); /** For neutral messages */
|
|
312
|
+
--color-feedback-background-default-info: var(--color-shades-functional-blue-100);
|
|
313
|
+
--color-feedback-background-default-error: var(--color-shades-functional-red-050);
|
|
314
|
+
--color-feedback-background-default-warning: var(--color-shades-functional-yellow-200);
|
|
315
|
+
--color-feedback-background-default-success: var(--color-shades-functional-green-150);
|
|
316
|
+
--color-feedback-background-subtle-neutral: var(--color-shades-functional-neutralgrey-050);
|
|
317
|
+
--color-feedback-background-subtle-info: var(--color-shades-functional-blue-000);
|
|
318
|
+
--color-feedback-background-subtle-error: var(--color-shades-functional-red-000);
|
|
319
|
+
--color-feedback-background-subtle-warning: var(--color-shades-functional-yellow-100);
|
|
320
|
+
--color-feedback-background-subtle-success: var(--color-shades-functional-green-100);
|
|
321
|
+
--color-feedback-background-emphasized-neutral: var(--color-shades-functional-neutralgrey-800);
|
|
322
|
+
--color-feedback-background-emphasized-info: var(--color-shades-functional-blue-700);
|
|
323
|
+
--color-feedback-background-emphasized-error: var(--color-shades-functional-red-700);
|
|
324
|
+
--color-feedback-background-emphasized-warning: var(--color-shades-functional-yellow-500);
|
|
325
|
+
--color-feedback-background-emphasized-success: var(--color-shades-functional-green-800);
|
|
326
|
+
--color-feedback-foreground-neutral: var(--color-shades-functional-neutralgrey-999);
|
|
327
|
+
--color-feedback-foreground-info: var(--color-shades-functional-blue-800);
|
|
328
|
+
--color-feedback-foreground-error: var(--color-shades-functional-red-700);
|
|
329
|
+
--color-feedback-foreground-warning: var(--color-shades-functional-orange-999);
|
|
330
|
+
--color-feedback-foreground-success: var(--color-shades-functional-green-900);
|
|
331
|
+
--color-feedback-foreground-on-bg-subtle-neutral: var(--color-shades-functional-neutralgrey-999);
|
|
332
|
+
--color-feedback-foreground-on-bg-subtle-info: var(--color-shades-functional-blue-999);
|
|
333
|
+
--color-feedback-foreground-on-bg-subtle-error: var(--color-shades-functional-red-950);
|
|
334
|
+
--color-feedback-foreground-on-bg-subtle-warning: var(--color-shades-functional-orange-999);
|
|
335
|
+
--color-feedback-foreground-on-bg-subtle-success: var(--color-shades-functional-green-999);
|
|
336
|
+
--color-feedback-foreground-on-bg-emphasized-neutral: var(--color-shades-functional-neutralgrey-000);
|
|
337
|
+
--color-feedback-foreground-on-bg-emphasized-info: var(--color-shades-functional-neutralgrey-000);
|
|
338
|
+
--color-feedback-foreground-on-bg-emphasized-error: var(--color-shades-functional-neutralgrey-000);
|
|
339
|
+
--color-feedback-foreground-on-bg-emphasized-warning: var(--color-shades-functional-neutralgrey-999);
|
|
340
|
+
--color-feedback-foreground-on-bg-emphasized-success: var(--color-shades-functional-neutralgrey-000);
|
|
341
|
+
--color-feedback-foreground-default-neutral: var(--color-shades-functional-neutralgrey-999);
|
|
342
|
+
--color-feedback-foreground-default-info: var(--color-shades-functional-neutralgrey-999);
|
|
343
|
+
--color-feedback-foreground-default-error: var(--color-shades-functional-neutralgrey-999);
|
|
344
|
+
--color-feedback-foreground-default-warning: var(--color-shades-functional-neutralgrey-999);
|
|
345
|
+
--color-feedback-foreground-default-success: var(--color-shades-functional-neutralgrey-999);
|
|
346
|
+
--color-feedback-foreground-subtle-neutral: var(--color-shades-functional-neutralgrey-999);
|
|
347
|
+
--color-feedback-foreground-subtle-info: var(--color-shades-functional-neutralgrey-999);
|
|
348
|
+
--color-feedback-foreground-subtle-error: var(--color-shades-functional-neutralgrey-999);
|
|
349
|
+
--color-feedback-foreground-subtle-warning: var(--color-shades-functional-neutralgrey-999);
|
|
350
|
+
--color-feedback-foreground-subtle-success: var(--color-shades-functional-neutralgrey-999);
|
|
351
|
+
--color-feedback-foreground-emphasized-neutral: var(--color-shades-grey-000);
|
|
302
352
|
--color-feedback-foreground-emphasized-info: var(--color-shades-grey-000);
|
|
303
353
|
--color-feedback-foreground-emphasized-error: var(--color-shades-grey-000);
|
|
304
|
-
--color-feedback-foreground-emphasized-warning: var(--color-shades-neutralgrey-999);
|
|
354
|
+
--color-feedback-foreground-emphasized-warning: var(--color-shades-functional-neutralgrey-999);
|
|
305
355
|
--color-feedback-foreground-emphasized-success: var(--color-shades-grey-000);
|
|
306
|
-
--color-feedback-
|
|
307
|
-
--color-
|
|
308
|
-
--color-
|
|
309
|
-
--color-
|
|
310
|
-
--color-
|
|
311
|
-
--color-
|
|
312
|
-
--color-
|
|
313
|
-
--color-
|
|
314
|
-
--color-
|
|
315
|
-
--color-
|
|
316
|
-
--color-dangerlevel-background-
|
|
317
|
-
--color-dangerlevel-background-
|
|
318
|
-
--color-dangerlevel-background-
|
|
319
|
-
--color-dangerlevel-background-
|
|
320
|
-
--color-dangerlevel-background-
|
|
321
|
-
--color-dangerlevel-background-
|
|
322
|
-
--color-dangerlevel-
|
|
323
|
-
--color-dangerlevel-
|
|
324
|
-
--color-dangerlevel-
|
|
325
|
-
--color-dangerlevel-
|
|
326
|
-
--color-dangerlevel-
|
|
327
|
-
--color-dangerlevel-
|
|
328
|
-
--color-dangerlevel-
|
|
329
|
-
--color-dangerlevel-
|
|
330
|
-
--color-dangerlevel-
|
|
331
|
-
--color-dangerlevel-foreground-
|
|
332
|
-
--color-dangerlevel-foreground-
|
|
333
|
-
--color-dangerlevel-foreground-
|
|
334
|
-
--color-dangerlevel-foreground-
|
|
335
|
-
--color-dangerlevel-foreground-
|
|
336
|
-
--color-dangerlevel-foreground-
|
|
337
|
-
--color-
|
|
338
|
-
--color-
|
|
339
|
-
--color-
|
|
340
|
-
--color-
|
|
341
|
-
--color-
|
|
342
|
-
--color-
|
|
343
|
-
--color-
|
|
344
|
-
--color-
|
|
345
|
-
--color-
|
|
346
|
-
--color-supplemental-subtle-
|
|
347
|
-
--color-supplemental-subtle-
|
|
348
|
-
--color-supplemental-subtle-
|
|
349
|
-
--color-supplemental-subtle-
|
|
350
|
-
--color-supplemental-subtle-
|
|
351
|
-
--color-supplemental-subtle-
|
|
352
|
-
--color-supplemental-subtle-
|
|
353
|
-
--color-supplemental-
|
|
354
|
-
--color-supplemental-
|
|
355
|
-
--color-supplemental-
|
|
356
|
-
--color-supplemental-
|
|
357
|
-
--color-supplemental-
|
|
358
|
-
--color-supplemental-
|
|
359
|
-
--color-supplemental-
|
|
360
|
-
--color-supplemental-
|
|
361
|
-
--color-supplemental-
|
|
356
|
+
--color-feedback-border-subtle-neutral: var(--color-shades-functional-neutralgrey-200);
|
|
357
|
+
--color-feedback-border-subtle-info: var(--color-shades-functional-blue-200);
|
|
358
|
+
--color-feedback-border-subtle-error: var(--color-shades-functional-red-200);
|
|
359
|
+
--color-feedback-border-subtle-warning: var(--color-shades-functional-yellow-700);
|
|
360
|
+
--color-feedback-border-subtle-success: var(--color-shades-functional-green-600);
|
|
361
|
+
--color-feedback-border-emphasized-neutral: var(--color-shades-functional-neutralgrey-600);
|
|
362
|
+
--color-feedback-border-emphasized-info: var(--color-shades-functional-blue-800);
|
|
363
|
+
--color-feedback-border-emphasized-error: var(--color-shades-functional-red-800);
|
|
364
|
+
--color-feedback-border-emphasized-warning: var(--color-shades-functional-yellow-900);
|
|
365
|
+
--color-feedback-border-emphasized-success: var(--color-shades-functional-green-800);
|
|
366
|
+
--color-dangerlevel-background-mute-level1: var(--color-shades-functional-green-150);
|
|
367
|
+
--color-dangerlevel-background-mute-level2: var(--color-shades-functional-yellow-200);
|
|
368
|
+
--color-dangerlevel-background-mute-level3: var(--color-shades-functional-orange-150);
|
|
369
|
+
--color-dangerlevel-background-mute-level4: var(--color-shades-functional-red-050);
|
|
370
|
+
--color-dangerlevel-background-mute-level5: var(--color-shades-functional-neutralgrey-200);
|
|
371
|
+
--color-dangerlevel-background-subtle-level1: var(--color-shades-functional-green-100);
|
|
372
|
+
--color-dangerlevel-background-subtle-level2: var(--color-shades-functional-yellow-100);
|
|
373
|
+
--color-dangerlevel-background-subtle-level3: var(--color-shades-functional-orange-050);
|
|
374
|
+
--color-dangerlevel-background-subtle-level4: var(--color-shades-functional-red-000);
|
|
375
|
+
--color-dangerlevel-background-subtle-level5: var(--color-shades-functional-neutralgrey-150);
|
|
376
|
+
--color-dangerlevel-background-default-level1: var(--color-shades-functional-green-500);
|
|
377
|
+
--color-dangerlevel-background-default-level2: var(--color-shades-functional-yellow-500);
|
|
378
|
+
--color-dangerlevel-background-default-level3: var(--color-shades-functional-orange-400);
|
|
379
|
+
--color-dangerlevel-background-default-level4: var(--color-shades-functional-red-500);
|
|
380
|
+
--color-dangerlevel-background-default-level5: var(--color-shades-functional-neutralgrey-950);
|
|
381
|
+
--color-dangerlevel-foreground-default-level1: var(--color-shades-functional-neutralgrey-999);
|
|
382
|
+
--color-dangerlevel-foreground-default-level2: var(--color-shades-functional-neutralgrey-999);
|
|
383
|
+
--color-dangerlevel-foreground-default-level3: var(--color-shades-functional-neutralgrey-999);
|
|
384
|
+
--color-dangerlevel-foreground-default-level4: var(--color-shades-functional-neutralgrey-999);
|
|
385
|
+
--color-dangerlevel-foreground-default-level5: var(--color-shades-functional-neutralgrey-000);
|
|
386
|
+
--color-dangerlevel-foreground-mute-level1: var(--color-shades-functional-neutralgrey-999);
|
|
387
|
+
--color-dangerlevel-foreground-mute-level2: var(--color-shades-functional-neutralgrey-999);
|
|
388
|
+
--color-dangerlevel-foreground-mute-level3: var(--color-shades-functional-neutralgrey-999);
|
|
389
|
+
--color-dangerlevel-foreground-mute-level4: var(--color-shades-functional-neutralgrey-999);
|
|
390
|
+
--color-dangerlevel-foreground-mute-level5: var(--color-shades-functional-neutralgrey-999);
|
|
391
|
+
--color-dangerlevel-foreground-subtle-level1: var(--color-shades-functional-neutralgrey-999);
|
|
392
|
+
--color-dangerlevel-foreground-subtle-level2: var(--color-shades-functional-neutralgrey-999);
|
|
393
|
+
--color-dangerlevel-foreground-subtle-level3: var(--color-shades-functional-neutralgrey-999);
|
|
394
|
+
--color-dangerlevel-foreground-subtle-level4: var(--color-shades-functional-neutralgrey-999);
|
|
395
|
+
--color-dangerlevel-foreground-subtle-level5: var(--color-shades-functional-neutralgrey-999);
|
|
396
|
+
--color-supplemental-subtle-teal-background: var(--color-shades-additional-teal-150);
|
|
397
|
+
--color-supplemental-subtle-teal-foreground: var(--color-shades-additional-teal-900);
|
|
398
|
+
--color-supplemental-subtle-purple-background: var(--color-shades-additional-purple-200);
|
|
399
|
+
--color-supplemental-subtle-purple-foreground: var(--color-shades-additional-purple-950);
|
|
400
|
+
--color-supplemental-subtle-lime-background: var(--color-shades-additional-lime-150);
|
|
401
|
+
--color-supplemental-subtle-lime-foreground: var(--color-shades-additional-lime-850);
|
|
402
|
+
--color-supplemental-subtle-magenta-background: var(--color-shades-additional-magenta-150);
|
|
403
|
+
--color-supplemental-subtle-magenta-foreground: var(--color-shades-additional-magenta-850);
|
|
404
|
+
--color-supplemental-subtle-yellow-background: var(--color-shades-functional-yellow-150);
|
|
405
|
+
--color-supplemental-subtle-yellow-foreground: var(--color-shades-additional-lime-999);
|
|
406
|
+
--color-supplemental-subtle-grey-background: var(--color-shades-functional-neutralgrey-150);
|
|
407
|
+
--color-supplemental-subtle-grey-foreground: var(--color-shades-functional-neutralgrey-850);
|
|
408
|
+
--color-supplemental-subtle-red-background: var(--color-shades-functional-red-100);
|
|
409
|
+
--color-supplemental-subtle-red-foreground: var(--color-shades-functional-red-999);
|
|
410
|
+
--color-supplemental-subtle-blue-background: var(--color-shades-functional-blue-150);
|
|
411
|
+
--color-supplemental-subtle-blue-foreground: var(--color-shades-functional-blue-950);
|
|
412
|
+
--color-supplemental-emphasized-teal-background: var(--color-shades-additional-teal-500);
|
|
413
|
+
--color-supplemental-emphasized-teal-foreground: var(--color-shades-additional-teal-950);
|
|
414
|
+
--color-supplemental-emphasized-purple-background: var(--color-shades-additional-purple-400);
|
|
415
|
+
--color-supplemental-emphasized-purple-foreground: var(--color-shades-additional-purple-950);
|
|
416
|
+
--color-supplemental-emphasized-lime-background: var(--color-shades-additional-lime-500);
|
|
417
|
+
--color-supplemental-emphasized-lime-foreground: var(--color-shades-additional-lime-900);
|
|
418
|
+
--color-supplemental-emphasized-magenta-background: var(--color-shades-additional-magenta-500);
|
|
419
|
+
--color-supplemental-emphasized-magenta-foreground: var(--color-shades-additional-magenta-950);
|
|
420
|
+
--color-supplemental-emphasized-yellow-background: var(--color-shades-functional-yellow-400);
|
|
362
421
|
--color-supplemental-emphasized-yellow-foreground: var(--color-shades-grey-999);
|
|
363
|
-
--color-supplemental-emphasized-grey-background: var(--color-shades-neutralgrey-400);
|
|
364
|
-
--color-supplemental-emphasized-grey-foreground: var(--color-shades-neutralgrey-999);
|
|
365
|
-
--color-supplemental-emphasized-red-background: var(--color-shades-red-300);
|
|
422
|
+
--color-supplemental-emphasized-grey-background: var(--color-shades-functional-neutralgrey-400);
|
|
423
|
+
--color-supplemental-emphasized-grey-foreground: var(--color-shades-functional-neutralgrey-999);
|
|
424
|
+
--color-supplemental-emphasized-red-background: var(--color-shades-functional-red-300);
|
|
366
425
|
--color-supplemental-emphasized-red-foreground: var(--color-shades-grey-999);
|
|
367
|
-
--color-supplemental-emphasized-blue-background: var(--color-shades-blue-400);
|
|
426
|
+
--color-supplemental-emphasized-blue-background: var(--color-shades-functional-blue-400);
|
|
368
427
|
--color-supplemental-emphasized-blue-foreground: var(--color-shades-grey-999);
|
|
428
|
+
--color-supplemental-charts-background-primary-transparent: var(--color-shades-data-color-a-300-005);
|
|
429
|
+
--color-supplemental-charts-foreground-data-01: var(--color-shades-data-color-a-300);
|
|
430
|
+
--color-supplemental-charts-foreground-data-02: var(--color-shades-data-color-a-600);
|
|
431
|
+
--color-supplemental-charts-foreground-data-03: var(--color-shades-data-color-a-800);
|
|
432
|
+
--color-supplemental-charts-foreground-data-04: var(--color-shades-data-color-a-950);
|
|
433
|
+
--color-supplemental-charts-foreground-data-05: var(--color-shades-data-color-b-900);
|
|
434
|
+
--color-supplemental-charts-foreground-data-06: var(--color-shades-data-color-b-800);
|
|
435
|
+
--color-supplemental-charts-foreground-data-07: var(--color-shades-data-color-b-500);
|
|
436
|
+
--color-supplemental-charts-foreground-data-08: var(--color-shades-data-color-c-600);
|
|
437
|
+
--color-supplemental-charts-foreground-data-09: var(--color-shades-data-color-c-800);
|
|
438
|
+
--color-supplemental-charts-foreground-data-10: var(--color-shades-data-color-c-900);
|
|
439
|
+
--color-supplemental-charts-foreground-data-11: var(--color-shades-data-color-d-900);
|
|
440
|
+
--color-supplemental-charts-foreground-data-12: var(--color-shades-data-color-d-800);
|
|
441
|
+
--color-supplemental-charts-foreground-data-13: var(--color-shades-data-color-d-600);
|
|
442
|
+
--color-supplemental-charts-foreground-data-14: var(--color-shades-data-color-e-300);
|
|
443
|
+
--color-supplemental-charts-foreground-data-15: var(--color-shades-data-color-e-400);
|
|
444
|
+
--color-supplemental-charts-foreground-data-16: var(--color-shades-data-color-e-500);
|
|
445
|
+
--color-supplemental-charts-foreground-data-17: var(--color-shades-data-color-f-800);
|
|
446
|
+
--color-supplemental-charts-foreground-data-18: var(--color-shades-data-color-g-800);
|
|
369
447
|
--spacing-none: 0;
|
|
448
|
+
--spacing-20x: 20px;
|
|
370
449
|
--spacing-24x: 24px;
|
|
371
450
|
--spacing-32x: 32px;
|
|
372
451
|
--spacing-40x: 40px;
|
|
452
|
+
--spacing-48x: 48px;
|
|
373
453
|
--spacing-50x: 50px;
|
|
454
|
+
--spacing-56x: 56px;
|
|
455
|
+
--spacing-88x: 88px;
|
|
374
456
|
--spacing-220x: 220px;
|
|
375
457
|
--spacing-620x: 620px;
|
|
376
|
-
--sizing-
|
|
377
|
-
--sizing-
|
|
378
|
-
--sizing-
|
|
379
|
-
--sizing-
|
|
380
|
-
--sizing-
|
|
381
|
-
--sizing-
|
|
382
|
-
--sizing-
|
|
383
|
-
--sizing-
|
|
458
|
+
--sizing-24x: 24px;
|
|
459
|
+
--sizing-32x: 32px;
|
|
460
|
+
--sizing-40x: 40px;
|
|
461
|
+
--sizing-64x: 64px;
|
|
462
|
+
--sizing-88x: 88px;
|
|
463
|
+
--sizing-200x: 200px;
|
|
464
|
+
--sizing-216x: 216px;
|
|
465
|
+
--sizing-217x: 217px;
|
|
466
|
+
--sizing-220x: 220px;
|
|
467
|
+
--sizing-232x: 232px;
|
|
468
|
+
--sizing-256x: 256px;
|
|
469
|
+
--sizing-282x: 282px;
|
|
470
|
+
--sizing-286x: 286px;
|
|
471
|
+
--sizing-320x: 320px;
|
|
472
|
+
--sizing-342x: 342px;
|
|
473
|
+
--sizing-366x: 366px;
|
|
474
|
+
--sizing-389x: 389px;
|
|
475
|
+
--sizing-390x: 390px;
|
|
476
|
+
--sizing-428x: 428px;
|
|
477
|
+
--sizing-440x: 440px;
|
|
478
|
+
--sizing-468x: 468px;
|
|
479
|
+
--sizing-480x: 480px;
|
|
480
|
+
--sizing-496x: 496px;
|
|
481
|
+
--sizing-520x: 520px;
|
|
482
|
+
--sizing-544x: 544px;
|
|
483
|
+
--sizing-572x: 572px;
|
|
484
|
+
--sizing-588x: 588px;
|
|
485
|
+
--sizing-600x: 600px;
|
|
486
|
+
--sizing-700x: 700px;
|
|
487
|
+
--sizing-750x: 750px;
|
|
488
|
+
--sizing-763x: 763px;
|
|
489
|
+
--sizing-764x: 764px;
|
|
490
|
+
--sizing-799x: 799px;
|
|
491
|
+
--sizing-800x: 800px;
|
|
492
|
+
--sizing-1000x: 1000px;
|
|
493
|
+
--sizing-1023x: 1023px;
|
|
494
|
+
--sizing-1024x: 1024px;
|
|
495
|
+
--sizing-1140x: 1140px;
|
|
496
|
+
--sizing-1200x: 1200px;
|
|
497
|
+
--sizing-1439x: 1439px;
|
|
498
|
+
--sizing-1440x: 1440px;
|
|
499
|
+
--sizing-1599x: 1599px;
|
|
500
|
+
--sizing-1600x: 1600px;
|
|
501
|
+
--sizing-1800x: 1800px;
|
|
502
|
+
--sizing-2439x: 2439px;
|
|
503
|
+
--sizing-2440x: 2440px;
|
|
504
|
+
--sizing-2560x: 2560px;
|
|
505
|
+
--sizing-9999x: 9999px;
|
|
384
506
|
--dimension-025x: 0.0625rem; /** 1px */
|
|
385
507
|
--dimension-05x: 0.125rem; /** 2px */
|
|
386
508
|
--dimension-1x: 0.25rem; /** 4px */
|
|
@@ -432,6 +554,46 @@
|
|
|
432
554
|
--border-width-none: 0px;
|
|
433
555
|
--border-width-default: 1px;
|
|
434
556
|
--border-width-strong: 2px;
|
|
557
|
+
--border-width-stronger: 4px;
|
|
558
|
+
--spacing-2x-small: var(--dimension-1x);
|
|
559
|
+
--spacing-x-small: var(--dimension-2x);
|
|
560
|
+
--spacing-small: var(--dimension-3x);
|
|
561
|
+
--spacing-medium: var(--dimension-4x);
|
|
562
|
+
--spacing-large: var(--dimension-6x);
|
|
563
|
+
--spacing-x-large: var(--dimension-8x);
|
|
564
|
+
--spacing-2x-large: var(--dimension-12x);
|
|
565
|
+
--spacing-3x-large: var(--dimension-16x);
|
|
566
|
+
--spacing-4x-large: var(--dimension-20x);
|
|
567
|
+
--spacing-5x-large: var(--dimension-24x);
|
|
568
|
+
--spacing-content-margin-top: var(--spacing-40x);
|
|
569
|
+
--spacing-content-margin-bottom: var(--spacing-88x);
|
|
570
|
+
--spacing-content-margin-left-right: var(--spacing-48x);
|
|
571
|
+
--sizing-4x-small: var(--dimension-2x);
|
|
572
|
+
--sizing-3x-small: var(--dimension-4x);
|
|
573
|
+
--sizing-2x-small: var(--dimension-6x);
|
|
574
|
+
--sizing-x-small: var(--dimension-9x);
|
|
575
|
+
--sizing-small: var(--dimension-12x);
|
|
576
|
+
--sizing-medium: var(--dimension-15x);
|
|
577
|
+
--sizing-large: var(--dimension-18x);
|
|
578
|
+
--sizing-x-large: var(--dimension-21x);
|
|
579
|
+
--sizing-2x-large: var(--dimension-24x);
|
|
580
|
+
--sizing-device-page-min-width: var(--sizing-1024x);
|
|
581
|
+
--sizing-device-page-max-width: var(--sizing-1599x);
|
|
582
|
+
--sizing-device-content-max-width-large: var(--sizing-1800x);
|
|
583
|
+
--sizing-device-content-max-width-medium: var(--sizing-1000x);
|
|
584
|
+
--sizing-device-content-max-width-small: var(--sizing-572x);
|
|
585
|
+
--sizing-device-content-max-width-x-small: var(--sizing-232x);
|
|
586
|
+
--sizing-brand-logo-medium: var(--sizing-64x);
|
|
587
|
+
--sizing-brand-illustration-medium: var(--sizing-40x);
|
|
588
|
+
--sizing-image-large: var(--sizing-750x);
|
|
589
|
+
--sizing-fixed-sizing-2x-small: var(--dimension-4x);
|
|
590
|
+
--sizing-fixed-sizing-x-small: var(--dimension-5x);
|
|
591
|
+
--sizing-fixed-sizing-small: var(--dimension-6x);
|
|
592
|
+
--sizing-fixed-sizing-medium: var(--dimension-8x);
|
|
593
|
+
--sizing-fixed-sizing-large: var(--dimension-10x);
|
|
594
|
+
--sizing-fixed-sizing-x-large: var(--dimension-12x);
|
|
595
|
+
--sizing-fixed-sizing-2x-large: var(--dimension-14x);
|
|
596
|
+
--sizing-fixed-sizing-3x-large: var(--dimension-16x);
|
|
435
597
|
--typography-heading-x-large: var(--font-weight-semibold) var(--font-size-3x-large)/var(--line-height-0) var(--font-family-source-sans-pro);
|
|
436
598
|
--typography-heading-large: var(--font-weight-semibold) var(--font-size-2x-large)/var(--line-height-1) var(--font-family-source-sans-pro);
|
|
437
599
|
--typography-heading-medium: var(--font-weight-semibold) var(--font-size-x-large)/var(--line-height-2) var(--font-family-source-sans-pro);
|
|
@@ -470,40 +632,9 @@
|
|
|
470
632
|
--typography-label-medium-light: var(--font-weight-regular) var(--font-size-small)/var(--line-height-6) var(--font-family-source-sans-pro);
|
|
471
633
|
--typography-label-small: var(--font-weight-semibold) var(--font-size-x-small)/var(--line-height-6) var(--font-family-source-sans-pro);
|
|
472
634
|
--typography-label-small-light: var(--font-weight-regular) var(--font-size-x-small)/var(--line-height-6) var(--font-family-source-sans-pro);
|
|
635
|
+
--font-size-2x-small: var(--dimension-3-5x); /** 12 px */
|
|
473
636
|
--typography-label-x-small: var(--font-weight-semibold) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-source-sans-pro);
|
|
474
637
|
--typography-label-x-small-light: var(--font-weight-regular) var(--font-size-2x-small)/var(--line-height-6) var(--font-family-source-sans-pro);
|
|
475
|
-
--spacing-2x-small: var(--dimension-1x);
|
|
476
|
-
--spacing-x-small: var(--dimension-2x);
|
|
477
|
-
--spacing-small: var(--dimension-3x);
|
|
478
|
-
--spacing-medium: var(--dimension-4x);
|
|
479
|
-
--spacing-large: var(--dimension-6x);
|
|
480
|
-
--spacing-x-large: var(--dimension-8x);
|
|
481
|
-
--spacing-2x-large: var(--dimension-12x);
|
|
482
|
-
--spacing-3x-large: var(--dimension-16x);
|
|
483
|
-
--spacing-4x-large: var(--dimension-20x);
|
|
484
|
-
--spacing-5x-large: var(--dimension-24x);
|
|
485
|
-
--spacing-content-margin-top-bottom: var(--spacing-40x);
|
|
486
|
-
--spacing-content-margin-left-right: var(--spacing-220x);
|
|
487
|
-
--sizing-4x-small: var(--dimension-2x);
|
|
488
|
-
--sizing-3x-small: var(--dimension-4x);
|
|
489
|
-
--sizing-2x-small: var(--dimension-6x);
|
|
490
|
-
--sizing-x-small: var(--dimension-9x);
|
|
491
|
-
--sizing-small: var(--dimension-12x);
|
|
492
|
-
--sizing-medium: var(--dimension-15x);
|
|
493
|
-
--sizing-large: var(--dimension-18x);
|
|
494
|
-
--sizing-x-large: var(--dimension-21x);
|
|
495
|
-
--sizing-2x-large: var(--dimension-24x);
|
|
496
|
-
--sizing-device-width: var(--sizing-device-width-desktop);
|
|
497
|
-
--sizing-device-content: var(--sizing-content-area-desktop);
|
|
498
|
-
--sizing-fixed-sizing-2x-small: var(--dimension-4x);
|
|
499
|
-
--sizing-fixed-sizing-x-small: var(--dimension-5x);
|
|
500
|
-
--sizing-fixed-sizing-small: var(--dimension-6x);
|
|
501
|
-
--sizing-fixed-sizing-medium: var(--dimension-8x);
|
|
502
|
-
--sizing-fixed-sizing-large: var(--dimension-10x);
|
|
503
|
-
--sizing-fixed-sizing-x-large: var(--dimension-12x);
|
|
504
|
-
--sizing-fixed-sizing-2x-large: var(--dimension-14x);
|
|
505
|
-
--sizing-fixed-sizing-3x-large: var(--dimension-16x);
|
|
506
|
-
--font-size-2x-small: var(--dimension-3-5x); /** 12 px */
|
|
507
638
|
--font-size-x-small: var(--dimension-4x); /** 14 px */
|
|
508
639
|
--font-size-small: var(--dimension-4-5x); /** 16 px */
|
|
509
640
|
--font-size-medium: var(--dimension-5x); /** 18 px */
|
|
@@ -511,27 +642,71 @@
|
|
|
511
642
|
--font-size-x-large: var(--dimension-8x); /** 24 px */
|
|
512
643
|
--font-size-2x-large: var(--dimension-10x); /** 32 px */
|
|
513
644
|
--font-size-3x-large: var(--dimension-12x); /** 40 px */ }
|
|
514
|
-
@media (min-width:
|
|
645
|
+
@media (min-width: 1600px) {
|
|
515
646
|
/**
|
|
516
647
|
* Do not edit directly, this file was auto-generated.
|
|
517
648
|
*/
|
|
518
649
|
|
|
519
650
|
:root {
|
|
520
651
|
--spacing-none: 0;
|
|
652
|
+
--spacing-20x: 20px;
|
|
521
653
|
--spacing-24x: 24px;
|
|
522
654
|
--spacing-32x: 32px;
|
|
523
655
|
--spacing-40x: 40px;
|
|
656
|
+
--spacing-48x: 48px;
|
|
524
657
|
--spacing-50x: 50px;
|
|
658
|
+
--spacing-56x: 56px;
|
|
659
|
+
--spacing-88x: 88px;
|
|
525
660
|
--spacing-220x: 220px;
|
|
526
661
|
--spacing-620x: 620px;
|
|
527
|
-
--sizing-
|
|
528
|
-
--sizing-
|
|
529
|
-
--sizing-
|
|
530
|
-
--sizing-
|
|
531
|
-
--sizing-
|
|
532
|
-
--sizing-
|
|
533
|
-
--sizing-
|
|
534
|
-
--sizing-
|
|
662
|
+
--sizing-24x: 24px;
|
|
663
|
+
--sizing-32x: 32px;
|
|
664
|
+
--sizing-40x: 40px;
|
|
665
|
+
--sizing-64x: 64px;
|
|
666
|
+
--sizing-88x: 88px;
|
|
667
|
+
--sizing-200x: 200px;
|
|
668
|
+
--sizing-216x: 216px;
|
|
669
|
+
--sizing-217x: 217px;
|
|
670
|
+
--sizing-220x: 220px;
|
|
671
|
+
--sizing-232x: 232px;
|
|
672
|
+
--sizing-256x: 256px;
|
|
673
|
+
--sizing-282x: 282px;
|
|
674
|
+
--sizing-286x: 286px;
|
|
675
|
+
--sizing-320x: 320px;
|
|
676
|
+
--sizing-342x: 342px;
|
|
677
|
+
--sizing-366x: 366px;
|
|
678
|
+
--sizing-389x: 389px;
|
|
679
|
+
--sizing-390x: 390px;
|
|
680
|
+
--sizing-428x: 428px;
|
|
681
|
+
--sizing-440x: 440px;
|
|
682
|
+
--sizing-468x: 468px;
|
|
683
|
+
--sizing-480x: 480px;
|
|
684
|
+
--sizing-496x: 496px;
|
|
685
|
+
--sizing-520x: 520px;
|
|
686
|
+
--sizing-544x: 544px;
|
|
687
|
+
--sizing-572x: 572px;
|
|
688
|
+
--sizing-588x: 588px;
|
|
689
|
+
--sizing-600x: 600px;
|
|
690
|
+
--sizing-700x: 700px;
|
|
691
|
+
--sizing-750x: 750px;
|
|
692
|
+
--sizing-763x: 763px;
|
|
693
|
+
--sizing-764x: 764px;
|
|
694
|
+
--sizing-799x: 799px;
|
|
695
|
+
--sizing-800x: 800px;
|
|
696
|
+
--sizing-1000x: 1000px;
|
|
697
|
+
--sizing-1023x: 1023px;
|
|
698
|
+
--sizing-1024x: 1024px;
|
|
699
|
+
--sizing-1140x: 1140px;
|
|
700
|
+
--sizing-1200x: 1200px;
|
|
701
|
+
--sizing-1439x: 1439px;
|
|
702
|
+
--sizing-1440x: 1440px;
|
|
703
|
+
--sizing-1599x: 1599px;
|
|
704
|
+
--sizing-1600x: 1600px;
|
|
705
|
+
--sizing-1800x: 1800px;
|
|
706
|
+
--sizing-2439x: 2439px;
|
|
707
|
+
--sizing-2440x: 2440px;
|
|
708
|
+
--sizing-2560x: 2560px;
|
|
709
|
+
--sizing-9999x: 9999px;
|
|
535
710
|
--dimension-025x: 0.0625rem; /** 1px */
|
|
536
711
|
--dimension-05x: 0.125rem; /** 2px */
|
|
537
712
|
--dimension-1x: 0.25rem; /** 4px */
|
|
@@ -583,6 +758,7 @@
|
|
|
583
758
|
--border-width-none: 0px;
|
|
584
759
|
--border-width-default: 1px;
|
|
585
760
|
--border-width-strong: 2px;
|
|
761
|
+
--border-width-stronger: 4px;
|
|
586
762
|
--spacing-2x-small: var(--dimension-1x);
|
|
587
763
|
--spacing-x-small: var(--dimension-2x);
|
|
588
764
|
--spacing-small: var(--dimension-3x);
|
|
@@ -593,8 +769,9 @@
|
|
|
593
769
|
--spacing-3x-large: var(--dimension-16x);
|
|
594
770
|
--spacing-4x-large: var(--dimension-20x);
|
|
595
771
|
--spacing-5x-large: var(--dimension-24x);
|
|
596
|
-
--spacing-content-margin-top
|
|
597
|
-
--spacing-content-margin-
|
|
772
|
+
--spacing-content-margin-top: var(--spacing-40x);
|
|
773
|
+
--spacing-content-margin-bottom: var(--spacing-88x);
|
|
774
|
+
--spacing-content-margin-left-right: var(--spacing-48x);
|
|
598
775
|
--sizing-4x-small: var(--dimension-2x);
|
|
599
776
|
--sizing-3x-small: var(--dimension-4x);
|
|
600
777
|
--sizing-2x-small: var(--dimension-6x);
|
|
@@ -604,8 +781,15 @@
|
|
|
604
781
|
--sizing-large: var(--dimension-18x);
|
|
605
782
|
--sizing-x-large: var(--dimension-21x);
|
|
606
783
|
--sizing-2x-large: var(--dimension-24x);
|
|
607
|
-
--sizing-device-width: var(--sizing-
|
|
608
|
-
--sizing-device-
|
|
784
|
+
--sizing-device-page-min-width: var(--sizing-1600x);
|
|
785
|
+
--sizing-device-page-max-width: var(--sizing-9999x);
|
|
786
|
+
--sizing-device-content-max-width-large: var(--sizing-1800x);
|
|
787
|
+
--sizing-device-content-max-width-medium: var(--sizing-1200x);
|
|
788
|
+
--sizing-device-content-max-width-small: var(--sizing-588x);
|
|
789
|
+
--sizing-device-content-max-width-x-small: var(--sizing-282x);
|
|
790
|
+
--sizing-brand-logo-medium: var(--sizing-88x);
|
|
791
|
+
--sizing-brand-illustration-medium: var(--sizing-40x);
|
|
792
|
+
--sizing-image-large: var(--sizing-1200x);
|
|
609
793
|
--font-size-2x-small: var(--dimension-3-5x); /** 12 px */
|
|
610
794
|
--font-size-x-small: var(--dimension-4x); /** 14 px */
|
|
611
795
|
--font-size-small: var(--dimension-4-5x); /** 16 px */
|
|
@@ -617,27 +801,71 @@
|
|
|
617
801
|
}
|
|
618
802
|
|
|
619
803
|
}
|
|
620
|
-
@media (max-width:
|
|
804
|
+
@media ((min-width: 764px) and (max-width: 1023px)) {
|
|
621
805
|
/**
|
|
622
806
|
* Do not edit directly, this file was auto-generated.
|
|
623
807
|
*/
|
|
624
808
|
|
|
625
809
|
:root {
|
|
626
810
|
--spacing-none: 0;
|
|
811
|
+
--spacing-20x: 20px;
|
|
627
812
|
--spacing-24x: 24px;
|
|
628
813
|
--spacing-32x: 32px;
|
|
629
814
|
--spacing-40x: 40px;
|
|
815
|
+
--spacing-48x: 48px;
|
|
630
816
|
--spacing-50x: 50px;
|
|
817
|
+
--spacing-56x: 56px;
|
|
818
|
+
--spacing-88x: 88px;
|
|
631
819
|
--spacing-220x: 220px;
|
|
632
820
|
--spacing-620x: 620px;
|
|
633
|
-
--sizing-
|
|
634
|
-
--sizing-
|
|
635
|
-
--sizing-
|
|
636
|
-
--sizing-
|
|
637
|
-
--sizing-
|
|
638
|
-
--sizing-
|
|
639
|
-
--sizing-
|
|
640
|
-
--sizing-
|
|
821
|
+
--sizing-24x: 24px;
|
|
822
|
+
--sizing-32x: 32px;
|
|
823
|
+
--sizing-40x: 40px;
|
|
824
|
+
--sizing-64x: 64px;
|
|
825
|
+
--sizing-88x: 88px;
|
|
826
|
+
--sizing-200x: 200px;
|
|
827
|
+
--sizing-216x: 216px;
|
|
828
|
+
--sizing-217x: 217px;
|
|
829
|
+
--sizing-220x: 220px;
|
|
830
|
+
--sizing-232x: 232px;
|
|
831
|
+
--sizing-256x: 256px;
|
|
832
|
+
--sizing-282x: 282px;
|
|
833
|
+
--sizing-286x: 286px;
|
|
834
|
+
--sizing-320x: 320px;
|
|
835
|
+
--sizing-342x: 342px;
|
|
836
|
+
--sizing-366x: 366px;
|
|
837
|
+
--sizing-389x: 389px;
|
|
838
|
+
--sizing-390x: 390px;
|
|
839
|
+
--sizing-428x: 428px;
|
|
840
|
+
--sizing-440x: 440px;
|
|
841
|
+
--sizing-468x: 468px;
|
|
842
|
+
--sizing-480x: 480px;
|
|
843
|
+
--sizing-496x: 496px;
|
|
844
|
+
--sizing-520x: 520px;
|
|
845
|
+
--sizing-544x: 544px;
|
|
846
|
+
--sizing-572x: 572px;
|
|
847
|
+
--sizing-588x: 588px;
|
|
848
|
+
--sizing-600x: 600px;
|
|
849
|
+
--sizing-700x: 700px;
|
|
850
|
+
--sizing-750x: 750px;
|
|
851
|
+
--sizing-763x: 763px;
|
|
852
|
+
--sizing-764x: 764px;
|
|
853
|
+
--sizing-799x: 799px;
|
|
854
|
+
--sizing-800x: 800px;
|
|
855
|
+
--sizing-1000x: 1000px;
|
|
856
|
+
--sizing-1023x: 1023px;
|
|
857
|
+
--sizing-1024x: 1024px;
|
|
858
|
+
--sizing-1140x: 1140px;
|
|
859
|
+
--sizing-1200x: 1200px;
|
|
860
|
+
--sizing-1439x: 1439px;
|
|
861
|
+
--sizing-1440x: 1440px;
|
|
862
|
+
--sizing-1599x: 1599px;
|
|
863
|
+
--sizing-1600x: 1600px;
|
|
864
|
+
--sizing-1800x: 1800px;
|
|
865
|
+
--sizing-2439x: 2439px;
|
|
866
|
+
--sizing-2440x: 2440px;
|
|
867
|
+
--sizing-2560x: 2560px;
|
|
868
|
+
--sizing-9999x: 9999px;
|
|
641
869
|
--dimension-025x: 0.0625rem; /** 1px */
|
|
642
870
|
--dimension-05x: 0.125rem; /** 2px */
|
|
643
871
|
--dimension-1x: 0.25rem; /** 4px */
|
|
@@ -689,6 +917,7 @@
|
|
|
689
917
|
--border-width-none: 0px;
|
|
690
918
|
--border-width-default: 1px;
|
|
691
919
|
--border-width-strong: 2px;
|
|
920
|
+
--border-width-stronger: 4px;
|
|
692
921
|
--spacing-2x-small: var(--dimension-1x);
|
|
693
922
|
--spacing-x-small: var(--dimension-2x);
|
|
694
923
|
--spacing-small: var(--dimension-3x);
|
|
@@ -699,8 +928,9 @@
|
|
|
699
928
|
--spacing-3x-large: var(--dimension-14x);
|
|
700
929
|
--spacing-4x-large: var(--dimension-20x);
|
|
701
930
|
--spacing-5x-large: var(--dimension-22x);
|
|
702
|
-
--spacing-content-margin-top
|
|
703
|
-
--spacing-content-margin-
|
|
931
|
+
--spacing-content-margin-top: var(--spacing-32x);
|
|
932
|
+
--spacing-content-margin-bottom: var(--spacing-56x);
|
|
933
|
+
--spacing-content-margin-left-right: var(--spacing-40x);
|
|
704
934
|
--sizing-4x-small: var(--dimension-1x);
|
|
705
935
|
--sizing-3x-small: var(--dimension-3-5x);
|
|
706
936
|
--sizing-2x-small: var(--dimension-5x);
|
|
@@ -710,8 +940,15 @@
|
|
|
710
940
|
--sizing-large: var(--dimension-17x);
|
|
711
941
|
--sizing-x-large: var(--dimension-20x);
|
|
712
942
|
--sizing-2x-large: var(--dimension-23x);
|
|
713
|
-
--sizing-device-width: var(--sizing-
|
|
714
|
-
--sizing-device-
|
|
943
|
+
--sizing-device-page-min-width: var(--sizing-764x);
|
|
944
|
+
--sizing-device-page-max-width: var(--sizing-1023x);
|
|
945
|
+
--sizing-device-content-max-width-large: var(--sizing-1800x);
|
|
946
|
+
--sizing-device-content-max-width-medium: var(--sizing-800x);
|
|
947
|
+
--sizing-device-content-max-width-small: var(--sizing-544x);
|
|
948
|
+
--sizing-device-content-max-width-x-small: var(--sizing-216x);
|
|
949
|
+
--sizing-brand-logo-medium: var(--sizing-64x);
|
|
950
|
+
--sizing-brand-illustration-medium: var(--sizing-40x);
|
|
951
|
+
--sizing-image-large: var(--sizing-750x);
|
|
715
952
|
--font-size-2x-small: var(--dimension-3x); /** 12 px */
|
|
716
953
|
--font-size-x-small: var(--dimension-3-5x); /** 14 px */
|
|
717
954
|
--font-size-small: var(--dimension-4x); /** 16 px */
|
|
@@ -723,27 +960,71 @@
|
|
|
723
960
|
}
|
|
724
961
|
|
|
725
962
|
}
|
|
726
|
-
@media (max-width:
|
|
963
|
+
@media ((min-width: 390px) and (max-width: 763px)) {
|
|
727
964
|
/**
|
|
728
965
|
* Do not edit directly, this file was auto-generated.
|
|
729
966
|
*/
|
|
730
967
|
|
|
731
968
|
:root {
|
|
732
969
|
--spacing-none: 0;
|
|
970
|
+
--spacing-20x: 20px;
|
|
733
971
|
--spacing-24x: 24px;
|
|
734
972
|
--spacing-32x: 32px;
|
|
735
973
|
--spacing-40x: 40px;
|
|
974
|
+
--spacing-48x: 48px;
|
|
736
975
|
--spacing-50x: 50px;
|
|
976
|
+
--spacing-56x: 56px;
|
|
977
|
+
--spacing-88x: 88px;
|
|
737
978
|
--spacing-220x: 220px;
|
|
738
979
|
--spacing-620x: 620px;
|
|
739
|
-
--sizing-
|
|
740
|
-
--sizing-
|
|
741
|
-
--sizing-
|
|
742
|
-
--sizing-
|
|
743
|
-
--sizing-
|
|
744
|
-
--sizing-
|
|
745
|
-
--sizing-
|
|
746
|
-
--sizing-
|
|
980
|
+
--sizing-24x: 24px;
|
|
981
|
+
--sizing-32x: 32px;
|
|
982
|
+
--sizing-40x: 40px;
|
|
983
|
+
--sizing-64x: 64px;
|
|
984
|
+
--sizing-88x: 88px;
|
|
985
|
+
--sizing-200x: 200px;
|
|
986
|
+
--sizing-216x: 216px;
|
|
987
|
+
--sizing-217x: 217px;
|
|
988
|
+
--sizing-220x: 220px;
|
|
989
|
+
--sizing-232x: 232px;
|
|
990
|
+
--sizing-256x: 256px;
|
|
991
|
+
--sizing-282x: 282px;
|
|
992
|
+
--sizing-286x: 286px;
|
|
993
|
+
--sizing-320x: 320px;
|
|
994
|
+
--sizing-342x: 342px;
|
|
995
|
+
--sizing-366x: 366px;
|
|
996
|
+
--sizing-389x: 389px;
|
|
997
|
+
--sizing-390x: 390px;
|
|
998
|
+
--sizing-428x: 428px;
|
|
999
|
+
--sizing-440x: 440px;
|
|
1000
|
+
--sizing-468x: 468px;
|
|
1001
|
+
--sizing-480x: 480px;
|
|
1002
|
+
--sizing-496x: 496px;
|
|
1003
|
+
--sizing-520x: 520px;
|
|
1004
|
+
--sizing-544x: 544px;
|
|
1005
|
+
--sizing-572x: 572px;
|
|
1006
|
+
--sizing-588x: 588px;
|
|
1007
|
+
--sizing-600x: 600px;
|
|
1008
|
+
--sizing-700x: 700px;
|
|
1009
|
+
--sizing-750x: 750px;
|
|
1010
|
+
--sizing-763x: 763px;
|
|
1011
|
+
--sizing-764x: 764px;
|
|
1012
|
+
--sizing-799x: 799px;
|
|
1013
|
+
--sizing-800x: 800px;
|
|
1014
|
+
--sizing-1000x: 1000px;
|
|
1015
|
+
--sizing-1023x: 1023px;
|
|
1016
|
+
--sizing-1024x: 1024px;
|
|
1017
|
+
--sizing-1140x: 1140px;
|
|
1018
|
+
--sizing-1200x: 1200px;
|
|
1019
|
+
--sizing-1439x: 1439px;
|
|
1020
|
+
--sizing-1440x: 1440px;
|
|
1021
|
+
--sizing-1599x: 1599px;
|
|
1022
|
+
--sizing-1600x: 1600px;
|
|
1023
|
+
--sizing-1800x: 1800px;
|
|
1024
|
+
--sizing-2439x: 2439px;
|
|
1025
|
+
--sizing-2440x: 2440px;
|
|
1026
|
+
--sizing-2560x: 2560px;
|
|
1027
|
+
--sizing-9999x: 9999px;
|
|
747
1028
|
--dimension-025x: 0.0625rem; /** 1px */
|
|
748
1029
|
--dimension-05x: 0.125rem; /** 2px */
|
|
749
1030
|
--dimension-1x: 0.25rem; /** 4px */
|
|
@@ -795,6 +1076,7 @@
|
|
|
795
1076
|
--border-width-none: 0px;
|
|
796
1077
|
--border-width-default: 1px;
|
|
797
1078
|
--border-width-strong: 2px;
|
|
1079
|
+
--border-width-stronger: 4px;
|
|
798
1080
|
--spacing-2x-small: var(--dimension-05x);
|
|
799
1081
|
--spacing-x-small: var(--dimension-1x);
|
|
800
1082
|
--spacing-small: var(--dimension-2x);
|
|
@@ -805,7 +1087,8 @@
|
|
|
805
1087
|
--spacing-3x-large: var(--dimension-11x);
|
|
806
1088
|
--spacing-4x-large: var(--dimension-16x);
|
|
807
1089
|
--spacing-5x-large: var(--dimension-19x);
|
|
808
|
-
--spacing-content-margin-top
|
|
1090
|
+
--spacing-content-margin-top: var(--spacing-24x);
|
|
1091
|
+
--spacing-content-margin-bottom: var(--spacing-48x);
|
|
809
1092
|
--spacing-content-margin-left-right: var(--spacing-24x);
|
|
810
1093
|
--sizing-4x-small: var(--dimension-05x);
|
|
811
1094
|
--sizing-3x-small: var(--dimension-3x);
|
|
@@ -816,8 +1099,15 @@
|
|
|
816
1099
|
--sizing-large: var(--dimension-16x);
|
|
817
1100
|
--sizing-x-large: var(--dimension-19x);
|
|
818
1101
|
--sizing-2x-large: var(--dimension-22x);
|
|
819
|
-
--sizing-device-width: var(--sizing-
|
|
820
|
-
--sizing-device-
|
|
1102
|
+
--sizing-device-page-min-width: var(--sizing-390x);
|
|
1103
|
+
--sizing-device-page-max-width: var(--sizing-763x);
|
|
1104
|
+
--sizing-device-content-max-width-large: var(--sizing-1800x);
|
|
1105
|
+
--sizing-device-content-max-width-medium: var(--sizing-600x);
|
|
1106
|
+
--sizing-device-content-max-width-small: var(--sizing-496x);
|
|
1107
|
+
--sizing-device-content-max-width-x-small: var(--sizing-496x);
|
|
1108
|
+
--sizing-brand-logo-medium: var(--sizing-64x);
|
|
1109
|
+
--sizing-brand-illustration-medium: var(--sizing-40x);
|
|
1110
|
+
--sizing-image-large: var(--sizing-520x);
|
|
821
1111
|
--font-size-2x-small: var(--dimension-3x); /** 12 px */
|
|
822
1112
|
--font-size-x-small: var(--dimension-3-5x); /** 14 px */
|
|
823
1113
|
--font-size-small: var(--dimension-4x); /** 16 px */
|
|
@@ -829,3 +1119,162 @@
|
|
|
829
1119
|
}
|
|
830
1120
|
|
|
831
1121
|
}
|
|
1122
|
+
@media (max-width: 389px) {
|
|
1123
|
+
/**
|
|
1124
|
+
* Do not edit directly, this file was auto-generated.
|
|
1125
|
+
*/
|
|
1126
|
+
|
|
1127
|
+
:root {
|
|
1128
|
+
--spacing-none: 0;
|
|
1129
|
+
--spacing-20x: 20px;
|
|
1130
|
+
--spacing-24x: 24px;
|
|
1131
|
+
--spacing-32x: 32px;
|
|
1132
|
+
--spacing-40x: 40px;
|
|
1133
|
+
--spacing-48x: 48px;
|
|
1134
|
+
--spacing-50x: 50px;
|
|
1135
|
+
--spacing-56x: 56px;
|
|
1136
|
+
--spacing-88x: 88px;
|
|
1137
|
+
--spacing-220x: 220px;
|
|
1138
|
+
--spacing-620x: 620px;
|
|
1139
|
+
--sizing-24x: 24px;
|
|
1140
|
+
--sizing-32x: 32px;
|
|
1141
|
+
--sizing-40x: 40px;
|
|
1142
|
+
--sizing-64x: 64px;
|
|
1143
|
+
--sizing-88x: 88px;
|
|
1144
|
+
--sizing-200x: 200px;
|
|
1145
|
+
--sizing-216x: 216px;
|
|
1146
|
+
--sizing-217x: 217px;
|
|
1147
|
+
--sizing-220x: 220px;
|
|
1148
|
+
--sizing-232x: 232px;
|
|
1149
|
+
--sizing-256x: 256px;
|
|
1150
|
+
--sizing-282x: 282px;
|
|
1151
|
+
--sizing-286x: 286px;
|
|
1152
|
+
--sizing-320x: 320px;
|
|
1153
|
+
--sizing-342x: 342px;
|
|
1154
|
+
--sizing-366x: 366px;
|
|
1155
|
+
--sizing-389x: 389px;
|
|
1156
|
+
--sizing-390x: 390px;
|
|
1157
|
+
--sizing-428x: 428px;
|
|
1158
|
+
--sizing-440x: 440px;
|
|
1159
|
+
--sizing-468x: 468px;
|
|
1160
|
+
--sizing-480x: 480px;
|
|
1161
|
+
--sizing-496x: 496px;
|
|
1162
|
+
--sizing-520x: 520px;
|
|
1163
|
+
--sizing-544x: 544px;
|
|
1164
|
+
--sizing-572x: 572px;
|
|
1165
|
+
--sizing-588x: 588px;
|
|
1166
|
+
--sizing-600x: 600px;
|
|
1167
|
+
--sizing-700x: 700px;
|
|
1168
|
+
--sizing-750x: 750px;
|
|
1169
|
+
--sizing-763x: 763px;
|
|
1170
|
+
--sizing-764x: 764px;
|
|
1171
|
+
--sizing-799x: 799px;
|
|
1172
|
+
--sizing-800x: 800px;
|
|
1173
|
+
--sizing-1000x: 1000px;
|
|
1174
|
+
--sizing-1023x: 1023px;
|
|
1175
|
+
--sizing-1024x: 1024px;
|
|
1176
|
+
--sizing-1140x: 1140px;
|
|
1177
|
+
--sizing-1200x: 1200px;
|
|
1178
|
+
--sizing-1439x: 1439px;
|
|
1179
|
+
--sizing-1440x: 1440px;
|
|
1180
|
+
--sizing-1599x: 1599px;
|
|
1181
|
+
--sizing-1600x: 1600px;
|
|
1182
|
+
--sizing-1800x: 1800px;
|
|
1183
|
+
--sizing-2439x: 2439px;
|
|
1184
|
+
--sizing-2440x: 2440px;
|
|
1185
|
+
--sizing-2560x: 2560px;
|
|
1186
|
+
--sizing-9999x: 9999px;
|
|
1187
|
+
--dimension-025x: 0.0625rem; /** 1px */
|
|
1188
|
+
--dimension-05x: 0.125rem; /** 2px */
|
|
1189
|
+
--dimension-1x: 0.25rem; /** 4px */
|
|
1190
|
+
--dimension-2x: 0.5rem; /** 8px */
|
|
1191
|
+
--dimension-3x: 0.75rem; /** 12px */
|
|
1192
|
+
--dimension-3-5x: 0.875rem; /** 14px */
|
|
1193
|
+
--dimension-4x: 1rem; /** 16px */
|
|
1194
|
+
--dimension-4-5x: 1.125rem; /** 18px */
|
|
1195
|
+
--dimension-5x: 1.25rem; /** 20px */
|
|
1196
|
+
--dimension-6x: 1.5rem; /** 24px */
|
|
1197
|
+
--dimension-7x: 1.75rem; /** 28px */
|
|
1198
|
+
--dimension-8x: 2rem; /** 32px */
|
|
1199
|
+
--dimension-9x: 2.25rem; /** 36px */
|
|
1200
|
+
--dimension-10x: 2.5rem; /** 40px */
|
|
1201
|
+
--dimension-11x: 2.75rem; /** 44px */
|
|
1202
|
+
--dimension-12x: 3rem; /** 48px */
|
|
1203
|
+
--dimension-13x: 3.25rem; /** 52px */
|
|
1204
|
+
--dimension-14x: 3.5rem; /** 56px */
|
|
1205
|
+
--dimension-15x: 3.75rem; /** 60px */
|
|
1206
|
+
--dimension-16x: 4rem; /** 64px */
|
|
1207
|
+
--dimension-17x: 4.25rem; /** 68px */
|
|
1208
|
+
--dimension-18x: 4.5rem; /** 72px */
|
|
1209
|
+
--dimension-19x: 4.75rem; /** 76px */
|
|
1210
|
+
--dimension-20x: 5rem; /** 80px */
|
|
1211
|
+
--dimension-21x: 5.25rem; /** 84px */
|
|
1212
|
+
--dimension-22x: 5.5rem; /** 88px */
|
|
1213
|
+
--dimension-23x: 5.75rem; /** 92px */
|
|
1214
|
+
--dimension-24x: 6rem; /** 96px */
|
|
1215
|
+
--dimension-25x: 6.25rem; /** 100px */
|
|
1216
|
+
--dimension-26x: 6.5rem; /** 104px */
|
|
1217
|
+
--dimension-27x: 6.75rem; /** 108px */
|
|
1218
|
+
--dimension-28x: 7rem; /** 112px */
|
|
1219
|
+
--dimension-29x: 7.25rem; /** 116px */
|
|
1220
|
+
--dimension-30x: 7.5rem; /** 120px */
|
|
1221
|
+
--letter-spacing-0: 0em;
|
|
1222
|
+
--letter-spacing-1: 0.05em;
|
|
1223
|
+
--paragraph-spacing-0: 0;
|
|
1224
|
+
--paragraph-spacing-1: 12px;
|
|
1225
|
+
--paragraph-spacing-2: 16px;
|
|
1226
|
+
--paragraph-spacing-3: 24px;
|
|
1227
|
+
--paragraph-spacing-4: 32px;
|
|
1228
|
+
--paragraph-spacing-5: 40px;
|
|
1229
|
+
--paragraph-indent-0: 0px;
|
|
1230
|
+
--border-radius-none: 0px;
|
|
1231
|
+
--border-radius-small: 4px;
|
|
1232
|
+
--border-radius-large: 6px;
|
|
1233
|
+
--border-radius-circle: 50px;
|
|
1234
|
+
--border-radius-pill: 9999px;
|
|
1235
|
+
--border-width-none: 0px;
|
|
1236
|
+
--border-width-default: 1px;
|
|
1237
|
+
--border-width-strong: 2px;
|
|
1238
|
+
--border-width-stronger: 4px;
|
|
1239
|
+
--spacing-2x-small: var(--dimension-05x);
|
|
1240
|
+
--spacing-x-small: var(--dimension-1x);
|
|
1241
|
+
--spacing-small: var(--dimension-2x);
|
|
1242
|
+
--spacing-medium: var(--dimension-3x);
|
|
1243
|
+
--spacing-large: var(--dimension-4x);
|
|
1244
|
+
--spacing-x-large: var(--dimension-4-5x);
|
|
1245
|
+
--spacing-2x-large: var(--dimension-5x);
|
|
1246
|
+
--spacing-3x-large: var(--dimension-6x);
|
|
1247
|
+
--spacing-4x-large: var(--dimension-7x);
|
|
1248
|
+
--spacing-5x-large: var(--dimension-10x);
|
|
1249
|
+
--spacing-content-margin-top: var(--spacing-24x);
|
|
1250
|
+
--spacing-content-margin-bottom: var(--spacing-40x);
|
|
1251
|
+
--spacing-content-margin-left-right: var(--spacing-20x);
|
|
1252
|
+
--sizing-4x-small: var(--dimension-05x);
|
|
1253
|
+
--sizing-3x-small: var(--dimension-3x);
|
|
1254
|
+
--sizing-2x-small: var(--dimension-4-5x);
|
|
1255
|
+
--sizing-x-small: var(--dimension-7x);
|
|
1256
|
+
--sizing-small: var(--dimension-10x);
|
|
1257
|
+
--sizing-medium: var(--dimension-13x);
|
|
1258
|
+
--sizing-large: var(--dimension-16x);
|
|
1259
|
+
--sizing-x-large: var(--dimension-19x);
|
|
1260
|
+
--sizing-2x-large: var(--dimension-22x);
|
|
1261
|
+
--sizing-device-page-min-width: var(--sizing-320x);
|
|
1262
|
+
--sizing-device-page-max-width: var(--sizing-389x);
|
|
1263
|
+
--sizing-device-content-max-width-large: var(--sizing-1800x);
|
|
1264
|
+
--sizing-device-content-max-width-medium: var(--sizing-366x);
|
|
1265
|
+
--sizing-device-content-max-width-small: var(--sizing-496x);
|
|
1266
|
+
--sizing-device-content-max-width-x-small: var(--sizing-496x);
|
|
1267
|
+
--sizing-brand-logo-medium: var(--sizing-64x);
|
|
1268
|
+
--sizing-brand-illustration-medium: var(--sizing-24x);
|
|
1269
|
+
--sizing-image-large: var(--sizing-440x);
|
|
1270
|
+
--font-size-2x-small: var(--dimension-3x); /** 12 px */
|
|
1271
|
+
--font-size-x-small: var(--dimension-3-5x); /** 14 px */
|
|
1272
|
+
--font-size-small: var(--dimension-4x); /** 16 px */
|
|
1273
|
+
--font-size-medium: var(--dimension-4-5x); /** 18 px */
|
|
1274
|
+
--font-size-large: var(--dimension-5x); /** 20 px */
|
|
1275
|
+
--font-size-x-large: var(--dimension-6x); /** 24 px */
|
|
1276
|
+
--font-size-2x-large: var(--dimension-7x); /** 32 px */
|
|
1277
|
+
--font-size-3x-large: var(--dimension-8x); /** 40 px */
|
|
1278
|
+
}
|
|
1279
|
+
|
|
1280
|
+
}
|