@taiga-ui/design-tokens 0.278.0 → 0.280.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 (5) hide show
  1. package/angular/fonts/desktop.less +46 -0
  2. package/angular/fonts/mobile.less +70 -0
  3. package/fonts/desktop.css +46 -0
  4. package/fonts/mobile.css +70 -0
  5. package/package.json +1 -1
package/angular/fonts/desktop.less CHANGED
@@ -2,48 +2,94 @@
2
2
  :host {
3
3
  --tui-font-offset: 0rem;
4
4
  --tui-font-family-fallback: -apple-system, 'BlinkMacSystemFont', system-ui, 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif;
5
+ --tui-typography-offset: 0rem;
6
+ --tui-typography-family-fallback: -apple-system, 'BlinkMacSystemFont', system-ui, 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif;
5
7
  --tui-font-family-text: 'Neue Haas Unica W1G';
8
+ --tui-typography-family-text: 'Neue Haas Unica W1G';
6
9
  --tui-font-family-display: 'T-Sans';
10
+ --tui-typography-family-display: 'T-Sans';
7
11
  --tui-font-family-code: 'JetBrains Mono';
12
+ --tui-typography-family-code: 'JetBrains Mono';
8
13
  --tui-font-legacy-body-xl-bold: bold calc(var(--tui-font-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-font-family-fallback);
14
+ --tui-typography-legacy-body-xl-bold: bold calc(var(--tui-typography-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-typography-family-fallback);
9
15
  --tui-font-legacy-body-xl: normal calc(var(--tui-font-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-font-family-fallback);
16
+ --tui-typography-legacy-body-xl: normal calc(var(--tui-typography-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-typography-family-fallback);
10
17
  --tui-font-legacy-body-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
18
+ --tui-typography-legacy-body-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
11
19
  --tui-font-legacy-body-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
20
+ --tui-typography-legacy-body-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
12
21
  --tui-font-legacy-body-3xs-bold: bold calc(var(--tui-font-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
22
+ --tui-typography-legacy-body-3xs-bold: bold calc(var(--tui-typography-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
13
23
  --tui-font-legacy-body-3xs: normal calc(var(--tui-font-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
24
+ --tui-typography-legacy-body-3xs: normal calc(var(--tui-typography-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
14
25
  --tui-font-heading-h1: 800 calc(var(--tui-font-offset) + 3.125rem) / calc(56 / 50) var(--tui-font-family-display), var(--tui-font-family-fallback);
26
+ --tui-typography-heading-h1: 800 calc(var(--tui-typography-offset) + 3.125rem) / calc(56 / 50) var(--tui-font-family-display), var(--tui-typography-family-fallback);
15
27
  --tui-font-heading-h2: 800 calc(var(--tui-font-offset) + 2.75rem) / calc(48 / 44) var(--tui-font-family-display), var(--tui-font-family-fallback);
28
+ --tui-typography-heading-h2: 800 calc(var(--tui-typography-offset) + 2.75rem) / calc(48 / 44) var(--tui-font-family-display), var(--tui-typography-family-fallback);
16
29
  --tui-font-heading-h3: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-font-family-fallback);
30
+ --tui-typography-heading-h3: bold calc(var(--tui-typography-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-typography-family-fallback);
17
31
  --tui-font-heading-h4: bold calc(var(--tui-font-offset) + 1.75rem) / calc(32 / 28) var(--tui-font-family-display), var(--tui-font-family-fallback);
32
+ --tui-typography-heading-h4: bold calc(var(--tui-typography-offset) + 1.75rem) / calc(32 / 28) var(--tui-font-family-display), var(--tui-typography-family-fallback);
18
33
  --tui-font-heading-h5: bold calc(var(--tui-font-offset) + 1.5rem) / calc(28 / 24) var(--tui-font-family-display), var(--tui-font-family-fallback);
34
+ --tui-typography-heading-h5: bold calc(var(--tui-typography-offset) + 1.5rem) / calc(28 / 24) var(--tui-font-family-display), var(--tui-typography-family-fallback);
19
35
  --tui-font-heading-h6: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
36
+ --tui-typography-heading-h6: bold calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
20
37
  --tui-font-body-l-bold: bold calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
38
+ --tui-typography-body-l-bold: bold calc(var(--tui-typography-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
21
39
  --tui-font-body-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
40
+ --tui-typography-body-l: normal calc(var(--tui-typography-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
22
41
  --tui-font-body-m-bold: bold calc(var(--tui-font-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
42
+ --tui-typography-body-m-bold: bold calc(var(--tui-typography-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
23
43
  --tui-font-body-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
44
+ --tui-typography-body-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
24
45
  --tui-font-body-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
46
+ --tui-typography-body-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
25
47
  --tui-font-body-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
48
+ --tui-typography-body-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
26
49
  --tui-font-body-xs-bold: bold calc(var(--tui-font-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
50
+ --tui-typography-body-xs-bold: bold calc(var(--tui-typography-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
27
51
  --tui-font-body-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
52
+ --tui-typography-body-xs: normal calc(var(--tui-typography-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
28
53
  --tui-font-ui-l-bold: bold calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
54
+ --tui-typography-ui-l-bold: bold calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
29
55
  --tui-font-ui-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
56
+ --tui-typography-ui-l: normal calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
30
57
  --tui-font-ui-m-bold: bold calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
58
+ --tui-typography-ui-m-bold: bold calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
31
59
  --tui-font-ui-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
60
+ --tui-typography-ui-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
32
61
  --tui-font-ui-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
62
+ --tui-typography-ui-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
33
63
  --tui-font-ui-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
64
+ --tui-typography-ui-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
34
65
  --tui-font-ui-xs-bold: bold calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
66
+ --tui-typography-ui-xs-bold: bold calc(var(--tui-typography-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
35
67
  --tui-font-ui-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
68
+ --tui-typography-ui-xs: normal calc(var(--tui-typography-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
36
69
  --tui-font-ui-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
70
+ --tui-typography-ui-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
37
71
  --tui-font-ui-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
72
+ --tui-typography-ui-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
38
73
  --tui-font-ui-3xs-bold: bold calc(var(--tui-font-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
74
+ --tui-typography-ui-3xs-bold: bold calc(var(--tui-typography-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
39
75
  --tui-font-ui-3xs: normal calc(var(--tui-font-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
76
+ --tui-typography-ui-3xs: normal calc(var(--tui-typography-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
40
77
  --tui-font-caps-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
78
+ --tui-typography-caps-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
41
79
  --tui-font-caps-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
80
+ --tui-typography-caps-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
42
81
  --tui-font-caps-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
82
+ --tui-typography-caps-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
43
83
  --tui-font-caps-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
84
+ --tui-typography-caps-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
44
85
  --tui-font-numbers-2xl: bold calc(var(--tui-font-offset) + 3.5rem) / calc(64 / 56) var(--tui-font-family-display), var(--tui-font-family-fallback);
86
+ --tui-typography-numbers-2xl: bold calc(var(--tui-typography-offset) + 3.5rem) / calc(64 / 56) var(--tui-font-family-display), var(--tui-typography-family-fallback);
45
87
  --tui-font-numbers-xl: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-font-family-fallback);
88
+ --tui-typography-numbers-xl: bold calc(var(--tui-typography-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-typography-family-fallback);
46
89
  --tui-font-numbers-m: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
90
+ --tui-typography-numbers-m: bold calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
47
91
  --tui-font-code-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-code), var(--tui-font-family-fallback);
92
+ --tui-typography-code-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-code), var(--tui-typography-family-fallback);
48
93
  --tui-font-code-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-code), var(--tui-font-family-fallback);
94
+ --tui-typography-code-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-code), var(--tui-typography-family-fallback);
49
95
  }
package/angular/fonts/mobile.less CHANGED
@@ -1,75 +1,145 @@
1
1
  [data-platform='ios'] {
2
2
  --tui-font-family-fallback: system-ui, -apple-system, sans-serif;
3
3
  --tui-font-family-rounded-fallback: ui-rounded, -apple-system, sans-serif;
4
+ --tui-typography-family-fallback: system-ui, -apple-system, sans-serif;
5
+ --tui-typography-family-rounded-fallback: ui-rounded, -apple-system, sans-serif;
4
6
  --tui-font-family-text: 'SF Pro';
7
+ --tui-typography-family-text: 'SF Pro';
5
8
  --tui-font-family-display: 'SF Pro';
9
+ --tui-typography-family-display: 'SF Pro';
6
10
  --tui-font-family-rounded: 'SF Pro Rounded';
11
+ --tui-typography-family-rounded: 'SF Pro Rounded';
7
12
  --tui-font-heading-mobile-l: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-display), var(--tui-font-family-fallback);
13
+ --tui-typography-heading-mobile-l: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-display), var(--tui-typography-family-fallback);
8
14
  --tui-font-heading-mobile-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
15
+ --tui-typography-heading-mobile-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
9
16
  --tui-font-heading-mobile-s-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-font-family-fallback);
17
+ --tui-typography-heading-mobile-s-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-typography-family-fallback);
10
18
  --tui-font-heading-mobile-s: 600 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-font-family-fallback);
19
+ --tui-typography-heading-mobile-s: 600 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-typography-family-fallback);
11
20
  --tui-font-body-l-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
21
+ --tui-typography-body-l-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
12
22
  --tui-font-body-l: 400 calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
23
+ --tui-typography-body-l: 400 calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
13
24
  --tui-font-body-m-bold: 600 calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
25
+ --tui-typography-body-m-bold: 600 calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
14
26
  --tui-font-body-m: 400 calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
27
+ --tui-typography-body-m: 400 calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
15
28
  --tui-font-body-s-bold: 600 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
29
+ --tui-typography-body-s-bold: 600 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
16
30
  --tui-font-body-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
31
+ --tui-typography-body-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
17
32
  --tui-font-body-xs-bold: 600 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
33
+ --tui-typography-body-xs-bold: 600 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
18
34
  --tui-font-body-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
35
+ --tui-typography-body-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
19
36
  --tui-font-ui-l-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
37
+ --tui-typography-ui-l-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
20
38
  --tui-font-ui-l: 400 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
39
+ --tui-typography-ui-l: 400 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
21
40
  --tui-font-ui-m-bold: 600 calc(var(--tui-font-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
41
+ --tui-typography-ui-m-bold: 600 calc(var(--tui-typography-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
22
42
  --tui-font-ui-m: 400 calc(var(--tui-font-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
43
+ --tui-typography-ui-m: 400 calc(var(--tui-typography-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
23
44
  --tui-font-ui-s-bold: 600 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
45
+ --tui-typography-ui-s-bold: 600 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
24
46
  --tui-font-ui-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
47
+ --tui-typography-ui-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
25
48
  --tui-font-ui-xs-bold: 600 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
49
+ --tui-typography-ui-xs-bold: 600 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
26
50
  --tui-font-ui-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
51
+ --tui-typography-ui-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
27
52
  --tui-font-ui-2xs-bold: 600 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
53
+ --tui-typography-ui-2xs-bold: 600 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
28
54
  --tui-font-ui-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
55
+ --tui-typography-ui-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
29
56
  --tui-font-ui-3xs-bold: 700 calc(var(--tui-font-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
57
+ --tui-typography-ui-3xs-bold: 700 calc(var(--tui-typography-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
30
58
  --tui-font-ui-3xs: 400 calc(var(--tui-font-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
59
+ --tui-typography-ui-3xs: 400 calc(var(--tui-typography-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
31
60
  --tui-font-caps-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
61
+ --tui-typography-caps-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
32
62
  --tui-font-caps-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
63
+ --tui-typography-caps-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
33
64
  --tui-font-caps-2xs-bold: 500 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
65
+ --tui-typography-caps-2xs-bold: 500 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
34
66
  --tui-font-caps-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
67
+ --tui-typography-caps-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
35
68
  --tui-font-numbers-2xl: 700 calc(var(--tui-font-offset) + 3rem) / calc(57 / 48) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
69
+ --tui-typography-numbers-2xl: 700 calc(var(--tui-typography-offset) + 3rem) / calc(57 / 48) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
36
70
  --tui-font-numbers-xl: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
71
+ --tui-typography-numbers-xl: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
37
72
  --tui-font-numbers-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
73
+ --tui-typography-numbers-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
38
74
  }
39
75
 
40
76
  [data-platform='android'] {
41
77
  --tui-font-family-text: 'Roboto';
78
+ --tui-typography-family-text: 'Roboto';
42
79
  --tui-font-family-display: 'Roboto';
80
+ --tui-typography-family-display: 'Roboto';
43
81
  --tui-font-family-rounded: 'Open Runde';
82
+ --tui-typography-family-rounded: 'Open Runde';
44
83
  --tui-font-heading-mobile-l: 700 calc(var(--tui-font-offset) + 1.75rem) / calc(33 / 28) var(--tui-font-family-display), var(--tui-font-family-fallback);
84
+ --tui-typography-heading-mobile-l: 700 calc(var(--tui-typography-offset) + 1.75rem) / calc(33 / 28) var(--tui-font-family-display), var(--tui-typography-family-fallback);
45
85
  --tui-font-heading-mobile-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
86
+ --tui-typography-heading-mobile-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
46
87
  --tui-font-heading-mobile-s-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-font-family-fallback);
88
+ --tui-typography-heading-mobile-s-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-typography-family-fallback);
47
89
  --tui-font-heading-mobile-s: 500 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-font-family-fallback);
90
+ --tui-typography-heading-mobile-s: 500 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-typography-family-fallback);
48
91
  --tui-font-body-l-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
92
+ --tui-typography-body-l-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
49
93
  --tui-font-body-l: 400 calc(var(--tui-font-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
94
+ --tui-typography-body-l: 400 calc(var(--tui-typography-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
50
95
  --tui-font-body-m-bold: 500 calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
96
+ --tui-typography-body-m-bold: 500 calc(var(--tui-typography-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
51
97
  --tui-font-body-m: 400 calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
98
+ --tui-typography-body-m: 400 calc(var(--tui-typography-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
52
99
  --tui-font-body-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
100
+ --tui-typography-body-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
53
101
  --tui-font-body-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
102
+ --tui-typography-body-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
54
103
  --tui-font-body-xs-bold: 500 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
104
+ --tui-typography-body-xs-bold: 500 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
55
105
  --tui-font-body-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
106
+ --tui-typography-body-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
56
107
  --tui-font-ui-l-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
108
+ --tui-typography-ui-l-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
57
109
  --tui-font-ui-l: 400 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
110
+ --tui-typography-ui-l: 400 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
58
111
  --tui-font-ui-m-bold: 500 calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
112
+ --tui-typography-ui-m-bold: 500 calc(var(--tui-typography-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
59
113
  --tui-font-ui-m: 400 calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
114
+ --tui-typography-ui-m: 400 calc(var(--tui-typography-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
60
115
  --tui-font-ui-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
116
+ --tui-typography-ui-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
61
117
  --tui-font-ui-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
118
+ --tui-typography-ui-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
62
119
  --tui-font-ui-xs-bold: 500 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
120
+ --tui-typography-ui-xs-bold: 500 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
63
121
  --tui-font-ui-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
122
+ --tui-typography-ui-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
64
123
  --tui-font-ui-2xs-bold: 700 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
124
+ --tui-typography-ui-2xs-bold: 700 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
65
125
  --tui-font-ui-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
126
+ --tui-typography-ui-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
66
127
  --tui-font-ui-3xs-bold: 500 calc(var(--tui-font-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
128
+ --tui-typography-ui-3xs-bold: 500 calc(var(--tui-typography-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
67
129
  --tui-font-ui-3xs: 400 calc(var(--tui-font-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
130
+ --tui-typography-ui-3xs: 400 calc(var(--tui-typography-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
68
131
  --tui-font-caps-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
132
+ --tui-typography-caps-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
69
133
  --tui-font-caps-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
134
+ --tui-typography-caps-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
70
135
  --tui-font-caps-2xs-bold: 500 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
136
+ --tui-typography-caps-2xs-bold: 500 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
71
137
  --tui-font-caps-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
138
+ --tui-typography-caps-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
72
139
  --tui-font-numbers-2xl: 700 calc(var(--tui-font-offset) + 3rem) / calc(56 / 48) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
140
+ --tui-typography-numbers-2xl: 700 calc(var(--tui-typography-offset) + 3rem) / calc(56 / 48) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
73
141
  --tui-font-numbers-xl: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(35 / 30) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
142
+ --tui-typography-numbers-xl: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(35 / 30) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
74
143
  --tui-font-numbers-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
144
+ --tui-typography-numbers-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
75
145
  }
package/fonts/desktop.css CHANGED
@@ -2,48 +2,94 @@
2
2
  :host {
3
3
  --tui-font-offset: 0rem;
4
4
  --tui-font-family-fallback: -apple-system, 'BlinkMacSystemFont', system-ui, 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif;
5
+ --tui-typography-offset: 0rem;
6
+ --tui-typography-family-fallback: -apple-system, 'BlinkMacSystemFont', system-ui, 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif;
5
7
  --tui-font-family-text: 'Neue Haas Unica W1G';
8
+ --tui-typography-family-text: 'Neue Haas Unica W1G';
6
9
  --tui-font-family-display: 'T-Sans';
10
+ --tui-typography-family-display: 'T-Sans';
7
11
  --tui-font-family-code: 'JetBrains Mono';
12
+ --tui-typography-family-code: 'JetBrains Mono';
8
13
  --tui-font-legacy-body-xl-bold: bold calc(var(--tui-font-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-font-family-fallback);
14
+ --tui-typography-legacy-body-xl-bold: bold calc(var(--tui-typography-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-typography-family-fallback);
9
15
  --tui-font-legacy-body-xl: normal calc(var(--tui-font-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-font-family-fallback);
16
+ --tui-typography-legacy-body-xl: normal calc(var(--tui-typography-offset) + 1.1875rem) / calc(28 / 19) var(--tui-font-family-text), var(--tui-typography-family-fallback);
10
17
  --tui-font-legacy-body-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
18
+ --tui-typography-legacy-body-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
11
19
  --tui-font-legacy-body-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
20
+ --tui-typography-legacy-body-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
12
21
  --tui-font-legacy-body-3xs-bold: bold calc(var(--tui-font-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
22
+ --tui-typography-legacy-body-3xs-bold: bold calc(var(--tui-typography-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
13
23
  --tui-font-legacy-body-3xs: normal calc(var(--tui-font-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
24
+ --tui-typography-legacy-body-3xs: normal calc(var(--tui-typography-offset) + 0.5625rem) / calc(16 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
14
25
  --tui-font-heading-h1: 800 calc(var(--tui-font-offset) + 3.125rem) / calc(56 / 50) var(--tui-font-family-display), var(--tui-font-family-fallback);
26
+ --tui-typography-heading-h1: 800 calc(var(--tui-typography-offset) + 3.125rem) / calc(56 / 50) var(--tui-font-family-display), var(--tui-typography-family-fallback);
15
27
  --tui-font-heading-h2: 800 calc(var(--tui-font-offset) + 2.75rem) / calc(48 / 44) var(--tui-font-family-display), var(--tui-font-family-fallback);
28
+ --tui-typography-heading-h2: 800 calc(var(--tui-typography-offset) + 2.75rem) / calc(48 / 44) var(--tui-font-family-display), var(--tui-typography-family-fallback);
16
29
  --tui-font-heading-h3: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-font-family-fallback);
30
+ --tui-typography-heading-h3: bold calc(var(--tui-typography-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-typography-family-fallback);
17
31
  --tui-font-heading-h4: bold calc(var(--tui-font-offset) + 1.75rem) / calc(32 / 28) var(--tui-font-family-display), var(--tui-font-family-fallback);
32
+ --tui-typography-heading-h4: bold calc(var(--tui-typography-offset) + 1.75rem) / calc(32 / 28) var(--tui-font-family-display), var(--tui-typography-family-fallback);
18
33
  --tui-font-heading-h5: bold calc(var(--tui-font-offset) + 1.5rem) / calc(28 / 24) var(--tui-font-family-display), var(--tui-font-family-fallback);
34
+ --tui-typography-heading-h5: bold calc(var(--tui-typography-offset) + 1.5rem) / calc(28 / 24) var(--tui-font-family-display), var(--tui-typography-family-fallback);
19
35
  --tui-font-heading-h6: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
36
+ --tui-typography-heading-h6: bold calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
20
37
  --tui-font-body-l-bold: bold calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
38
+ --tui-typography-body-l-bold: bold calc(var(--tui-typography-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
21
39
  --tui-font-body-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
40
+ --tui-typography-body-l: normal calc(var(--tui-typography-offset) + 1.0625rem) / calc(28 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
22
41
  --tui-font-body-m-bold: bold calc(var(--tui-font-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
42
+ --tui-typography-body-m-bold: bold calc(var(--tui-typography-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
23
43
  --tui-font-body-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
44
+ --tui-typography-body-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(24 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
24
45
  --tui-font-body-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
46
+ --tui-typography-body-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
25
47
  --tui-font-body-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
48
+ --tui-typography-body-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
26
49
  --tui-font-body-xs-bold: bold calc(var(--tui-font-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
50
+ --tui-typography-body-xs-bold: bold calc(var(--tui-typography-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
27
51
  --tui-font-body-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
52
+ --tui-typography-body-xs: normal calc(var(--tui-typography-offset) + 0.75rem) / calc(19 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
28
53
  --tui-font-ui-l-bold: bold calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
54
+ --tui-typography-ui-l-bold: bold calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
29
55
  --tui-font-ui-l: normal calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
56
+ --tui-typography-ui-l: normal calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
30
57
  --tui-font-ui-m-bold: bold calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
58
+ --tui-typography-ui-m-bold: bold calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
31
59
  --tui-font-ui-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
60
+ --tui-typography-ui-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
32
61
  --tui-font-ui-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
62
+ --tui-typography-ui-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
33
63
  --tui-font-ui-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
64
+ --tui-typography-ui-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
34
65
  --tui-font-ui-xs-bold: bold calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
66
+ --tui-typography-ui-xs-bold: bold calc(var(--tui-typography-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
35
67
  --tui-font-ui-xs: normal calc(var(--tui-font-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
68
+ --tui-typography-ui-xs: normal calc(var(--tui-typography-offset) + 0.75rem) / calc(15 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
36
69
  --tui-font-ui-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
70
+ --tui-typography-ui-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
37
71
  --tui-font-ui-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
72
+ --tui-typography-ui-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
38
73
  --tui-font-ui-3xs-bold: bold calc(var(--tui-font-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
74
+ --tui-typography-ui-3xs-bold: bold calc(var(--tui-typography-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
39
75
  --tui-font-ui-3xs: normal calc(var(--tui-font-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
76
+ --tui-typography-ui-3xs: normal calc(var(--tui-typography-offset) + 0.5625rem) / calc(13 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
40
77
  --tui-font-caps-s-bold: bold calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
78
+ --tui-typography-caps-s-bold: bold calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
41
79
  --tui-font-caps-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
80
+ --tui-typography-caps-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(20 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
42
81
  --tui-font-caps-2xs-bold: bold calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
82
+ --tui-typography-caps-2xs-bold: bold calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
43
83
  --tui-font-caps-2xs: normal calc(var(--tui-font-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
84
+ --tui-typography-caps-2xs: normal calc(var(--tui-typography-offset) + 0.6875rem) / calc(16 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
44
85
  --tui-font-numbers-2xl: bold calc(var(--tui-font-offset) + 3.5rem) / calc(64 / 56) var(--tui-font-family-display), var(--tui-font-family-fallback);
86
+ --tui-typography-numbers-2xl: bold calc(var(--tui-typography-offset) + 3.5rem) / calc(64 / 56) var(--tui-font-family-display), var(--tui-typography-family-fallback);
45
87
  --tui-font-numbers-xl: bold calc(var(--tui-font-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-font-family-fallback);
88
+ --tui-typography-numbers-xl: bold calc(var(--tui-typography-offset) + 2.25rem) / calc(40 / 36) var(--tui-font-family-display), var(--tui-typography-family-fallback);
46
89
  --tui-font-numbers-m: bold calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
90
+ --tui-typography-numbers-m: bold calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
47
91
  --tui-font-code-m: normal calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-code), var(--tui-font-family-fallback);
92
+ --tui-typography-code-m: normal calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-code), var(--tui-typography-family-fallback);
48
93
  --tui-font-code-s: normal calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-code), var(--tui-font-family-fallback);
94
+ --tui-typography-code-s: normal calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-code), var(--tui-typography-family-fallback);
49
95
  }
package/fonts/mobile.css CHANGED
@@ -1,75 +1,145 @@
1
1
  [data-platform='ios'] {
2
2
  --tui-font-family-fallback: system-ui, -apple-system, sans-serif;
3
3
  --tui-font-family-rounded-fallback: ui-rounded, -apple-system, sans-serif;
4
+ --tui-typography-family-fallback: system-ui, -apple-system, sans-serif;
5
+ --tui-typography-family-rounded-fallback: ui-rounded, -apple-system, sans-serif;
4
6
  --tui-font-family-text: 'SF Pro';
7
+ --tui-typography-family-text: 'SF Pro';
5
8
  --tui-font-family-display: 'SF Pro';
9
+ --tui-typography-family-display: 'SF Pro';
6
10
  --tui-font-family-rounded: 'SF Pro Rounded';
11
+ --tui-typography-family-rounded: 'SF Pro Rounded';
7
12
  --tui-font-heading-mobile-l: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-display), var(--tui-font-family-fallback);
13
+ --tui-typography-heading-mobile-l: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-display), var(--tui-typography-family-fallback);
8
14
  --tui-font-heading-mobile-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
15
+ --tui-typography-heading-mobile-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
9
16
  --tui-font-heading-mobile-s-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-font-family-fallback);
17
+ --tui-typography-heading-mobile-s-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-typography-family-fallback);
10
18
  --tui-font-heading-mobile-s: 600 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-font-family-fallback);
19
+ --tui-typography-heading-mobile-s: 600 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-display), var(--tui-typography-family-fallback);
11
20
  --tui-font-body-l-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
21
+ --tui-typography-body-l-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
12
22
  --tui-font-body-l: 400 calc(var(--tui-font-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
23
+ --tui-typography-body-l: 400 calc(var(--tui-typography-offset) + 1.0625rem) / calc(24 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
13
24
  --tui-font-body-m-bold: 600 calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
25
+ --tui-typography-body-m-bold: 600 calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
14
26
  --tui-font-body-m: 400 calc(var(--tui-font-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
27
+ --tui-typography-body-m: 400 calc(var(--tui-typography-offset) + 0.9375rem) / calc(20 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
15
28
  --tui-font-body-s-bold: 600 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
29
+ --tui-typography-body-s-bold: 600 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
16
30
  --tui-font-body-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
31
+ --tui-typography-body-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
17
32
  --tui-font-body-xs-bold: 600 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
33
+ --tui-typography-body-xs-bold: 600 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
18
34
  --tui-font-body-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
35
+ --tui-typography-body-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
19
36
  --tui-font-ui-l-bold: 700 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
37
+ --tui-typography-ui-l-bold: 700 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
20
38
  --tui-font-ui-l: 400 calc(var(--tui-font-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-font-family-fallback);
39
+ --tui-typography-ui-l: 400 calc(var(--tui-typography-offset) + 1.0625rem) / calc(20 / 17) var(--tui-font-family-text), var(--tui-typography-family-fallback);
21
40
  --tui-font-ui-m-bold: 600 calc(var(--tui-font-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
41
+ --tui-typography-ui-m-bold: 600 calc(var(--tui-typography-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
22
42
  --tui-font-ui-m: 400 calc(var(--tui-font-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-font-family-fallback);
43
+ --tui-typography-ui-m: 400 calc(var(--tui-typography-offset) + 0.9375rem) / calc(18 / 15) var(--tui-font-family-text), var(--tui-typography-family-fallback);
23
44
  --tui-font-ui-s-bold: 600 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
45
+ --tui-typography-ui-s-bold: 600 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
24
46
  --tui-font-ui-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
47
+ --tui-typography-ui-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
25
48
  --tui-font-ui-xs-bold: 600 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
49
+ --tui-typography-ui-xs-bold: 600 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
26
50
  --tui-font-ui-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
51
+ --tui-typography-ui-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
27
52
  --tui-font-ui-2xs-bold: 600 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
53
+ --tui-typography-ui-2xs-bold: 600 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
28
54
  --tui-font-ui-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
55
+ --tui-typography-ui-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
29
56
  --tui-font-ui-3xs-bold: 700 calc(var(--tui-font-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
57
+ --tui-typography-ui-3xs-bold: 700 calc(var(--tui-typography-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
30
58
  --tui-font-ui-3xs: 400 calc(var(--tui-font-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
59
+ --tui-typography-ui-3xs: 400 calc(var(--tui-typography-offset) + 0.5625rem) / calc(11 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
31
60
  --tui-font-caps-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
61
+ --tui-typography-caps-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
32
62
  --tui-font-caps-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
63
+ --tui-typography-caps-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(16 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
33
64
  --tui-font-caps-2xs-bold: 500 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
65
+ --tui-typography-caps-2xs-bold: 500 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
34
66
  --tui-font-caps-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
67
+ --tui-typography-caps-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
35
68
  --tui-font-numbers-2xl: 700 calc(var(--tui-font-offset) + 3rem) / calc(57 / 48) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
69
+ --tui-typography-numbers-2xl: 700 calc(var(--tui-typography-offset) + 3rem) / calc(57 / 48) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
36
70
  --tui-font-numbers-xl: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
71
+ --tui-typography-numbers-xl: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(36 / 30) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
37
72
  --tui-font-numbers-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-font-family-rounded-fallback);
73
+ --tui-typography-numbers-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-typography-family-rounded-fallback);
38
74
  }
39
75
 
40
76
  [data-platform='android'] {
41
77
  --tui-font-family-text: 'Roboto';
78
+ --tui-typography-family-text: 'Roboto';
42
79
  --tui-font-family-display: 'Roboto';
80
+ --tui-typography-family-display: 'Roboto';
43
81
  --tui-font-family-rounded: 'Open Runde';
82
+ --tui-typography-family-rounded: 'Open Runde';
44
83
  --tui-font-heading-mobile-l: 700 calc(var(--tui-font-offset) + 1.75rem) / calc(33 / 28) var(--tui-font-family-display), var(--tui-font-family-fallback);
84
+ --tui-typography-heading-mobile-l: 700 calc(var(--tui-typography-offset) + 1.75rem) / calc(33 / 28) var(--tui-font-family-display), var(--tui-typography-family-fallback);
45
85
  --tui-font-heading-mobile-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-font-family-fallback);
86
+ --tui-typography-heading-mobile-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-display), var(--tui-typography-family-fallback);
46
87
  --tui-font-heading-mobile-s-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-font-family-fallback);
88
+ --tui-typography-heading-mobile-s-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-typography-family-fallback);
47
89
  --tui-font-heading-mobile-s: 500 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-font-family-fallback);
90
+ --tui-typography-heading-mobile-s: 500 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-display), var(--tui-typography-family-fallback);
48
91
  --tui-font-body-l-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
92
+ --tui-typography-body-l-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
49
93
  --tui-font-body-l: 400 calc(var(--tui-font-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
94
+ --tui-typography-body-l: 400 calc(var(--tui-typography-offset) + 1rem) / calc(23 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
50
95
  --tui-font-body-m-bold: 500 calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
96
+ --tui-typography-body-m-bold: 500 calc(var(--tui-typography-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
51
97
  --tui-font-body-m: 400 calc(var(--tui-font-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
98
+ --tui-typography-body-m: 400 calc(var(--tui-typography-offset) + 0.875rem) / calc(20 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
52
99
  --tui-font-body-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
100
+ --tui-typography-body-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
53
101
  --tui-font-body-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
102
+ --tui-typography-body-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(18 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
54
103
  --tui-font-body-xs-bold: 500 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
104
+ --tui-typography-body-xs-bold: 500 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
55
105
  --tui-font-body-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
106
+ --tui-typography-body-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(17 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
56
107
  --tui-font-ui-l-bold: 700 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
108
+ --tui-typography-ui-l-bold: 700 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
57
109
  --tui-font-ui-l: 400 calc(var(--tui-font-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-font-family-fallback);
110
+ --tui-typography-ui-l: 400 calc(var(--tui-typography-offset) + 1rem) / calc(19 / 16) var(--tui-font-family-text), var(--tui-typography-family-fallback);
58
111
  --tui-font-ui-m-bold: 500 calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
112
+ --tui-typography-ui-m-bold: 500 calc(var(--tui-typography-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
59
113
  --tui-font-ui-m: 400 calc(var(--tui-font-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-font-family-fallback);
114
+ --tui-typography-ui-m: 400 calc(var(--tui-typography-offset) + 0.875rem) / calc(16 / 14) var(--tui-font-family-text), var(--tui-typography-family-fallback);
60
115
  --tui-font-ui-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
116
+ --tui-typography-ui-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
61
117
  --tui-font-ui-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
118
+ --tui-typography-ui-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
62
119
  --tui-font-ui-xs-bold: 500 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
120
+ --tui-typography-ui-xs-bold: 500 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
63
121
  --tui-font-ui-xs: 400 calc(var(--tui-font-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-font-family-fallback);
122
+ --tui-typography-ui-xs: 400 calc(var(--tui-typography-offset) + 0.75rem) / calc(14 / 12) var(--tui-font-family-text), var(--tui-typography-family-fallback);
64
123
  --tui-font-ui-2xs-bold: 700 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
124
+ --tui-typography-ui-2xs-bold: 700 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
65
125
  --tui-font-ui-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
126
+ --tui-typography-ui-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
66
127
  --tui-font-ui-3xs-bold: 500 calc(var(--tui-font-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
128
+ --tui-typography-ui-3xs-bold: 500 calc(var(--tui-typography-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
67
129
  --tui-font-ui-3xs: 400 calc(var(--tui-font-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-font-family-fallback);
130
+ --tui-typography-ui-3xs: 400 calc(var(--tui-typography-offset) + 0.5625rem) / calc(10 / 9) var(--tui-font-family-text), var(--tui-typography-family-fallback);
68
131
  --tui-font-caps-s-bold: 500 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
132
+ --tui-typography-caps-s-bold: 500 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
69
133
  --tui-font-caps-s: 400 calc(var(--tui-font-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-font-family-fallback);
134
+ --tui-typography-caps-s: 400 calc(var(--tui-typography-offset) + 0.8125rem) / calc(15 / 13) var(--tui-font-family-text), var(--tui-typography-family-fallback);
70
135
  --tui-font-caps-2xs-bold: 500 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
136
+ --tui-typography-caps-2xs-bold: 500 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
71
137
  --tui-font-caps-2xs: 400 calc(var(--tui-font-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-font-family-fallback);
138
+ --tui-typography-caps-2xs: 400 calc(var(--tui-typography-offset) + 0.6875rem) / calc(13 / 11) var(--tui-font-family-text), var(--tui-typography-family-fallback);
72
139
  --tui-font-numbers-2xl: 700 calc(var(--tui-font-offset) + 3rem) / calc(56 / 48) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
140
+ --tui-typography-numbers-2xl: 700 calc(var(--tui-typography-offset) + 3rem) / calc(56 / 48) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
73
141
  --tui-font-numbers-xl: 700 calc(var(--tui-font-offset) + 1.875rem) / calc(35 / 30) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
142
+ --tui-typography-numbers-xl: 700 calc(var(--tui-typography-offset) + 1.875rem) / calc(35 / 30) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
74
143
  --tui-font-numbers-m: 700 calc(var(--tui-font-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-font-family-fallback);
144
+ --tui-typography-numbers-m: 700 calc(var(--tui-typography-offset) + 1.25rem) / calc(24 / 20) var(--tui-font-family-rounded), var(--tui-typography-family-fallback);
75
145
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@taiga-ui/design-tokens",
3
- "version": "0.278.0",
3
+ "version": "0.280.0",
4
4
  "description": "Taiga UI palette",
5
5
  "keywords": [
6
6
  "angular",