@vkontakte/vkui-tokens 4.3.1 → 4.3.2-dev-db778e.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 (50) hide show
  1. package/interfaces/themes/calendar/index.d.ts +4 -7
  2. package/package.json +1 -1
  3. package/themes/calendar/cssVars/declarations/index.css +835 -454
  4. package/themes/calendar/cssVars/declarations/noColors.css +409 -241
  5. package/themes/calendar/cssVars/declarations/noSizes.css +10 -7
  6. package/themes/calendar/cssVars/declarations/onlyAdaptiveGroups.css +26 -51
  7. package/themes/calendar/cssVars/declarations/onlyColors.css +6 -3
  8. package/themes/calendar/cssVars/declarations/onlyColors.js +2 -2
  9. package/themes/calendar/cssVars/declarations/onlyMedia.css +387 -152
  10. package/themes/calendar/cssVars/declarations/onlyVariables.css +137 -88
  11. package/themes/calendar/cssVars/declarations/onlyVariables.js +2 -2
  12. package/themes/calendar/cssVars/declarations/onlyVariablesLocal.css +137 -88
  13. package/themes/calendar/cssVars/theme/fallbacks/index.css +434 -263
  14. package/themes/calendar/cssVars/theme/fallbacks/index.less +183 -108
  15. package/themes/calendar/cssVars/theme/fallbacks/index.pcss +183 -108
  16. package/themes/calendar/cssVars/theme/fallbacks/index.scss +478 -234
  17. package/themes/calendar/cssVars/theme/fallbacks/index.styl +183 -108
  18. package/themes/calendar/cssVars/theme/index.js +529 -393
  19. package/themes/calendar/cssVars/theme/index.json +529 -393
  20. package/themes/calendar/index.css +415 -244
  21. package/themes/calendar/index.js +180 -115
  22. package/themes/calendar/index.json +180 -115
  23. package/themes/calendar/index.less +156 -81
  24. package/themes/calendar/index.pcss +156 -81
  25. package/themes/calendar/index.scss +412 -168
  26. package/themes/calendar/index.styl +156 -81
  27. package/themes/calendarDark/cssVars/declarations/index.css +835 -454
  28. package/themes/calendarDark/cssVars/declarations/noColors.css +409 -241
  29. package/themes/calendarDark/cssVars/declarations/noSizes.css +10 -7
  30. package/themes/calendarDark/cssVars/declarations/onlyAdaptiveGroups.css +26 -51
  31. package/themes/calendarDark/cssVars/declarations/onlyColors.css +6 -3
  32. package/themes/calendarDark/cssVars/declarations/onlyColors.js +2 -2
  33. package/themes/calendarDark/cssVars/declarations/onlyMedia.css +387 -152
  34. package/themes/calendarDark/cssVars/declarations/onlyVariables.css +137 -88
  35. package/themes/calendarDark/cssVars/declarations/onlyVariables.js +2 -2
  36. package/themes/calendarDark/cssVars/declarations/onlyVariablesLocal.css +137 -88
  37. package/themes/calendarDark/cssVars/theme/fallbacks/index.css +434 -263
  38. package/themes/calendarDark/cssVars/theme/fallbacks/index.less +183 -108
  39. package/themes/calendarDark/cssVars/theme/fallbacks/index.pcss +183 -108
  40. package/themes/calendarDark/cssVars/theme/fallbacks/index.scss +478 -234
  41. package/themes/calendarDark/cssVars/theme/fallbacks/index.styl +183 -108
  42. package/themes/calendarDark/cssVars/theme/index.js +529 -393
  43. package/themes/calendarDark/cssVars/theme/index.json +529 -393
  44. package/themes/calendarDark/index.css +415 -244
  45. package/themes/calendarDark/index.js +180 -115
  46. package/themes/calendarDark/index.json +180 -115
  47. package/themes/calendarDark/index.less +156 -81
  48. package/themes/calendarDark/index.pcss +156 -81
  49. package/themes/calendarDark/index.scss +412 -168
  50. package/themes/calendarDark/index.styl +156 -81
