@alfalab/core-components-vars 5.5.0 → 6.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/colors-bluetint.css +167 -46
  2. package/colors-indigo.css +167 -68
  3. package/colors-x5.css +4 -0
  4. package/cssm/colors-bluetint.css +167 -46
  5. package/cssm/colors-indigo.css +167 -68
  6. package/cssm/colors-x5.css +4 -0
  7. package/cssm/index.css +167 -68
  8. package/package.json +1 -1
package/cssm/colors-bluetint.css CHANGED
@@ -3,34 +3,44 @@
3
3
  --color-dark-bg-attention-muted: #332104;
4
4
  --color-dark-bg-info: #001c3c;
5
5
  --color-dark-bg-negative-muted: #35110d;
6
- --color-dark-bg-neutral: #3a3a3c;
7
6
  --color-dark-bg-opaque: rgba(255, 255, 255, 0.8);
8
7
  --color-dark-bg-overlay: rgba(0, 0, 0, 0.8);
9
8
  --color-dark-bg-positive-muted: #042117;
10
9
  --color-dark-bg-primary: #121212;
11
10
  --color-dark-bg-primary-inverted: #fff;
11
+ --color-dark-bg-quaternary: #3a3a3c;
12
+ --color-dark-bg-quaternary-inverted: #dcdcdd;
12
13
  --color-dark-bg-secondary: #202022;
13
14
  --color-dark-bg-secondary-inverted: #f3f4f5;
14
15
  --color-dark-bg-tertiary: #2c2c2e;
15
16
  --color-dark-bg-tertiary-inverted: #e9e9eb;
16
17
  --color-dark-border-accent: #ef3124;
17
18
  --color-dark-border-key: #fff;
18
- --color-dark-border-key-inverted: #121212;
19
+ --color-dark-border-key-inverted: #000;
20
+ --color-dark-border-link: #0072ef;
19
21
  --color-dark-border-primary: #2b2b2e;
22
+ --color-dark-border-primary-inverted: #dcdcdd;
20
23
  --color-dark-border-secondary: #262629;
21
24
  --color-dark-border-secondary-inverted: #e9e9eb;
22
25
  --color-dark-border-tertiary: #1c1c1e;
23
26
  --color-dark-border-tertiary-inverted: #f3f4f5;
27
+ --color-dark-border-underline: #464649;
28
+ --color-dark-border-underline-inverted: #c5c5c7;
24
29
  --color-dark-graphic-accent: #ef3124;
25
30
  --color-dark-graphic-attention: #f6bf65;
26
31
  --color-dark-graphic-link: #0072ef;
27
32
  --color-dark-graphic-negative: #d91d0b;
28
- --color-dark-graphic-neutral: #2a2a2c;
29
33
  --color-dark-graphic-positive: #2fc26e;
30
34
  --color-dark-graphic-primary: #fff;
31
- --color-dark-graphic-primary-inverted: #121212;
35
+ --color-dark-graphic-primary-inverted: #000;
36
+ --color-dark-graphic-quaternary: #2a2a2c;
37
+ --color-dark-graphic-quaternary-inverted: #dcdcdd;
32
38
  --color-dark-graphic-secondary: #8d8d93;
39
+ --color-dark-graphic-secondary-inverted: #8a8a8e;
33
40
  --color-dark-graphic-tertiary: #464649;
41
+ --color-dark-graphic-tertiary-inverted: #c5c5c7;
42
+ --color-dark-specialbg-component: rgba(255, 255, 255, 0.1);
43
+ --color-dark-specialbg-component-inverted: rgba(0, 0, 0, 0.08);
34
44
  --color-dark-specialbg-nulled: rgba(255, 255, 255, 0);
35
45
  --color-dark-specialbg-overlay-fallback: #070707;
36
46
  --color-dark-specialbg-primary-grouped: #202022;
@@ -39,6 +49,8 @@
39
49
  --color-dark-text-accent: #ef3124;
40
50
  --color-dark-text-attention: #cb830f;
41
51
  --color-dark-text-disabled: #2a2a2c;
52
+ --color-dark-text-disabled-inverted: #dcdcdd;
53
+ --color-dark-text-disabled-inverted-transparent: rgba(60, 60, 67, 0.18);
42
54
  --color-dark-text-disabled-transparent: rgba(235, 235, 245, 0.18);
43
55
  --color-dark-text-link: #0072ef;
44
56
  --color-dark-text-negative: #f15045;
