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

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 +13 -40
  4. package/cssm/title/index.module.css +40 -29
  5. package/cssm/title-mobile/index.module.css +45 -28
  6. package/esm/colors.css +20 -20
  7. package/esm/colors.module.css.js +1 -1
  8. package/esm/text/index.css +53 -80
  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 +65 -54
  13. package/esm/title/index.module.css.js +1 -1
  14. package/esm/title-mobile/index.css +70 -53
  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 +53 -80
  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 +65 -54
  23. package/modern/title/index.module.css.js +1 -1
  24. package/modern/title-mobile/index.css +70 -53
  25. package/modern/title-mobile/index.module.css.js +1 -1
  26. package/moderncssm/text/index.module.css +11 -37
  27. package/moderncssm/title/index.module.css +35 -26
  28. package/moderncssm/title-mobile/index.module.css +40 -25
  29. package/package.json +6 -6
  30. package/text/index.css +53 -80
  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 +65 -54
  35. package/title/index.module.css.js +1 -1
  36. package/title-mobile/index.css +70 -53
  37. package/title-mobile/index.module.css.js +1 -1
package/title/index.css CHANGED
@@ -10,132 +10,143 @@
10
10
  --gap-48: var(--gap-4xl);
11
11
  }
12
12
  :root {
13
- --font-family-alfasans:
14
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
15
- Helvetica, sans-serif;
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;
16
18
  }
