@alfalab/core-components-typography 6.0.3 → 6.0.4-alfasans

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 (37) hide show
  1. package/colors.css +20 -20
  2. package/colors.module.css.js +1 -1
  3. package/cssm/text/index.module.css +40 -13
  4. package/cssm/title/index.module.css +29 -40
  5. package/cssm/title-mobile/index.module.css +28 -45
  6. package/esm/colors.css +20 -20
  7. package/esm/colors.module.css.js +1 -1
  8. package/esm/text/index.css +80 -53
  9. package/esm/text/index.module.css.js +1 -1
  10. package/esm/title/common.css +5 -5
  11. package/esm/title/common.module.css.js +1 -1
  12. package/esm/title/index.css +54 -65
  13. package/esm/title/index.module.css.js +1 -1
  14. package/esm/title-mobile/index.css +53 -70
  15. package/esm/title-mobile/index.module.css.js +1 -1
  16. package/modern/colors.css +20 -20
  17. package/modern/colors.module.css.js +1 -1
  18. package/modern/text/index.css +80 -53
  19. package/modern/text/index.module.css.js +1 -1
  20. package/modern/title/common.css +5 -5
  21. package/modern/title/common.module.css.js +1 -1
  22. package/modern/title/index.css +54 -65
  23. package/modern/title/index.module.css.js +1 -1
  24. package/modern/title-mobile/index.css +53 -70
  25. package/modern/title-mobile/index.module.css.js +1 -1
  26. package/moderncssm/text/index.module.css +37 -11
  27. package/moderncssm/title/index.module.css +26 -35
  28. package/moderncssm/title-mobile/index.module.css +25 -40
  29. package/package.json +6 -6
  30. package/text/index.css +80 -53
  31. package/text/index.module.css.js +1 -1
  32. package/title/common.css +5 -5
  33. package/title/common.module.css.js +1 -1
  34. package/title/index.css +54 -65
  35. package/title/index.module.css.js +1 -1
  36. package/title-mobile/index.css +53 -70
  37. package/title-mobile/index.module.css.js +1 -1
package/modern/title/index.css CHANGED
@@ -10,143 +10,132 @@
10
10
  --gap-48: var(--gap-4xl);
11
11
  }
12
12
  :root {
13
- --font-family-system:
14
- system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
15
- --font-family-styrene:
16
- 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
17
- sans-serif;
13
+ --font-family-alfasans:
14
+ 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
15
+ Helvetica, sans-serif;
18
16
  }