@@ -57,12 +69,13 @@
57
69
  --color-light-bg-attention-muted: #f7ebd9;
58
70
  --color-light-bg-info: #d6e8fc;
59
71
  --color-light-bg-negative-muted: #fbe8e7;
60
- --color-light-bg-neutral: #dcdcdd;
61
72
  --color-light-bg-opaque: rgba(255, 255, 255, 0.8);
62
73
  --color-light-bg-overlay: rgba(0, 0, 0, 0.6);
63
74
  --color-light-bg-positive-muted: #e7f6ef;
64
75
  --color-light-bg-primary: #fff;
65
76
  --color-light-bg-primary-inverted: #121212;
77
+ --color-light-bg-quaternary: #dcdcdd;
78
+ --color-light-bg-quaternary-inverted: #3a3a3c;
66
79
  --color-light-bg-secondary: #f3f4f5;
67
80
  --color-light-bg-secondary-inverted: #202022;
68
81
  --color-light-bg-tertiary: #e9e9eb;
@@ -70,21 +83,30 @@
70
83
  --color-light-border-accent: #ef3124;
71
84
  --color-light-border-key: #000;
72
85
  --color-light-border-key-inverted: #fff;
86
+ --color-light-border-link: #0072ef;
73
87
  --color-light-border-primary: #dcdcdd;
88
+ --color-light-border-primary-inverted: #2b2b2e;
74
89
  --color-light-border-secondary: #e9e9eb;
75
90
  --color-light-border-secondary-inverted: #262629;
76
91
  --color-light-border-tertiary: #f3f4f5;
77
92
  --color-light-border-tertiary-inverted: #1c1c1e;
93
+ --color-light-border-underline: #c5c5c7;
94
+ --color-light-border-underline-inverted: #464649;
78
95
  --color-light-graphic-accent: #ef3124;
79
96
  --color-light-graphic-attention: #f6bf65;
80
97
  --color-light-graphic-link: #0072ef;
81
98
  --color-light-graphic-negative: #f15045;
82
- --color-light-graphic-neutral: #dcdcdd;
83
99
  --color-light-graphic-positive: #2fc26e;
84
100
  --color-light-graphic-primary: #000;
85
101
  --color-light-graphic-primary-inverted: #fff;
102
+ --color-light-graphic-quaternary: #dcdcdd;
103
+ --color-light-graphic-quaternary-inverted: #2a2a2c;
86
104
  --color-light-graphic-secondary: #8a8a8e;
105
+ --color-light-graphic-secondary-inverted: #8d8d93;
87
106
  --color-light-graphic-tertiary: #c5c5c7;
107
+ --color-light-graphic-tertiary-inverted: #464649;
108
+ --color-light-specialbg-component: rgba(0, 0, 0, 0.08);
109
+ --color-light-specialbg-component-inverted: rgba(255, 255, 255, 0.1);
88
110
  --color-light-specialbg-nulled: rgba(255, 255, 255, 0);
89
111
  --color-light-specialbg-overlay-fallback: #5c5c5c;
90
112
  --color-light-specialbg-primary-grouped: #f3f4f5;
@@ -93,6 +115,8 @@
93
115
  --color-light-text-accent: #ef3124;
94
116
  --color-light-text-attention: #cb830f;
95
117
  --color-light-text-disabled: #dcdcdd;
118
+ --color-light-text-disabled-inverted: #2a2a2c;
119
+ --color-light-text-disabled-inverted-transparent: rgba(235, 235, 245, 0.18);
96
120
  --color-light-text-disabled-transparent: rgba(60, 60, 67, 0.18);
97
121
  --color-light-text-link: #0072ef;
98
122
  --color-light-text-negative: #d91d0b;
@@ -108,12 +132,14 @@
108
132
  --color-light-text-tertiary-inverted-transparent: rgba(235, 235, 245, 0.3);
109
133
  --color-light-text-tertiary-transparent: rgba(60, 60, 67, 0.3);
110
134
  --color-static-bg-accent: #ef3124;
111
- --color-static-bg-neutral-dark: #3a3a3c;
112
- --color-static-bg-neutral-light: #dcdcdd;
113
135
  --color-static-bg-primary-dark: #121212;
114
136
  --color-static-bg-primary-light: #fff;
137
+ --color-static-bg-quaternary-dark: #3a3a3c;
138
+ --color-static-bg-quaternary-light: #dcdcdd;
115
139
  --color-static-bg-secondary-dark: #202022;
116
140
  --color-static-bg-secondary-light: #f3f4f5;
