@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/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/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_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"};
5
+ var 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"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/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/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_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"};
5
+ var 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"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map