19
- .typography__xlarge_1u2wm {
17
+ .typography__xlarge_u7f55 {
20
18
  font-size: 48px;
21
19
  line-height: 52px;
22
20
  font-weight: 700;
23
- font-family: var(--font-family-system);
21
+ letter-spacing: 0.1px;
22
+ font-family: var(--font-family-alfasans);
24
23
  }
25
- .typography__xlarge_1u2wm.typography__font_1u2wm {
24
+ .typography__xlarge_u7f55.typography__font_u7f55 {
26
25
  line-height: 64px;
27
- font-weight: 500;
28
- font-feature-settings: 'ss01';
29
- font-family: var(--font-family-styrene);
30
26
  }
31
- .typography__regular-xlarge_1u2wm {
27
+ .typography__regular-xlarge_u7f55 {
32
28
  font-size: 48px;
33
29
  line-height: 52px;
34
30
  font-weight: 400;
35
- font-family: var(--font-family-system);
31
+ letter-spacing: -2.1px;
32
+ font-family: var(--font-family-alfasans);
36
33
  }
37
- .typography__regular-xlarge_1u2wm.typography__font_1u2wm {
34
+ .typography__regular-xlarge_u7f55.typography__font_u7f55 {
38
35
  line-height: 64px;
39
- font-feature-settings: 'ss01';
40
- font-family: var(--font-family-styrene);
41
36
  }
42
- .typography__large_1u2wm {
37
+ .typography__large_u7f55 {
43
38
  font-size: 40px;
44
39
  line-height: 48px;
45
40
  font-weight: 700;
46
- font-family: var(--font-family-system);
41
+ letter-spacing: 0.1px;
42
+ font-family: var(--font-family-alfasans);
47
43
  }
48
- .typography__large_1u2wm.typography__font_1u2wm {
49
- font-weight: 500;
50
- font-feature-settings: 'ss01';
51
- font-family: var(--font-family-styrene);
44
+ .typography__large_u7f55.typography__font_u7f55 {
52
45
  }
53
- .typography__regular-large_1u2wm {
46
+ .typography__regular-large_u7f55 {
54
47
  font-size: 40px;
55
48
  line-height: 48px;
56
49
  font-weight: 400;
57
- font-family: var(--font-family-system);
50
+ letter-spacing: -1.7px;
51
+ font-family: var(--font-family-alfasans);
58
52
  }
59
- .typography__regular-large_1u2wm.typography__font_1u2wm {
60
- font-feature-settings: 'ss01';
61
- font-family: var(--font-family-styrene);
53
+ .typography__regular-large_u7f55.typography__font_u7f55 {
62
54
  }
63
- .typography__medium_1u2wm {
55
+ .typography__medium_u7f55 {
64
56
  font-size: 30px;
65
57
  line-height: 36px;
66
58
  font-weight: 700;
67
- font-family: var(--font-family-system);
59
+ letter-spacing: 0.1px;
60
+ font-family: var(--font-family-alfasans);
68
61
  }
69
- .typography__medium_1u2wm.typography__font_1u2wm {
62
+ .typography__medium_u7f55.typography__font_u7f55 {
70
63
  font-size: 32px;
71
64
  line-height: 40px;
72
- font-weight: 500;
73
- font-feature-settings: 'ss01';
74
- font-family: var(--font-family-styrene);
65
+ letter-spacing: 0.3px;
75
66
  }
76
- .typography__regular-medium_1u2wm {
67
+ .typography__regular-medium_u7f55 {
77
68
  font-size: 30px;
78
69
  line-height: 36px;
79
70
  font-weight: 400;
80
- font-family: var(--font-family-system);
71
+ letter-spacing: -1.25px;
72
+ font-family: var(--font-family-alfasans);
81
73
  }
82
- .typography__regular-medium_1u2wm.typography__font_1u2wm {
74
+ .typography__regular-medium_u7f55.typography__font_u7f55 {
83
75
  font-size: 32px;
84
76
  line-height: 40px;
85
- font-feature-settings: 'ss01';
86
- font-family: var(--font-family-styrene);
77
+ letter-spacing: -1.36px;
87
78
  }
88
- .typography__small_1u2wm {
79
+ .typography__small_u7f55 {
89
80
  font-size: 22px;
90
81
  line-height: 26px;
91
82
  font-weight: 700;
92
- font-family: var(--font-family-system);
83
+ letter-spacing: 0.2px;
84
+ font-family: var(--font-family-alfasans);
93
85
  }
94
- .typography__small_1u2wm.typography__font_1u2wm {
86
+ .typography__small_u7f55.typography__font_u7f55 {
95
87
  font-size: 24px;
96
88
  line-height: 32px;
97
- font-weight: 500;
98
- font-feature-settings: 'ss01';
99
- font-family: var(--font-family-styrene);
89
+ letter-spacing: 0.39px;
100
90
  }
101
- .typography__regular-small_1u2wm {
91
+ .typography__regular-small_u7f55 {
102
92
  font-size: 22px;
103
93
  line-height: 26px;
104
94
  font-weight: 400;
105
- font-family: var(--font-family-system);
95
+ letter-spacing: -0.8px;
96
+ font-family: var(--font-family-alfasans);
106
97
  }
107
- .typography__regular-small_1u2wm.typography__font_1u2wm {
98
+ .typography__regular-small_u7f55.typography__font_u7f55 {
108
99
  font-size: 24px;
109
100
  line-height: 32px;
110
- font-feature-settings: 'ss01';
111
- font-family: var(--font-family-styrene);
101
+ letter-spacing: -0.9px;
112
102
  }
113
- .typography__xsmall_1u2wm {
103
+ .typography__xsmall_u7f55 {
114
104
  font-size: 18px;
115
105
  line-height: 22px;
116
106
  font-weight: 700;
117
- font-family: var(--font-family-system);
107
+ letter-spacing: 0.38px;
108
+ font-family: var(--font-family-alfasans);
118
109
  }
119
- .typography__xsmall_1u2wm.typography__font_1u2wm {
110
+ .typography__xsmall_u7f55.typography__font_u7f55 {
120
111
  font-size: 20px;
121
112
  line-height: 24px;
122
- font-weight: 500;
123
- font-feature-settings: 'ss01';
124
- font-family: var(--font-family-styrene);
113
+ letter-spacing: 0.33px;
125
114
  }
126
- .typography__regular-xsmall_1u2wm {
115
+ .typography__regular-xsmall_u7f55 {
127
116
  font-size: 18px;
128
117
  line-height: 22px;
129
118
  font-weight: 400;
130
- font-family: var(--font-family-system);
119
+ letter-spacing: -0.36px;
120
+ font-family: var(--font-family-alfasans);
131
121
  }
132
- .typography__regular-xsmall_1u2wm.typography__font_1u2wm {
122
+ .typography__regular-xsmall_u7f55.typography__font_u7f55 {
133
123
  font-size: 20px;
134
124
  line-height: 24px;
135
- font-feature-settings: 'ss01';
136
- font-family: var(--font-family-styrene);
125
+ letter-spacing: -0.68px;
137
126
  }
138
- .typography__component_1u2wm.typography__margins-xlarge_1u2wm {
127
+ .typography__component_u7f55.typography__margins-xlarge_u7f55 {
139
128
  margin: var(--gap-0) var(--gap-0) var(--gap-24);
140
129
  }
141
- .typography__component_1u2wm.typography__margins-large_1u2wm {
130
+ .typography__component_u7f55.typography__margins-large_u7f55 {
142
131
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
143
132
  }
144
- .typography__component_1u2wm.typography__margins-medium_1u2wm {
133
+ .typography__component_u7f55.typography__margins-medium_u7f55 {
145
134
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
146
135
  }
147
- .typography__component_1u2wm.typography__margins-small_1u2wm {
136
+ .typography__component_u7f55.typography__margins-small_u7f55 {
148
137
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
149
138
  }
150
- .typography__component_1u2wm.typography__margins-xsmall_1u2wm {
139
+ .typography__component_u7f55.typography__margins-xsmall_u7f55 {
151
140
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
152
141
  }
package/modern/title/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"xlarge":"typography__xlarge_1u2wm","font":"typography__font_1u2wm","regular-xlarge":"typography__regular-xlarge_1u2wm","large":"typography__large_1u2wm","regular-large":"typography__regular-large_1u2wm","medium":"typography__medium_1u2wm","regular-medium":"typography__regular-medium_1u2wm","small":"typography__small_1u2wm","regular-small":"typography__regular-small_1u2wm","xsmall":"typography__xsmall_1u2wm","regular-xsmall":"typography__regular-xsmall_1u2wm","component":"typography__component_1u2wm","margins-xlarge":"typography__margins-xlarge_1u2wm","margins-large":"typography__margins-large_1u2wm","margins-medium":"typography__margins-medium_1u2wm","margins-small":"typography__margins-small_1u2wm","margins-xsmall":"typography__margins-xsmall_1u2wm"};
3
+ const styles = {"xlarge":"typography__xlarge_u7f55","font":"typography__font_u7f55","regular-xlarge":"typography__regular-xlarge_u7f55","large":"typography__large_u7f55","regular-large":"typography__regular-large_u7f55","medium":"typography__medium_u7f55","regular-medium":"typography__regular-medium_u7f55","small":"typography__small_u7f55","regular-small":"typography__regular-small_u7f55","xsmall":"typography__xsmall_u7f55","regular-xsmall":"typography__regular-xsmall_u7f55","component":"typography__component_u7f55","margins-xlarge":"typography__margins-xlarge_u7f55","margins-large":"typography__margins-large_u7f55","margins-medium":"typography__margins-medium_u7f55","margins-small":"typography__margins-small_u7f55","margins-xsmall":"typography__margins-xsmall_u7f55"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/title-mobile/index.css CHANGED
@@ -8,129 +8,112 @@
8
8
  --gap-40: var(--gap-3xl);
9
9
  }
10
10
  :root {
11
- --font-family-system:
12
- system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
13
- --font-family-styrene:
14
- 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
15
- sans-serif;
11
+ --font-family-alfasans:
12
+ 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
13
+ Helvetica, sans-serif;
16
14
  }
17
- .typography__xlarge_1iafb {
15
+ .typography__xlarge_4txir {
18
16
  font-size: 34px;
19
17
  line-height: 40px;
20
- font-weight: 600;
21
- font-family: var(--font-family-system);
18
+ font-weight: 500;
19
+ letter-spacing: -0.32px;
20
+ font-family: var(--font-family-alfasans);
22
21
  }
23
- .typography__xlarge_1iafb.typography__font_1iafb {
24
- font-weight: 500;
25
- font-feature-settings: 'ss01';
26
- font-family: var(--font-family-styrene);
22
+ .typography__xlarge_4txir.typography__font_4txir {
27
23
  }
28
- .typography__regular-xlarge_1iafb {
24
+ .typography__regular-xlarge_4txir {
29
25
  font-size: 34px;
30
26
  line-height: 40px;
31
27
  font-weight: 400;
32
- font-family: var(--font-family-system);
28
+ letter-spacing: -1.36px;
29
+ font-family: var(--font-family-alfasans);
33
30
  }
34
- .typography__regular-xlarge_1iafb.typography__system_1iafb {
35
- font-feature-settings: 'ss01';
36
- font-family: var(--font-family-styrene);
31
+ .typography__regular-xlarge_4txir.typography__system_4txir {
37
32
  }
38
- .typography__large_1iafb {
33
+ .typography__large_4txir {
39
34
  font-size: 30px;
40
35
  line-height: 36px;
41
- font-weight: 600;
42
- font-family: var(--font-family-system);
36
+ font-weight: 500;
37
+ letter-spacing: -0.25px;
38
+ font-family: var(--font-family-alfasans);
43
39
  }
44
- .typography__large_1iafb.typography__font_1iafb {
45
- font-weight: 500;
46
- font-feature-settings: 'ss01';
47
- font-family: var(--font-family-styrene);
40
+ .typography__large_4txir.typography__font_4txir {
48
41
  }
49
- .typography__regular-large_1iafb {
42
+ .typography__regular-large_4txir {
50
43
  font-size: 30px;
51
44
  line-height: 36px;
52
45
  font-weight: 400;
53
- font-family: var(--font-family-system);
46
+ letter-spacing: -1.25px;
47
+ font-family: var(--font-family-alfasans);
54
48
  }
55
- .typography__regular-large_1iafb.typography__system_1iafb {
56
- font-feature-settings: 'ss01';
57
- font-family: var(--font-family-styrene);
49
+ .typography__regular-large_4txir.typography__system_4txir {
58
50
  }
59
- .typography__medium_1iafb {
51
+ .typography__medium_4txir {
60
52
  font-size: 26px;
61
53
  line-height: 32px;
62
- font-weight: 600;
63
- font-family: var(--font-family-system);
54
+ font-weight: 500;
55
+ letter-spacing: -0.25px;
56
+ font-family: var(--font-family-alfasans);
64
57
  }
65
- .typography__medium_1iafb.typography__font_1iafb {
66
- font-weight: 500;
67
- font-feature-settings: 'ss01';
68
- font-family: var(--font-family-styrene);
58
+ .typography__medium_4txir.typography__font_4txir {
69
59
  }
70
- .typography__regular-medium_1iafb {
60
+ .typography__regular-medium_4txir {
71
61
  font-size: 26px;
72
62
  line-height: 32px;
73
63
  font-weight: 400;
74
- font-family: var(--font-family-system);
64
+ letter-spacing: -1px;
65
+ font-family: var(--font-family-alfasans);
75
66
  }
76
- .typography__regular-medium_1iafb.typography__system_1iafb {
77
- font-feature-settings: 'ss01';
78
- font-family: var(--font-family-styrene);
67
+ .typography__regular-medium_4txir.typography__system_4txir {
79
68
  }
80
- .typography__small_1iafb {
69
+ .typography__small_4txir {
81
70
  font-size: 20px;
82
71
  line-height: 28px;
83
- font-weight: 600;
84
- font-family: var(--font-family-system);
72
+ font-weight: 500;
73
+ letter-spacing: -0.15px;
74
+ font-family: var(--font-family-alfasans);
85
75
  }
86
- .typography__small_1iafb.typography__font_1iafb {
87
- font-weight: 500;
88
- font-feature-settings: 'ss01';
89
- font-family: var(--font-family-styrene);
76
+ .typography__small_4txir.typography__font_4txir {
90
77
  }
91
- .typography__regular-small_1iafb {
78
+ .typography__regular-small_4txir {
92
79
  font-size: 20px;
93
80
  line-height: 28px;
94
81
  font-weight: 400;
95
- font-family: var(--font-family-system);
82
+ letter-spacing: -0.68px;
83
+ font-family: var(--font-family-alfasans);
96
84
  }
97
- .typography__regular-small_1iafb.typography__system_1iafb {
98
- font-feature-settings: 'ss01';
99
- font-family: var(--font-family-styrene);
85
+ .typography__regular-small_4txir.typography__system_4txir {
100
86
  }
101
- .typography__xsmall_1iafb {
87
+ .typography__xsmall_4txir {
102
88
  font-size: 16px;
103
89
  line-height: 20px;
104
- font-weight: 600;
105
- font-family: var(--font-family-system);
90
+ font-weight: 500;
91
+ letter-spacing: 0.17px;
92
+ font-family: var(--font-family-alfasans);
106
93
  }
107
- .typography__xsmall_1iafb.typography__font_1iafb {
108
- font-weight: 500;
109
- font-feature-settings: 'ss01';
110
- font-family: var(--font-family-styrene);
94
+ .typography__xsmall_4txir.typography__font_4txir {
111
95
  }
112
- .typography__regular-xsmall_1iafb {
96
+ .typography__regular-xsmall_4txir {
113
97
  font-size: 16px;
114
98
  line-height: 20px;
115
99
  font-weight: 400;
116
- font-family: var(--font-family-system);
100
+ letter-spacing: -0.24px;
101
+ font-family: var(--font-family-alfasans);
117
102
  }
118
- .typography__regular-xsmall_1iafb.typography__system_1iafb {
119
- font-feature-settings: 'ss01';
120
- font-family: var(--font-family-styrene);
103
+ .typography__regular-xsmall_4txir.typography__system_4txir {
121
104
  }
122
- .typography__component_1iafb.typography__margins-xlarge_1iafb {
105
+ .typography__component_4txir.typography__margins-xlarge_4txir {
123
106
  margin: var(--gap-0) var(--gap-0) var(--gap-24);
124
107
  }
125
- .typography__component_1iafb.typography__margins-large_1iafb {
108
+ .typography__component_4txir.typography__margins-large_4txir {
126
109
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
127
110
  }
128
- .typography__component_1iafb.typography__margins-medium_1iafb {
111
+ .typography__component_4txir.typography__margins-medium_4txir {
129
112
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
130
113
  }
131
- .typography__component_1iafb.typography__margins-small_1iafb {
114
+ .typography__component_4txir.typography__margins-small_4txir {
132
115
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
133
116
  }
134
- .typography__component_1iafb .typography__margins-xsmall_1iafb {
117
+ .typography__component_4txir .typography__margins-xsmall_4txir {
135
118
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
136
119
  }
package/modern/title-mobile/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"xlarge":"typography__xlarge_1iafb","font":"typography__font_1iafb","regular-xlarge":"typography__regular-xlarge_1iafb","system":"typography__system_1iafb","large":"typography__large_1iafb","regular-large":"typography__regular-large_1iafb","medium":"typography__medium_1iafb","regular-medium":"typography__regular-medium_1iafb","small":"typography__small_1iafb","regular-small":"typography__regular-small_1iafb","xsmall":"typography__xsmall_1iafb","regular-xsmall":"typography__regular-xsmall_1iafb","component":"typography__component_1iafb","margins-xlarge":"typography__margins-xlarge_1iafb","margins-large":"typography__margins-large_1iafb","margins-medium":"typography__margins-medium_1iafb","margins-small":"typography__margins-small_1iafb","margins-xsmall":"typography__margins-xsmall_1iafb"};
3
+ const styles = {"xlarge":"typography__xlarge_4txir","font":"typography__font_4txir","regular-xlarge":"typography__regular-xlarge_4txir","system":"typography__system_4txir","large":"typography__large_4txir","regular-large":"typography__regular-large_4txir","medium":"typography__medium_4txir","regular-medium":"typography__regular-medium_4txir","small":"typography__small_4txir","regular-small":"typography__regular-small_4txir","xsmall":"typography__xsmall_4txir","regular-xsmall":"typography__regular-xsmall_4txir","component":"typography__component_4txir","margins-xlarge":"typography__margins-xlarge_4txir","margins-large":"typography__margins-large_4txir","margins-medium":"typography__margins-medium_4txir","margins-small":"typography__margins-small_4txir","margins-xsmall":"typography__margins-xsmall_4txir"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/moderncssm/text/index.module.css CHANGED
@@ -20,15 +20,18 @@
20
20
  font-size: 16px;
21
21
  line-height: 20px;
22
22
  font-weight: 400;
23
- font-family: var(--font-family-system);
23
+ letter-spacing: -0.24px;
24
+ font-family: var(--font-family-alfasans);
24
25
  }
25
26
 
26
27
  .component.bold {
27
28
  font-weight: 700;
29
+ letter-spacing: 0.43px;
28
30
  }
29
31
 
30
32
  .component.medium {
31
33
  font-weight: 500;
34
+ letter-spacing: -0.05px;
32
35
  }
33
36
 
34
37
  .caps {
@@ -37,7 +40,7 @@
37
40
  font-weight: 400;
38
41
  letter-spacing: 1.25px;
39
42
  text-transform: uppercase;
40
- font-family: var(--font-family-system);
43
+ font-family: var(--font-family-alfasans);
41
44
  }
42
45
 
43
46
  .caps.bold {
@@ -54,7 +57,7 @@
54
57
  font-weight: 400;
55
58
  letter-spacing: 1.25px;
56
59
  text-transform: uppercase;
57
- font-family: var(--font-family-system);
60
+ font-family: var(--font-family-alfasans);
58
61
  }
59
62
 
60
63
  .tagline.bold {
@@ -69,120 +72,143 @@
69
72
  font-size: 18px;
70
73
  line-height: 24px;
71
74
  font-weight: 400;
72
- font-family: var(--font-family-system);
75
+ letter-spacing: -0.36px;
76
+ font-family: var(--font-family-alfasans);
73
77
  }
74
78
 
75
79
  .primary-large.bold {
76
80
  font-weight: 700;
81
+ letter-spacing: 0.38px;
77
82
  }
78
83
 
79
84
  .primary-large.medium {
80
85
  font-weight: 500;
86
+ letter-spacing: -0.17px;
81
87
  }
82
88
 
83
89
  .primary-medium {
84
90
  font-size: 16px;
85
91
  line-height: 24px;
86
92
  font-weight: 400;
87
- font-family: var(--font-family-system);
93
+ letter-spacing: -0.24px;
94
+ font-family: var(--font-family-alfasans);
88
95
  }
89
96
 
90
97
  .primary-medium.bold {
91
98
  font-weight: 700;
99
+ letter-spacing: 0.43px;
92
100
  }
93
101
 
94
102
  .primary-medium.medium {
95
103
  font-weight: 500;
104
+ letter-spacing: -0.05px;
96
105
  }
97
106
 
98
107
  .primary-small {
99
108
  font-size: 14px;
100
109
  line-height: 20px;
101
110
  font-weight: 400;
102
- font-family: var(--font-family-system);
111
+ letter-spacing: -0.08px;
112
+ font-family: var(--font-family-alfasans);
103
113
  }
104
114
 
105
115
  .primary-small.bold {
106
116
  font-weight: 700;
117
+ letter-spacing: 0.47px;
107
118
  }
108
119
 
109
120
  .primary-small.medium {
110
121
  font-weight: 500;
122
+ letter-spacing: 0.07px;
111
123
  }
112
124
 
113
125
  .component-primary {
114
126
  font-size: 16px;
115
127
  line-height: 20px;
116
128
  font-weight: 400;
117
- font-family: var(--font-family-system);
129
+ letter-spacing: -0.24px;
130
+ font-family: var(--font-family-alfasans);
118
131
  }
119
132
 
120
133
  .component-primary.bold {
121
134
  font-weight: 700;
135
+ letter-spacing: 0.43px;
122
136
  }
123
137
 
124
138
  .component-primary.medium {
125
139
  font-weight: 500;
140
+ letter-spacing: -0.05px;
126
141
  }
127
142
 
128
143
  .secondary-large {
129
144
  font-size: 13px;
130
145
  line-height: 16px;
131
146
  font-weight: 400;
132
- font-family: var(--font-family-system);
147
+ font-family: var(--font-family-alfasans);
133
148
  }
134
149
 
135
150
  .secondary-large.bold {
136
151
  font-weight: 700;
152
+ letter-spacing: 0.54px;
137
153
  }
138
154
 
139
155
  .secondary-large.medium {
140
156
  font-weight: 500;
157
+ letter-spacing: 0.13px;
141
158
  }
142
159
 
143
160
  .secondary-medium {
144
161
  font-size: 12px;
145
162
  line-height: 16px;
146
163
  font-weight: 400;
147
- font-family: var(--font-family-system);
164
+ letter-spacing: 0.06px;
165
+ font-family: var(--font-family-alfasans);
148
166
  }
149
167
 
150
168
  .secondary-medium.bold {
151
169
  font-weight: 700;
170
+ letter-spacing: 0.57px;
152
171
  }
153
172
 
154
173
  .secondary-medium.medium {
155
174
  font-weight: 500;
175
+ letter-spacing: 0.19px;
156
176
  }
157
177
 
158
178
  .secondary-small {
159
179
  font-size: 11px;
160
180
  line-height: 16px;
161
181
  font-weight: 400;
162
- font-family: var(--font-family-system);
182
+ letter-spacing: 0.15px;
183
+ font-family: var(--font-family-alfasans);
163
184
  }
164
185
 
165
186
  .secondary-small.bold {
166
187
  font-weight: 700;
188
+ letter-spacing: 0.54px;
167
189
  }
168
190
 
169
191
  .secondary-small.medium {
170
192
  font-weight: 500;
193
+ letter-spacing: 0.24px;
171
194
  }
172
195
 
173
196
  .component-secondary {
174
197
  font-size: 14px;
175
198
  line-height: 18px;
176
199
  font-weight: 400;
177
- font-family: var(--font-family-system);
200
+ letter-spacing: -0.08px;
201
+ font-family: var(--font-family-alfasans);
178
202
  }
179
203
 
180
204
  .component-secondary.bold {
181
205
  font-weight: 700;
206
+ letter-spacing: 0.47px;
182
207
  }
183
208
 
184
209
  .component-secondary.medium {
185
210
  font-weight: 500;
211
+ letter-spacing: 0.07px;
186
212
  }
187
213
 
188
214
  .rowLimit1 {