141
+ --color-static-bg-tertiary-dark: #2c2c2e;
142
+ --color-static-bg-tertiary-light: #e9e9eb;
117
143
  --color-static-border-accent: #ef3124;
118
144
  --color-static-graphic-accent: #ef3124;
119
145
  --color-static-graphic-dark: #000;
@@ -130,18 +156,18 @@
130
156
  --color-static-text-tertiary-light: #464649;
131
157
  --color-static-text-tertiary-light-transparent: rgba(235, 235, 245, 0.3);
132
158
  --color-dark-bg-accent-alpha-30: rgba(239, 49, 36, 0.3);
159
+ --color-dark-bg-accent-shade-15: rgb(203, 42, 31);
160
+ --color-dark-bg-accent-shade-20: rgb(191, 39, 29);
133
161
  --color-dark-bg-accent-tint-7: rgb(240, 63, 51);
134
162
  --color-dark-bg-accent-tint-10: rgb(241, 70, 58);
135
163
  --color-dark-bg-accent-tint-15: rgb(241, 80, 69);
136
164
  --color-dark-bg-accent-tint-30: rgb(244, 111, 102);
137
- --color-dark-bg-neutral-alpha-30: rgba(58, 58, 60, 0.3);
138
- --color-dark-bg-neutral-tint-7: rgb(72, 72, 74);
139
- --color-dark-bg-neutral-tint-10: rgb(78, 78, 80);
140
- --color-dark-bg-neutral-tint-15: rgb(88, 88, 89);
141
- --color-dark-bg-neutral-tint-30: rgb(117, 117, 119);
142
- --color-dark-bg-neutral-shade-15: rgb(49, 49, 51);
143
165
  --color-dark-bg-primary-alpha-8: rgba(18, 18, 18, 0.08);
166
+ --color-dark-bg-primary-alpha-15: rgba(18, 18, 18, 0.15);
167
+ --color-dark-bg-primary-alpha-20: rgba(18, 18, 18, 0.2);
168
+ --color-dark-bg-primary-alpha-40: rgba(18, 18, 18, 0.4);
144
169
  --color-dark-bg-primary-inverted-alpha-3: rgba(255, 255, 255, 0.03);
170
+ --color-dark-bg-primary-inverted-alpha-5: rgba(255, 255, 255, 0.05);
145
171
  --color-dark-bg-primary-inverted-alpha-7: rgba(255, 255, 255, 0.07);
146
172
  --color-dark-bg-primary-inverted-alpha-10: rgba(255, 255, 255, 0.1);
147
173
  --color-dark-bg-primary-inverted-alpha-15: rgba(255, 255, 255, 0.15);
@@ -149,42 +175,84 @@
149
175
  --color-dark-bg-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
150
176
  --color-dark-bg-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
151
177
  --color-dark-bg-primary-inverted-alpha-50: rgba(255, 255, 255, 0.5);
152
- --color-dark-bg-primary-inverted-alpha-60: rgba(255, 255, 255, 0.6);
153
- --color-dark-bg-primary-inverted-alpha-80: rgba(255, 255, 255, 0.8);
154
- --color-dark-bg-primary-inverted-shade-7: rgb(237, 237, 237);
155
178
  --color-dark-bg-primary-inverted-shade-15: rgb(217, 217, 217);
156
179
  --color-dark-bg-primary-inverted-shade-20: rgb(204, 204, 204);
180
+ --color-dark-bg-quaternary-alpha-30: rgba(58, 58, 60, 0.3);
181
+ --color-dark-bg-quaternary-tint-7: rgb(72, 72, 74);
182
+ --color-dark-bg-quaternary-tint-10: rgb(78, 78, 80);
183
+ --color-dark-bg-quaternary-tint-15: rgb(88, 88, 89);
184
+ --color-dark-bg-quaternary-tint-30: rgb(117, 117, 119);
185
+ --color-dark-bg-quaternary-inverted-alpha-30: rgba(220, 220, 221, 0.3);
186
+ --color-dark-bg-quaternary-inverted-shade-15: rgb(187, 187, 188);
187
+ --color-dark-bg-quaternary-inverted-shade-20: rgb(176, 176, 177);
157
188
  --color-dark-bg-secondary-alpha-30: rgba(32, 32, 34, 0.3);
189
+ --color-dark-bg-secondary-shade-15: rgb(27, 27, 29);
190
+ --color-dark-bg-secondary-shade-20: rgb(26, 26, 27);
158
191
  --color-dark-bg-secondary-tint-7: rgb(48, 48, 49);