package/themes/calendarDark/index.json CHANGED
@@ -10,30 +10,54 @@
10
10
  "fontWeightBase3": 400,
11
11
  "fontTitle1": {
12
12
  "regular": {
13
- "fontSize": 17,
14
- "lineHeight": "24px",
13
+ "fontSize": 24,
14
+ "lineHeight": "32px",
15
+ "fontWeight": 500,
16
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
17
+ },
18
+ "compact": {
19
+ "fontSize": 24,
20
+ "lineHeight": "28px",
15
21
  "fontWeight": 500,
16
22
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
17
23
  }
18
24
  },
19
25
  "fontTitle2": {
20
26
  "regular": {
21
- "fontSize": 15,
22
- "lineHeight": "20px",
27
+ "fontSize": 20,
28
+ "lineHeight": "24px",
29
+ "fontWeight": 500,
30
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
31
+ },
32
+ "compact": {
33
+ "fontSize": 20,
34
+ "lineHeight": "24px",
23
35
  "fontWeight": 500,
24
36
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
25
37
  }
26
38
  },
27
39
  "fontTitle3": {
28
40
  "regular": {
29
- "fontSize": 15,
30
- "lineHeight": "20px",
41
+ "fontSize": 17,
42
+ "lineHeight": "24px",
43
+ "fontWeight": 500,
44
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
45
+ },
46
+ "compact": {
47
+ "fontSize": 17,
48
+ "lineHeight": "24px",
31
49
  "fontWeight": 500,
32
50
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
33
51
  }
34
52
  },
35
53
  "fontHeadline1": {
36
54
  "regular": {
55
+ "fontSize": 16,
56
+ "lineHeight": "20px",
57
+ "fontWeight": 500,
58
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
59
+ },
60
+ "compact": {
37
61
  "fontSize": 15,
38
62
  "lineHeight": "20px",
39
63
  "fontWeight": 500,
@@ -53,13 +77,13 @@
53
77
  }
54
78
  },