17
- .typography__xlarge_eq9mm {
19
+ .typography__xlarge_1am21 {
18
20
  font-size: 48px;
19
21
  line-height: 52px;
20
22
  font-weight: 700;
21
- letter-spacing: 0.1px;
22
- font-family: var(--font-family-alfasans);
23
+ font-family: var(--font-family-system);
23
24
  }
24
- .typography__xlarge_eq9mm.typography__font_eq9mm {
25
+ .typography__xlarge_1am21.typography__font_1am21 {
25
26
  line-height: 64px;
27
+ font-weight: 500;
28
+ font-feature-settings: 'ss01';
29
+ font-family: var(--font-family-styrene);
26
30
  }
27
- .typography__regular-xlarge_eq9mm {
31
+ .typography__regular-xlarge_1am21 {
28
32
  font-size: 48px;
29
33
  line-height: 52px;
30
34
  font-weight: 400;
31
- letter-spacing: -2.1px;
32
- font-family: var(--font-family-alfasans);
35
+ font-family: var(--font-family-system);
33
36
  }
34
- .typography__regular-xlarge_eq9mm.typography__font_eq9mm {
37
+ .typography__regular-xlarge_1am21.typography__font_1am21 {
35
38
  line-height: 64px;
39
+ font-feature-settings: 'ss01';
40
+ font-family: var(--font-family-styrene);
36
41
  }
37
- .typography__large_eq9mm {
42
+ .typography__large_1am21 {
38
43
  font-size: 40px;
39
44
  line-height: 48px;
40
45
  font-weight: 700;
41
- letter-spacing: 0.1px;
42
- font-family: var(--font-family-alfasans);
46
+ font-family: var(--font-family-system);
43
47
  }
44
- .typography__large_eq9mm.typography__font_eq9mm {
48
+ .typography__large_1am21.typography__font_1am21 {
49
+ font-weight: 500;
50
+ font-feature-settings: 'ss01';
51
+ font-family: var(--font-family-styrene);
45
52
  }
46
- .typography__regular-large_eq9mm {
53
+ .typography__regular-large_1am21 {
47
54
  font-size: 40px;
48
55
  line-height: 48px;
49
56
  font-weight: 400;
50
- letter-spacing: -1.7px;
51
- font-family: var(--font-family-alfasans);
57
+ font-family: var(--font-family-system);
52
58
  }
53
- .typography__regular-large_eq9mm.typography__font_eq9mm {
59
+ .typography__regular-large_1am21.typography__font_1am21 {
60
+ font-feature-settings: 'ss01';
61
+ font-family: var(--font-family-styrene);
54
62
  }
55
- .typography__medium_eq9mm {
63
+ .typography__medium_1am21 {
56
64
  font-size: 30px;
57
65
  line-height: 36px;
58
66
  font-weight: 700;
59
- letter-spacing: 0.1px;
60
- font-family: var(--font-family-alfasans);
67
+ font-family: var(--font-family-system);
61
68
  }
62
- .typography__medium_eq9mm.typography__font_eq9mm {
69
+ .typography__medium_1am21.typography__font_1am21 {
63
70
  font-size: 32px;
64
71
  line-height: 40px;
65
- letter-spacing: 0.3px;
72
+ font-weight: 500;
73
+ font-feature-settings: 'ss01';
74
+ font-family: var(--font-family-styrene);
66
75
  }
67
- .typography__regular-medium_eq9mm {
76
+ .typography__regular-medium_1am21 {
68
77
  font-size: 30px;
69
78
  line-height: 36px;
70
79
  font-weight: 400;
71
- letter-spacing: -1.25px;
72
- font-family: var(--font-family-alfasans);
80
+ font-family: var(--font-family-system);
73
81
  }
74
- .typography__regular-medium_eq9mm.typography__font_eq9mm {
82
+ .typography__regular-medium_1am21.typography__font_1am21 {
75
83
  font-size: 32px;
76
84
  line-height: 40px;
77
- letter-spacing: -1.36px;
85
+ font-feature-settings: 'ss01';
86
+ font-family: var(--font-family-styrene);
78
87
  }
79
- .typography__small_eq9mm {
88
+ .typography__small_1am21 {
80
89
  font-size: 22px;
81
90
  line-height: 26px;
82
91
  font-weight: 700;
83
- letter-spacing: 0.2px;
84
- font-family: var(--font-family-alfasans);
92
+ font-family: var(--font-family-system);
85
93
  }
86
- .typography__small_eq9mm.typography__font_eq9mm {
94
+ .typography__small_1am21.typography__font_1am21 {
87
95
  font-size: 24px;
88
96
  line-height: 32px;
89
- letter-spacing: 0.39px;
97
+ font-weight: 500;
98
+ font-feature-settings: 'ss01';
99
+ font-family: var(--font-family-styrene);
90
100
  }
91
- .typography__regular-small_eq9mm {
101
+ .typography__regular-small_1am21 {
92
102
  font-size: 22px;
93
103
  line-height: 26px;
94
104
  font-weight: 400;
95
- letter-spacing: -0.8px;
96
- font-family: var(--font-family-alfasans);
105
+ font-family: var(--font-family-system);
97
106
  }
98
- .typography__regular-small_eq9mm.typography__font_eq9mm {
107
+ .typography__regular-small_1am21.typography__font_1am21 {
99
108
  font-size: 24px;
100
109
  line-height: 32px;
101
- letter-spacing: -0.9px;
110
+ font-feature-settings: 'ss01';
111
+ font-family: var(--font-family-styrene);
102
112
  }
103
- .typography__xsmall_eq9mm {
113
+ .typography__xsmall_1am21 {
104
114
  font-size: 18px;
105
115
  line-height: 22px;
106
116
  font-weight: 700;
107
- letter-spacing: 0.38px;
108
- font-family: var(--font-family-alfasans);
117
+ font-family: var(--font-family-system);
109
118
  }
110
- .typography__xsmall_eq9mm.typography__font_eq9mm {
119
+ .typography__xsmall_1am21.typography__font_1am21 {
111
120
  font-size: 20px;
112
121
  line-height: 24px;
113
- letter-spacing: 0.33px;
122
+ font-weight: 500;
123
+ font-feature-settings: 'ss01';
124
+ font-family: var(--font-family-styrene);
114
125
  }
115
- .typography__regular-xsmall_eq9mm {
126
+ .typography__regular-xsmall_1am21 {
116
127
  font-size: 18px;
117
128
  line-height: 22px;
118
129
  font-weight: 400;
119
- letter-spacing: -0.36px;
120
- font-family: var(--font-family-alfasans);
130
+ font-family: var(--font-family-system);
121
131
  }
122
- .typography__regular-xsmall_eq9mm.typography__font_eq9mm {
132
+ .typography__regular-xsmall_1am21.typography__font_1am21 {
123
133
  font-size: 20px;
124
134
  line-height: 24px;
125
- letter-spacing: -0.68px;
135
+ font-feature-settings: 'ss01';
136
+ font-family: var(--font-family-styrene);
126
137
  }
127
- .typography__component_eq9mm.typography__margins-xlarge_eq9mm {
138
+ .typography__component_1am21.typography__margins-xlarge_1am21 {
128
139
  margin: var(--gap-0) var(--gap-0) var(--gap-24);
129
140
  }
130
- .typography__component_eq9mm.typography__margins-large_eq9mm {
141
+ .typography__component_1am21.typography__margins-large_1am21 {
131
142
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
132
143
  }
133
- .typography__component_eq9mm.typography__margins-medium_eq9mm {
144
+ .typography__component_1am21.typography__margins-medium_1am21 {
134
145
  margin: var(--gap-48) var(--gap-0) var(--gap-24);
135
146
  }
136
- .typography__component_eq9mm.typography__margins-small_eq9mm {
147
+ .typography__component_1am21.typography__margins-small_1am21 {
137
148
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
138
149
  }
139
- .typography__component_eq9mm.typography__margins-xsmall_eq9mm {
150
+ .typography__component_1am21.typography__margins-xsmall_1am21 {
140
151
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
141
152
  }
package/title/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"xlarge":"typography__xlarge_eq9mm","font":"typography__font_eq9mm","regular-xlarge":"typography__regular-xlarge_eq9mm","large":"typography__large_eq9mm","regular-large":"typography__regular-large_eq9mm","medium":"typography__medium_eq9mm","regular-medium":"typography__regular-medium_eq9mm","small":"typography__small_eq9mm","regular-small":"typography__regular-small_eq9mm","xsmall":"typography__xsmall_eq9mm","regular-xsmall":"typography__regular-xsmall_eq9mm","component":"typography__component_eq9mm","margins-xlarge":"typography__margins-xlarge_eq9mm","margins-large":"typography__margins-large_eq9mm","margins-medium":"typography__margins-medium_eq9mm","margins-small":"typography__margins-small_eq9mm","margins-xsmall":"typography__margins-xsmall_eq9mm"};
5
+ var styles = {"xlarge":"typography__xlarge_1am21","font":"typography__font_1am21","regular-xlarge":"typography__regular-xlarge_1am21","large":"typography__large_1am21","regular-large":"typography__regular-large_1am21","medium":"typography__medium_1am21","regular-medium":"typography__regular-medium_1am21","small":"typography__small_1am21","regular-small":"typography__regular-small_1am21","xsmall":"typography__xsmall_1am21","regular-xsmall":"typography__regular-xsmall_1am21","component":"typography__component_1am21","margins-xlarge":"typography__margins-xlarge_1am21","margins-large":"typography__margins-large_1am21","margins-medium":"typography__margins-medium_1am21","margins-small":"typography__margins-small_1am21","margins-xsmall":"typography__margins-xsmall_1am21"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/title-mobile/index.css CHANGED
@@ -8,112 +8,129 @@
8
8
  --gap-40: var(--gap-3xl);
9
9
  }
10
10
  :root {
11
- --font-family-alfasans:
12
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
13
- Helvetica, sans-serif;
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;
14
16
  }
15
- .typography__xlarge_fn50s {
17
+ .typography__xlarge_17h7t {
16
18
  font-size: 34px;
17
19
  line-height: 40px;
18
- font-weight: 500;
19
- letter-spacing: -0.32px;
20
- font-family: var(--font-family-alfasans);
20
+ font-weight: 600;
21
+ font-family: var(--font-family-system);
21
22
  }
22
- .typography__xlarge_fn50s.typography__font_fn50s {
23
+ .typography__xlarge_17h7t.typography__font_17h7t {
24
+ font-weight: 500;
25
+ font-feature-settings: 'ss01';
26
+ font-family: var(--font-family-styrene);
23
27
  }
24
- .typography__regular-xlarge_fn50s {
28
+ .typography__regular-xlarge_17h7t {
25
29
  font-size: 34px;
26
30
  line-height: 40px;
27
31
  font-weight: 400;
28
- letter-spacing: -1.36px;
29
- font-family: var(--font-family-alfasans);
32
+ font-family: var(--font-family-system);
30
33
  }
31
- .typography__regular-xlarge_fn50s.typography__system_fn50s {
34
+ .typography__regular-xlarge_17h7t.typography__system_17h7t {
35
+ font-feature-settings: 'ss01';
36
+ font-family: var(--font-family-styrene);
32
37
  }
33
- .typography__large_fn50s {
38
+ .typography__large_17h7t {
34
39
  font-size: 30px;
35
40
  line-height: 36px;
36
- font-weight: 500;
37
- letter-spacing: -0.25px;
38
- font-family: var(--font-family-alfasans);
41
+ font-weight: 600;
42
+ font-family: var(--font-family-system);
39
43
  }
40
- .typography__large_fn50s.typography__font_fn50s {
44
+ .typography__large_17h7t.typography__font_17h7t {
45
+ font-weight: 500;
46
+ font-feature-settings: 'ss01';
47
+ font-family: var(--font-family-styrene);
41
48
  }
42
- .typography__regular-large_fn50s {
49
+ .typography__regular-large_17h7t {
43
50
  font-size: 30px;
44
51
  line-height: 36px;
45
52
  font-weight: 400;
46
- letter-spacing: -1.25px;
47
- font-family: var(--font-family-alfasans);
53
+ font-family: var(--font-family-system);
48
54
  }
49
- .typography__regular-large_fn50s.typography__system_fn50s {
55
+ .typography__regular-large_17h7t.typography__system_17h7t {
56
+ font-feature-settings: 'ss01';
57
+ font-family: var(--font-family-styrene);
50
58
  }
51
- .typography__medium_fn50s {
59
+ .typography__medium_17h7t {
52
60
  font-size: 26px;
53
61
  line-height: 32px;
54
- font-weight: 500;
55
- letter-spacing: -0.25px;
56
- font-family: var(--font-family-alfasans);
62
+ font-weight: 600;
63
+ font-family: var(--font-family-system);
57
64
  }
58
- .typography__medium_fn50s.typography__font_fn50s {
65
+ .typography__medium_17h7t.typography__font_17h7t {
66
+ font-weight: 500;
67
+ font-feature-settings: 'ss01';
68
+ font-family: var(--font-family-styrene);
59
69
  }
60
- .typography__regular-medium_fn50s {
70
+ .typography__regular-medium_17h7t {
61
71
  font-size: 26px;
62
72
  line-height: 32px;
63
73
  font-weight: 400;
64
- letter-spacing: -1px;
65
- font-family: var(--font-family-alfasans);
74
+ font-family: var(--font-family-system);
66
75
  }
67
- .typography__regular-medium_fn50s.typography__system_fn50s {
76
+ .typography__regular-medium_17h7t.typography__system_17h7t {
77
+ font-feature-settings: 'ss01';
78
+ font-family: var(--font-family-styrene);
68
79
  }
69
- .typography__small_fn50s {
80
+ .typography__small_17h7t {
70
81
  font-size: 20px;
71
82
  line-height: 28px;
72
- font-weight: 500;
73
- letter-spacing: -0.15px;
74
- font-family: var(--font-family-alfasans);
83
+ font-weight: 600;
84
+ font-family: var(--font-family-system);
75
85
  }
76
- .typography__small_fn50s.typography__font_fn50s {
86
+ .typography__small_17h7t.typography__font_17h7t {
87
+ font-weight: 500;
88
+ font-feature-settings: 'ss01';
89
+ font-family: var(--font-family-styrene);
77
90
  }
78
- .typography__regular-small_fn50s {
91
+ .typography__regular-small_17h7t {
79
92
  font-size: 20px;
80
93
  line-height: 28px;
81
94
  font-weight: 400;
82
- letter-spacing: -0.68px;
83
- font-family: var(--font-family-alfasans);
95
+ font-family: var(--font-family-system);
84
96
  }
85
- .typography__regular-small_fn50s.typography__system_fn50s {
97
+ .typography__regular-small_17h7t.typography__system_17h7t {
98
+ font-feature-settings: 'ss01';
99
+ font-family: var(--font-family-styrene);
86
100
  }
87
- .typography__xsmall_fn50s {
101
+ .typography__xsmall_17h7t {
88
102
  font-size: 16px;
89
103
  line-height: 20px;
90
- font-weight: 500;
91
- letter-spacing: 0.17px;
92
- font-family: var(--font-family-alfasans);
104
+ font-weight: 600;
105
+ font-family: var(--font-family-system);
93
106
  }
94
- .typography__xsmall_fn50s.typography__font_fn50s {
107
+ .typography__xsmall_17h7t.typography__font_17h7t {
108
+ font-weight: 500;
109
+ font-feature-settings: 'ss01';
110
+ font-family: var(--font-family-styrene);
95
111
  }
96
- .typography__regular-xsmall_fn50s {
112
+ .typography__regular-xsmall_17h7t {
97
113
  font-size: 16px;
98
114
  line-height: 20px;
99
115
  font-weight: 400;
100
- letter-spacing: -0.24px;
101
- font-family: var(--font-family-alfasans);
116
+ font-family: var(--font-family-system);
102
117
  }
103
- .typography__regular-xsmall_fn50s.typography__system_fn50s {
118
+ .typography__regular-xsmall_17h7t.typography__system_17h7t {
119
+ font-feature-settings: 'ss01';
120
+ font-family: var(--font-family-styrene);
104
121
  }
105
- .typography__component_fn50s.typography__margins-xlarge_fn50s {
122
+ .typography__component_17h7t.typography__margins-xlarge_17h7t {
106
123
  margin: var(--gap-0) var(--gap-0) var(--gap-24);
107
124
  }
108
- .typography__component_fn50s.typography__margins-large_fn50s {
125
+ .typography__component_17h7t.typography__margins-large_17h7t {
109
126
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
110
127
  }
111
- .typography__component_fn50s.typography__margins-medium_fn50s {
128
+ .typography__component_17h7t.typography__margins-medium_17h7t {
112
129
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
113
130
  }
114
- .typography__component_fn50s.typography__margins-small_fn50s {
131
+ .typography__component_17h7t.typography__margins-small_17h7t {
115
132
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
116
133
  }
117
- .typography__component_fn50s .typography__margins-xsmall_fn50s {
134
+ .typography__component_17h7t .typography__margins-xsmall_17h7t {
118
135
  margin: var(--gap-40) var(--gap-0) var(--gap-16);
119
136
  }
package/title-mobile/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"xlarge":"typography__xlarge_fn50s","font":"typography__font_fn50s","regular-xlarge":"typography__regular-xlarge_fn50s","system":"typography__system_fn50s","large":"typography__large_fn50s","regular-large":"typography__regular-large_fn50s","medium":"typography__medium_fn50s","regular-medium":"typography__regular-medium_fn50s","small":"typography__small_fn50s","regular-small":"typography__regular-small_fn50s","xsmall":"typography__xsmall_fn50s","regular-xsmall":"typography__regular-xsmall_fn50s","component":"typography__component_fn50s","margins-xlarge":"typography__margins-xlarge_fn50s","margins-large":"typography__margins-large_fn50s","margins-medium":"typography__margins-medium_fn50s","margins-small":"typography__margins-small_fn50s","margins-xsmall":"typography__margins-xsmall_fn50s"};
5
+ var styles = {"xlarge":"typography__xlarge_17h7t","font":"typography__font_17h7t","regular-xlarge":"typography__regular-xlarge_17h7t","system":"typography__system_17h7t","large":"typography__large_17h7t","regular-large":"typography__regular-large_17h7t","medium":"typography__medium_17h7t","regular-medium":"typography__regular-medium_17h7t","small":"typography__small_17h7t","regular-small":"typography__regular-small_17h7t","xsmall":"typography__xsmall_17h7t","regular-xsmall":"typography__regular-xsmall_17h7t","component":"typography__component_17h7t","margins-xlarge":"typography__margins-xlarge_17h7t","margins-large":"typography__margins-large_17h7t","margins-medium":"typography__margins-medium_17h7t","margins-small":"typography__margins-small_17h7t","margins-xsmall":"typography__margins-xsmall_17h7t"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map