159
192
  --color-dark-bg-secondary-tint-15: rgb(65, 65, 67);
160
- --color-dark-bg-secondary-inverted-alpha-7: rgba(243, 244, 245, 0.07);
161
- --color-dark-bg-secondary-inverted-alpha-15: rgba(243, 244, 245, 0.15);
162
193
  --color-dark-bg-secondary-inverted-alpha-30: rgba(243, 244, 245, 0.3);
163
- --color-dark-bg-secondary-inverted-shade-7: rgb(226, 227, 228);
164
194
  --color-dark-bg-secondary-inverted-shade-15: rgb(207, 207, 208);
165
195
  --color-dark-bg-secondary-inverted-shade-20: rgb(194, 195, 196);
196
+ --color-dark-bg-secondary-inverted-tint-7: rgb(244, 245, 246);
197
+ --color-dark-bg-secondary-inverted-tint-15: rgb(245, 246, 246);
166
198
  --color-dark-bg-tertiary-tint-7: rgb(59, 59, 61);
167
- --color-dark-border-tertiary-inverted-alpha-30: rgba(243, 244, 245, 0.3);
199
+ --color-dark-border-underline-alpha-30: rgba(70, 70, 73, 0.3);
200
+ --color-dark-border-underline-inverted-alpha-30: rgba(197, 197, 199, 0.3);
168
201
  --color-dark-graphic-accent-alpha-30: rgba(239, 49, 36, 0.3);
169
202
  --color-dark-graphic-accent-shade-15: rgb(203, 42, 31);
170
203
  --color-dark-graphic-accent-tint-10: rgb(241, 70, 58);
171
204
  --color-dark-graphic-accent-tint-30: rgb(244, 111, 102);
205
+ --color-dark-graphic-negative-alpha-30: rgba(217, 29, 11, 0.3);
206
+ --color-dark-graphic-negative-shade-20: rgb(174, 23, 9);
172
207
  --color-dark-graphic-negative-shade-30: rgb(152, 20, 8);
173
- --color-dark-graphic-negative-shade-50: rgb(109, 15, 6);
174
- --color-dark-graphic-neutral-tint-10: rgb(63, 63, 65);
208
+ --color-dark-graphic-negative-tint-7: rgb(220, 45, 28);
209
+ --color-dark-graphic-negative-tint-15: rgb(223, 63, 48);
210
+ --color-dark-graphic-negative-tint-30: rgb(228, 97, 84);
175
211
  --color-dark-graphic-positive-tint-10: rgb(68, 200, 125);
176
212
  --color-dark-graphic-positive-tint-30: rgb(109, 212, 154);
177
213
  --color-dark-graphic-primary-alpha-30: rgba(255, 255, 255, 0.3);
178
214
  --color-dark-graphic-primary-alpha-40: rgba(255, 255, 255, 0.4);
179
215
  --color-dark-graphic-primary-alpha-50: rgba(255, 255, 255, 0.5);
180
216
  --color-dark-graphic-primary-shade-15: rgb(217, 217, 217);
217
+ --color-dark-graphic-primary-shade-20: rgb(204, 204, 204);
181
218
  --color-dark-graphic-primary-shade-30: rgb(179, 179, 179);
182
- --color-dark-graphic-primary-shade-50: rgb(128, 128, 128);
183
219
  --color-dark-graphic-primary-tint-10: rgb(255, 255, 255);
184
220
  --color-dark-graphic-primary-tint-30: rgb(255, 255, 255);
221
+ --color-dark-graphic-primary-inverted-alpha-30: rgba(0, 0, 0, 0.3);
222
+ --color-dark-graphic-primary-inverted-alpha-40: rgba(0, 0, 0, 0.4);
223
+ --color-dark-graphic-primary-inverted-alpha-50: rgba(0, 0, 0, 0.5);
224
+ --color-dark-graphic-primary-inverted-tint-7: rgb(18, 18, 18);
225
+ --color-dark-graphic-primary-inverted-tint-10: rgb(26, 26, 26);
226
+ --color-dark-graphic-primary-inverted-tint-15: rgb(38, 38, 38);
227
+ --color-dark-graphic-primary-inverted-tint-30: rgb(77, 77, 77);
228
+ --color-dark-graphic-quaternary-tint-10: rgb(63, 63, 65);
185
229
  --color-dark-graphic-secondary-alpha-30: rgba(141, 141, 147, 0.3);