55
79
  "fontText": {
56
- "compact": {
57
- "fontSize": 17,
58
- "lineHeight": "24px",
80
+ "regular": {
81
+ "fontSize": 16,
82
+ "lineHeight": "20px",
59
83
  "fontWeight": 400,
60
84
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
61
85
  },
62
- "regular": {
86
+ "compact": {
63
87
  "fontSize": 15,
64
88
  "lineHeight": "20px",
65
89
  "fontWeight": 400,
@@ -69,27 +93,41 @@
69
93
  "fontParagraph": {
70
94
  "regular": {
71
95
  "fontSize": 15,
72
- "lineHeight": 20,
73
- "fontFamily": "Helvetica, Arial, sans-serif",
74
- "fontWeight": 400
96
+ "lineHeight": "20px",
97
+ "fontWeight": 400,
98
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
99
+ },
100
+ "compact": {
101
+ "fontSize": 15,
102
+ "lineHeight": "20px",
103
+ "fontWeight": 400,
104
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
75
105
  }
76
106
  },
77
107
  "fontSubhead": {
78
108
  "regular": {
79
109
  "fontSize": 14,
80
- "lineHeight": 18,
81
- "fontFamily": "Helvetica, Arial, sans-serif",
82
- "fontWeight": 400
110
+ "lineHeight": "18px",
111
+ "fontWeight": 400,
112
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
83
113
  },
84
114
  "compact": {
85
115
  "fontSize": 13,
86
- "lineHeight": 18
116
+ "lineHeight": "18px",
117
+ "fontWeight": 500,
118
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
87
119
  }
88
120
  },
89
121
  "fontFootnote": {
90
122
  "regular": {
91
123
  "fontSize": 13,
92
- "lineHeight": "20px",
124
+ "lineHeight": "18px",
125
+ "fontWeight": 400,
126
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
127
+ },
128
+ "compact": {
129
+ "fontSize": 13,
130
+ "lineHeight": "18px",
93
131
  "fontWeight": 400,
94
132
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
95
133
  }
@@ -97,35 +135,63 @@
97
135
  "fontFootnoteCaps": {
98
136
  "regular": {
99
137
  "fontSize": 13,
100
- "lineHeight": 18,
101
- "fontFamily": "Helvetica, Arial, sans-serif",
138
+ "lineHeight": "18px",
102
139
  "fontWeight": 400,
103
- "textTransform": "uppercase",
104
- "letterSpacing": "0.3px"
140
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
141
+ "letterSpacing": "0.3px",
142
+ "textTransform": "uppercase"
143
+ },
144
+ "compact": {
145
+ "fontSize": 13,
146
+ "lineHeight": "18px",
147
+ "fontWeight": 400,
148
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
149
+ "letterSpacing": "0.3px",
150
+ "textTransform": "uppercase"
105
151
  }
106
152
  },
107
153
  "fontCaption1": {
108
154
  "regular": {
109
155
  "fontSize": 12,
110
- "lineHeight": 16,
111
- "fontFamily": "Helvetica, Arial, sans-serif",
112
- "fontWeight": 400
156
+ "lineHeight": "16px",
157
+ "fontWeight": 400,
158
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
159
+ },
160
+ "compact": {
161
+ "fontSize": 12,
162
+ "lineHeight": "14px",
163
+ "fontWeight": 400,
164
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
113
165
  }
114
166
  },
115
167
  "fontCaption1Caps": {
116
168
  "regular": {
117
169
  "fontSize": 12,
118
- "lineHeight": 16,
119
- "fontFamily": "Helvetica, Arial, sans-serif",
170
+ "lineHeight": "16px",
120
171
  "fontWeight": 400,
121
- "textTransform": "uppercase",
122
- "letterSpacing": "0.26px"
172
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
173
+ "letterSpacing": "0.26px",
174
+ "textTransform": "uppercase"
175
+ },
176
+ "compact": {
177
+ "fontSize": 12,
178
+ "lineHeight": "14px",
179
+ "fontWeight": 500,
180
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
181
+ "letterSpacing": "0.26px",
182
+ "textTransform": "uppercase"
123
183
  }
124
184
  },
125
185
  "fontCaption2": {
126
186
  "regular": {
127
187
  "fontSize": 11,
128
- "lineHeight": "12px",
188
+ "lineHeight": "14px",
189
+ "fontWeight": 400,
190
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
191
+ },
192
+ "compact": {
193
+ "fontSize": 11,
194
+ "lineHeight": "14px",
129
195
  "fontWeight": 400,
130
196
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
131
197
  }
@@ -133,29 +199,51 @@
133
199
  "fontCaption2Caps": {
134
200
  "regular": {
135
201
  "fontSize": 11,
136
- "lineHeight": 14,
137
- "fontFamily": "Helvetica, Arial, sans-serif",
202
+ "lineHeight": "14px",
203
+ "fontWeight": 400,
204
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
205
+ "letterSpacing": "0.22px",
206
+ "textTransform": "uppercase"
207
+ },
208
+ "compact": {
209
+ "fontSize": 11,
210
+ "lineHeight": "14px",
138
211
  "fontWeight": 400,
139
- "textTransform": "uppercase",
140
- "letterSpacing": "0.22px"
212
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
213
+ "letterSpacing": "0.22px",
214
+ "textTransform": "uppercase"
141
215
  }
142
216
  },
143
217
  "fontCaption3": {
144
218
  "regular": {
145
219
  "fontSize": 9,
146
- "lineHeight": 12,
147
- "fontFamily": "Helvetica, Arial, sans-serif",
148
- "fontWeight": 400
220
+ "lineHeight": "12px",
221
+ "fontWeight": 400,
222
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
223
+ },
224
+ "compact": {
225
+ "fontSize": 9,
226
+ "lineHeight": "12px",
227
+ "fontWeight": 400,
228
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
149
229
  }
150
230
  },
151
231
  "fontCaption3Caps": {
152
232
  "regular": {
153
233
  "fontSize": 9,
154
- "lineHeight": 12,
155
- "fontFamily": "Helvetica, Arial, sans-serif",
234
+ "lineHeight": "12px",
235
+ "fontWeight": 400,
236
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
237
+ "letterSpacing": "0.16px",
238
+ "textTransform": "uppercase"
239
+ },
240
+ "compact": {
241
+ "fontSize": 9,
242
+ "lineHeight": "12px",
156
243
  "fontWeight": 400,
157
- "textTransform": "uppercase",
158
- "letterSpacing": "0.16px"
244
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
245
+ "letterSpacing": "0.16px",
246
+ "textTransform": "uppercase"
159
247
  }
160
248
  },
161
249
  "sizeSelectIconPadding": {
@@ -171,7 +259,7 @@
171
259
  "compact": 24
172
260
  },
173
261
  "sizeBorderRadius": {
174
- "compact": 12,
262
+ "compact": 8,
175
263
  "regular": 8
176
264
  },
177
265
  "sizeCheckBorderRadius": {
@@ -221,8 +309,8 @@
221
309
  "regular": 8
222
310
  },
223
311
  "sizeButtonPaddingHorizontal": {
224
- "compact": 12,
225
- "regular": 16
312
+ "compact": 16,
313
+ "regular": 20
226
314
  },
227
315
  "sizeLabelHorizontalMargin": {
228
316
  "regular": 16
@@ -279,10 +367,10 @@
279
367
  "sizeBasePaddingHorizontal": {
280
368
  "regular": 16
281
369
  },
282
- "elevation1": "none",
283
- "elevation2": "none",
284
- "elevation3": "0px 4px 32px rgba(0, 16, 61, 0.32)",
285
- "elevation4": "0px 16px 48px rgba(0, 16, 61, 0.48)",
370
+ "elevation1": "0 2px 0 0 rgba(0, 16, 61, 0.04)",
371
+ "elevation2": "0 4px 32px 0 rgba(0, 16, 61, 0.32)",
372
+ "elevation3": "0 16px 48px 0 rgba(0, 0, 0, 0.48)",
373
+ "elevation4": "0 16px 48px 0 rgba(0, 0, 0, 0.48)",
286
374
  "animationDurationL": "0.4s",
287
375
  "animationDurationM": "0.2s",
288
376
  "animationDurationS": "0.1s",
@@ -317,40 +405,38 @@
317
405
  },
318
406
  "fontH0": {
319
407
  "regular": {
320
- "fontSize": 32,
321
- "lineHeight": "40px",
322
- "fontWeight": 500,
323
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
408
+ "fontSize": 28,
409
+ "lineHeight": 32,
410
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
411
+ "fontWeight": 500
412
+ },
413
+ "compact": {
414
+ "fontSize": 44,
415
+ "lineHeight": 52
324
416
  }
325
417
  },
326
418
  "fontH1": {
327
- "compact": {
419
+ "regular": {
328
420
  "fontSize": 24,
329
- "lineHeight": "32px",
330
- "fontWeight": 500,
421
+ "lineHeight": 28,
331
422
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
332
- "marginBottom": 16
423
+ "fontWeight": 500
333
424
  },
334
- "regular": {
425
+ "compact": {
335
426
  "fontSize": 32,
336
- "lineHeight": "40px",
337
- "fontWeight": 500,
338
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
339
- "marginBottom": 16
427
+ "lineHeight": 36
340
428
  }
341
429
  },
342
430
  "fontH2": {
343
- "compact": {
431
+ "regular": {
344
432
  "fontSize": 20,
345
- "lineHeight": "24px",
346
- "fontWeight": 500,
347
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
433
+ "lineHeight": 26,
434
+ "fontFamily": "MailSans, Helvetica, Arial, sans-serif",
435
+ "fontWeight": 500
348
436
  },
349
- "regular": {
350
- "fontSize": 24,
351
- "lineHeight": "28px",
352
- "fontWeight": 500,
353
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
437
+ "compact": {
438
+ "fontSize": 28,
439
+ "lineHeight": 32
354
440
  }
355
441
  },
356
442
  "sizeArrowHeight": {
@@ -524,68 +610,42 @@
524
610
  "typeBorderButton": "solid",
525
611
  "typeBorderPosition": "inset",
526
612
  "themeNameBase": "calendar",
527
- "fontEventM": {
528
- "compact": {
613
+ "calendarFontTextEvent": {
614
+ "regular": {
529
615
  "fontSize": 17,
530
616
  "lineHeight": "24px",
531
- "fontWeight": 500,
617
+ "fontWeight": 400,
532
618
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
533
619
  },
534
- "regular": {
535
- "fontSize": 15,
536
- "lineHeight": "20px",
537
- "fontWeight": 500,
538
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
539
- }
540
- },
541
- "fontEventS": {
542
620
  "compact": {
543
- "fontSize": 15,
544
- "lineHeight": "18px",
545
- "fontWeight": 500,
546
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
547
- },
548
- "regular": {
549
621
  "fontSize": 13,
550
622
  "lineHeight": "18px",
551
623
  "fontWeight": 500,
552
624
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
553
625
  }
554
626
  },
555
- "fontEventXS": {
627
+ "calendarFontTextEventSmall": {
556
628
  "regular": {
557
- "fontSize": 12,
558
- "lineHeight": 16,
559
- "fontWeight": 500,
560
- "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
561
- }
562
- },
563
- "fontTime": {
564
- "regular": {
565
- "fontSize": 13,
566
- "lineHeight": "18px",
567
- "fontWeight": 500,
629
+ "fontSize": 15,
630
+ "lineHeight": "20px",
631
+ "fontWeight": 400,
568
632
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
569
- }
570
- },
571
- "fontBodyIOS": {
572
- "regular": {
573
- "fontSize": 17,
574
- "lineHeight": "24px",
575
- "fontWeight": 500,
633
+ },
634
+ "compact": {
635
+ "fontSize": 12,
636
+ "lineHeight": "12px",
637
+ "fontWeight": 400,
576
638
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
577
639
  }
578
640
  },
579
- "fontBodyAndroid": {
641
+ "fontHeadline": {
580
642
  "regular": {
581
643
  "fontSize": 16,
582
- "lineHeight": "24px",
644
+ "lineHeight": "20px",
583
645
  "fontWeight": 500,
584
646
  "fontFamily": "MailSans, Helvetica, Arial, sans-serif"
585
- }
586
- },
587
- "fontHeadline": {
588
- "regular": {
647
+ },
648
+ "compact": {
589
649
  "fontSize": 15,
590
650
  "lineHeight": "20px",
591
651
  "fontWeight": 500,
@@ -839,9 +899,9 @@
839
899
  "active": "rgba(255, 255, 255, 0.16)"
840
900
  },
841
901
  "colorFieldBorderAlpha": {
842
- "normal": "transparent",
843
- "hover": "transparent",
844
- "active": "transparent"
902
+ "normal": "rgba(255, 255, 255, 0.16)",
903
+ "hover": "rgba(255, 255, 255, 0.2)",
904
+ "active": "rgba(255, 255, 255, 0.24)"
845
905
  },
846
906
  "colorSeparatorPrimaryAlpha": {
847
907
  "normal": "rgba(0, 0, 0, 0.4)",
@@ -1003,6 +1063,11 @@
1003
1063
  "hover": "rgba(237, 10, 52, 0.16)",
1004
1064
  "active": "rgba(237, 10, 52, 0.2)"
1005
1065
  },
1066
+ "calendarColorBackgroundAccentTintThemed": {
1067
+ "normal": "#3E3E3F",
1068
+ "hover": "#2C2C2D",
1069
+ "active": "#3E3E3F"
1070
+ },
1006
1071
  "widthTouch": "(max-width: 767px)",
1007
1072
  "widthToTouch": "(max-width: 767px)",
1008
1073
  "widthFromDesktopS": "(min-width: 768px)",