186
230
  --color-dark-graphic-secondary-tint-30: rgb(175, 175, 179);
187
231
  --color-dark-graphic-secondary-tint-50: rgb(198, 198, 201);
232
+ --color-dark-graphic-secondary-inverted-alpha-30: rgba(138, 138, 142, 0.3);
233
+ --color-dark-graphic-secondary-inverted-shade-15: rgb(117, 117, 121);
234
+ --color-dark-graphic-secondary-inverted-shade-20: rgb(110, 110, 114);
235
+ --color-dark-graphic-secondary-inverted-tint-10: rgb(150, 150, 153);
236
+ --color-dark-graphic-secondary-inverted-tint-30: rgb(173, 173, 176);
237
+ --color-dark-graphic-tertiary-alpha-30: rgba(70, 70, 73, 0.3);
238
+ --color-dark-graphic-tertiary-shade-15: rgb(60, 60, 62);
239
+ --color-dark-graphic-tertiary-shade-20: rgb(56, 56, 58);
240
+ --color-dark-graphic-tertiary-tint-7: rgb(83, 83, 86);
241
+ --color-dark-graphic-tertiary-tint-15: rgb(98, 98, 100);
242
+ --color-dark-graphic-tertiary-inverted-alpha-30: rgba(197, 197, 199, 0.3);
243
+ --color-dark-graphic-tertiary-inverted-shade-15: rgb(167, 167, 169);
244
+ --color-dark-graphic-tertiary-inverted-shade-20: rgb(158, 158, 159);
245
+ --color-dark-specialbg-component-tint-7: rgba(255, 255, 255, 0.163);
246
+ --color-dark-specialbg-component-tint-10: rgba(255, 255, 255, 0.19);
247
+ --color-dark-specialbg-component-tint-15: rgba(255, 255, 255, 0.235);
248
+ --color-dark-specialbg-component-tint-30: rgba(255, 255, 255, 0.37);
249
+ --color-dark-specialbg-component-alpha-2: rgba(255, 255, 255, 0.02);
250
+ --color-dark-specialbg-component-alpha-14: rgba(255, 255, 255, 0.14);
251
+ --color-dark-specialbg-component-alpha-23: rgba(255, 255, 255, 0.23);
252
+ --color-dark-specialbg-component-alpha-30: rgba(255, 255, 255, 0.3);
253
+ --color-dark-specialbg-component-inverted-alpha-30: rgba(0, 0, 0, 0.3);
254
+ --color-dark-specialbg-component-inverted-shade-15: rgba(0, 0, 0, 0.218);
255
+ --color-dark-specialbg-component-inverted-shade-20: rgba(0, 0, 0, 0.264);
188
256
  --color-dark-text-link-shade-30: rgb(0, 80, 167);
189
257
  --color-dark-text-link-shade-50: rgb(0, 57, 120);
190
258
  --color-dark-text-link-tint-20: rgb(51, 142, 242);
@@ -194,28 +262,33 @@
194
262
  --color-dark-text-primary-shade-50: rgb(128, 128, 128);
195
263
  --color-dark-text-primary-tint-20: rgb(255, 255, 255);
196
264
  --color-dark-text-primary-tint-40: rgb(255, 255, 255);
265
+ --color-dark-text-primary-inverted-alpha-30: rgba(0, 0, 0, 0.3);
197
266
  --color-dark-text-primary-inverted-alpha-40: rgba(0, 0, 0, 0.4);
267
+ --color-dark-text-primary-inverted-shade-20: rgb(0, 0, 0);
198
268
  --color-dark-text-primary-inverted-shade-30: rgb(0, 0, 0);
199
- --color-dark-text-primary-inverted-shade-50: rgb(0, 0, 0);
269
+ --color-dark-text-primary-inverted-tint-7: rgb(18, 18, 18);
270
+ --color-dark-text-primary-inverted-tint-15: rgb(38, 38, 38);
271
+ --color-dark-text-primary-inverted-tint-30: rgb(77, 77, 77);
272
+ --color-dark-text-primary-inverted-tint-50: rgb(128, 128, 128);
273
+ --color-dark-text-secondary-shade-20: rgb(113, 113, 118);
200
274
  --color-dark-text-secondary-shade-30: rgb(99, 99, 103);
201
- --color-dark-text-secondary-shade-50: rgb(71, 71, 74);
202
275
  --color-dark-text-secondary-tint-20: rgb(164, 164, 169);
203
276
  --color-dark-text-secondary-tint-40: rgb(187, 187, 190);
277
+ --color-dark-text-secondary-inverted-shade-20: rgb(110, 110, 114);
204
278
  --color-dark-text-secondary-inverted-shade-30: rgb(97, 97, 99);
205
- --color-dark-text-secondary-inverted-shade-50: rgb(69, 69, 71);
206
279
  --color-light-bg-accent-alpha-30: rgba(239, 49, 36, 0.3);
280
+ --color-light-bg-accent-tint-15: rgb(241, 80, 69);
281
+ --color-light-bg-accent-tint-20: rgb(242, 90, 80);
207
282
  --color-light-bg-accent-shade-7: rgb(222, 46, 33);
208
283
  --color-light-bg-accent-shade-10: rgb(215, 44, 32);
209
284
  --color-light-bg-accent-shade-15: rgb(203, 42, 31);
210
285
  --color-light-bg-accent-shade-30: rgb(167, 34, 25);
211
- --color-light-bg-neutral-alpha-30: rgba(220, 220, 221, 0.3);
212
- --color-light-bg-neutral-shade-7: rgb(205, 205, 206);
213
- --color-light-bg-neutral-shade-10: rgb(198, 198, 199);
214
- --color-light-bg-neutral-shade-15: rgb(187, 187, 188);
215
- --color-light-bg-neutral-shade-30: rgb(154, 154, 155);
216
- --color-light-bg-neutral-tint-15: rgb(225, 225, 226);
217
286
  --color-light-bg-primary-alpha-8: rgba(255, 255, 255, 0.08);
287
+ --color-light-bg-primary-alpha-15: rgba(255, 255, 255, 0.15);
288
+ --color-light-bg-primary-alpha-20: rgba(255, 255, 255, 0.2);
289
+ --color-light-bg-primary-alpha-40: rgba(255, 255, 255, 0.4);
218
290
  --color-light-bg-primary-inverted-alpha-3: rgba(18, 18, 18, 0.03);
291
+ --color-light-bg-primary-inverted-alpha-5: rgba(18, 18, 18, 0.05);
219
292
  --color-light-bg-primary-inverted-alpha-7: rgba(18, 18, 18, 0.07);
220
293
  --color-light-bg-primary-inverted-alpha-10: rgba(18, 18, 18, 0.1);
221
294
  --color-light-bg-primary-inverted-alpha-15: rgba(18, 18, 18, 0.15);
@@ -223,42 +296,84 @@
223
296
  --color-light-bg-primary-inverted-alpha-30: rgba(18, 18, 18, 0.3);
224
297
  --color-light-bg-primary-inverted-alpha-40: rgba(18, 18, 18, 0.4);
225
298
  --color-light-bg-primary-inverted-alpha-50: rgba(18, 18, 18, 0.5);
226
- --color-light-bg-primary-inverted-alpha-60: rgba(18, 18, 18, 0.6);
227
- --color-light-bg-primary-inverted-alpha-80: rgba(18, 18, 18, 0.8);
228
- --color-light-bg-primary-inverted-tint-7: rgb(35, 35, 35);
229
299
  --color-light-bg-primary-inverted-tint-15: rgb(54, 54, 54);
230
300
  --color-light-bg-primary-inverted-tint-20: rgb(65, 65, 65);
301
+ --color-light-bg-quaternary-alpha-30: rgba(220, 220, 221, 0.3);
302
+ --color-light-bg-quaternary-shade-7: rgb(205, 205, 206);
303
+ --color-light-bg-quaternary-shade-10: rgb(198, 198, 199);
304
+ --color-light-bg-quaternary-shade-15: rgb(187, 187, 188);
305
+ --color-light-bg-quaternary-shade-30: rgb(154, 154, 155);
306
+ --color-light-bg-quaternary-inverted-alpha-30: rgba(58, 58, 60, 0.3);
307
+ --color-light-bg-quaternary-inverted-tint-15: rgb(88, 88, 89);
308
+ --color-light-bg-quaternary-inverted-tint-20: rgb(97, 97, 99);
231
309
  --color-light-bg-secondary-alpha-30: rgba(243, 244, 245, 0.3);
310
+ --color-light-bg-secondary-tint-15: rgb(245, 246, 246);
311
+ --color-light-bg-secondary-tint-20: rgb(245, 246, 247);
232
312
  --color-light-bg-secondary-shade-7: rgb(226, 227, 228);
233
313
  --color-light-bg-secondary-shade-15: rgb(207, 207, 208);
234
- --color-light-bg-secondary-inverted-alpha-7: rgba(32, 32, 34, 0.07);
235
- --color-light-bg-secondary-inverted-alpha-15: rgba(32, 32, 34, 0.15);
236
314
  --color-light-bg-secondary-inverted-alpha-30: rgba(32, 32, 34, 0.3);
237
- --color-light-bg-secondary-inverted-tint-7: rgb(48, 48, 49);
238
315
  --color-light-bg-secondary-inverted-tint-15: rgb(65, 65, 67);
239
316
  --color-light-bg-secondary-inverted-tint-20: rgb(77, 77, 78);
317
+ --color-light-bg-secondary-inverted-shade-7: rgb(30, 30, 32);
318
+ --color-light-bg-secondary-inverted-shade-15: rgb(27, 27, 29);
240
319
  --color-light-bg-tertiary-shade-7: rgb(217, 217, 219);
241
- --color-light-border-tertiary-inverted-alpha-30: rgba(28, 28, 30, 0.3);
320
+ --color-light-border-underline-alpha-30: rgba(197, 197, 199, 0.3);
321
+ --color-light-border-underline-inverted-alpha-30: rgba(70, 70, 73, 0.3);
242
322
  --color-light-graphic-accent-alpha-30: rgba(239, 49, 36, 0.3);
243
323
  --color-light-graphic-accent-tint-15: rgb(241, 80, 69);
244
324
  --color-light-graphic-accent-shade-10: rgb(215, 44, 32);
245
325
  --color-light-graphic-accent-shade-30: rgb(167, 34, 25);
326
+ --color-light-graphic-negative-alpha-30: rgba(241, 80, 69, 0.3);
327
+ --color-light-graphic-negative-tint-20: rgb(244, 115, 106);
246
328
  --color-light-graphic-negative-tint-30: rgb(245, 133, 125);
247
- --color-light-graphic-negative-tint-50: rgb(248, 168, 162);
248
- --color-light-graphic-neutral-shade-10: rgb(198, 198, 199);
329
+ --color-light-graphic-negative-shade-7: rgb(224, 74, 64);
330
+ --color-light-graphic-negative-shade-15: rgb(205, 68, 59);
331
+ --color-light-graphic-negative-shade-30: rgb(169, 56, 48);
249
332
  --color-light-graphic-positive-shade-10: rgb(42, 175, 99);
250
333
  --color-light-graphic-positive-shade-30: rgb(33, 136, 77);
251
334
  --color-light-graphic-primary-alpha-30: rgba(0, 0, 0, 0.3);
252
335
  --color-light-graphic-primary-alpha-40: rgba(0, 0, 0, 0.4);
253
336
  --color-light-graphic-primary-alpha-50: rgba(0, 0, 0, 0.5);
254
337
  --color-light-graphic-primary-tint-15: rgb(38, 38, 38);
338
+ --color-light-graphic-primary-tint-20: rgb(51, 51, 51);
255
339
  --color-light-graphic-primary-tint-30: rgb(77, 77, 77);
256
- --color-light-graphic-primary-tint-50: rgb(128, 128, 128);
257
340
  --color-light-graphic-primary-shade-10: rgb(0, 0, 0);
258
341
  --color-light-graphic-primary-shade-30: rgb(0, 0, 0);
342
+ --color-light-graphic-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
343
+ --color-light-graphic-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
344
+ --color-light-graphic-primary-inverted-alpha-50: rgba(255, 255, 255, 0.5);
345
+ --color-light-graphic-primary-inverted-shade-7: rgb(237, 237, 237);
346
+ --color-light-graphic-primary-inverted-shade-10: rgb(230, 230, 230);
347
+ --color-light-graphic-primary-inverted-shade-15: rgb(217, 217, 217);
348
+ --color-light-graphic-primary-inverted-shade-30: rgb(179, 179, 179);
349
+ --color-light-graphic-quaternary-shade-10: rgb(198, 198, 199);
259
350
  --color-light-graphic-secondary-alpha-30: rgba(138, 138, 142, 0.3);
260
351
  --color-light-graphic-secondary-shade-30: rgb(97, 97, 99);
261
352
  --color-light-graphic-secondary-shade-50: rgb(69, 69, 71);
353
+ --color-light-graphic-secondary-inverted-alpha-30: rgba(141, 141, 147, 0.3);
354
+ --color-light-graphic-secondary-inverted-tint-15: rgb(158, 158, 163);
355
+ --color-light-graphic-secondary-inverted-tint-20: rgb(164, 164, 169);
356
+ --color-light-graphic-secondary-inverted-shade-10: rgb(127, 127, 132);
357
+ --color-light-graphic-secondary-inverted-shade-30: rgb(99, 99, 103);
358
+ --color-light-graphic-tertiary-alpha-30: rgba(197, 197, 199, 0.3);
359
+ --color-light-graphic-tertiary-tint-15: rgb(206, 206, 207);
360
+ --color-light-graphic-tertiary-tint-20: rgb(209, 209, 210);
361
+ --color-light-graphic-tertiary-shade-7: rgb(183, 183, 185);
362
+ --color-light-graphic-tertiary-shade-15: rgb(167, 167, 169);
363
+ --color-light-graphic-tertiary-inverted-alpha-30: rgba(70, 70, 73, 0.3);
364
+ --color-light-graphic-tertiary-inverted-tint-15: rgb(98, 98, 100);
365
+ --color-light-graphic-tertiary-inverted-tint-20: rgb(107, 107, 109);
366
+ --color-light-specialbg-component-shade-7: rgba(0, 0, 0, 0.1444);
367
+ --color-light-specialbg-component-shade-10: rgba(0, 0, 0, 0.172);
368
+ --color-light-specialbg-component-shade-15: rgba(0, 0, 0, 0.218);
369
+ --color-light-specialbg-component-shade-30: rgba(0, 0, 0, 0.356);
370
+ --color-light-specialbg-component-alpha-2: rgba(0, 0, 0, 0.02);
371
+ --color-light-specialbg-component-alpha-14: rgba(0, 0, 0, 0.14);
372
+ --color-light-specialbg-component-alpha-23: rgba(0, 0, 0, 0.23);
373
+ --color-light-specialbg-component-alpha-30: rgba(0, 0, 0, 0.3);
374
+ --color-light-specialbg-component-inverted-alpha-30: rgba(255, 255, 255, 0.3);
375
+ --color-light-specialbg-component-inverted-tint-15: rgba(255, 255, 255, 0.235);
376
+ --color-light-specialbg-component-inverted-tint-20: rgba(255, 255, 255, 0.28);
262
377
  --color-light-text-link-tint-30: rgb(77, 156, 244);
263
378
  --color-light-text-link-tint-50: rgb(128, 185, 247);
264
379
  --color-light-text-link-shade-20: rgb(0, 91, 191);
@@ -268,15 +383,21 @@
268
383
  --color-light-text-primary-tint-50: rgb(128, 128, 128);
269
384
  --color-light-text-primary-shade-20: rgb(0, 0, 0);
270
385
  --color-light-text-primary-shade-40: rgb(0, 0, 0);
386
+ --color-light-text-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
271
387
  --color-light-text-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
388
+ --color-light-text-primary-inverted-tint-20: rgb(255, 255, 255);
272
389
  --color-light-text-primary-inverted-tint-30: rgb(255, 255, 255);
273
- --color-light-text-primary-inverted-tint-50: rgb(255, 255, 255);
390
+ --color-light-text-primary-inverted-shade-7: rgb(237, 237, 237);
391
+ --color-light-text-primary-inverted-shade-15: rgb(217, 217, 217);
392
+ --color-light-text-primary-inverted-shade-30: rgb(179, 179, 179);
393
+ --color-light-text-primary-inverted-shade-50: rgb(128, 128, 128);
394
+ --color-light-text-secondary-tint-20: rgb(161, 161, 165);
274
395
  --color-light-text-secondary-tint-30: rgb(173, 173, 176);
275
- --color-light-text-secondary-tint-50: rgb(197, 197, 199);
276
396
  --color-light-text-secondary-shade-20: rgb(110, 110, 114);
277
397
  --color-light-text-secondary-shade-40: rgb(83, 83, 85);
398
+ --color-light-text-secondary-inverted-tint-20: rgb(164, 164, 169);
278
399
  --color-light-text-secondary-inverted-tint-30: rgb(175, 175, 179);
279
- --color-light-text-secondary-inverted-tint-50: rgb(198, 198, 201);
280
400
  --color-static-bg-primary-dark-alpha-10: rgba(18, 18, 18, 0.1);
281
401
  --color-static-bg-primary-dark-alpha-20: rgba(18, 18, 18, 0.2);
402
+ --color-static-text-primary-light-alpha-30: rgba(255, 255, 255, 0.3);
282
403
  }