@alfalab/core-components-tabs 10.0.13-alfasans → 10.0.13

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 (47) hide show
  1. package/components/primary-tablist/index.css +167 -180
  2. package/components/primary-tablist/index.module.css.js +1 -1
  3. package/components/primary-tablist/mobile.css +291 -317
  4. package/components/primary-tablist/mobile.module.css.js +1 -1
  5. package/components/scroll-controls/index.css +11 -11
  6. package/components/scroll-controls/index.module.css.js +1 -1
  7. package/components/scrollable-container/index.css +5 -5
  8. package/components/scrollable-container/index.module.css.js +1 -1
  9. package/components/secondary-tablist/index.css +18 -18
  10. package/components/secondary-tablist/index.module.css.js +1 -1
  11. package/components/secondary-tablist/mobile.css +22 -22
  12. package/components/secondary-tablist/mobile.module.css.js +1 -1
  13. package/components/tab/index.css +2 -2
  14. package/components/tab/index.module.css.js +1 -1
  15. package/cssm/components/primary-tablist/index.module.css +35 -48
  16. package/cssm/components/primary-tablist/mobile.module.css +35 -48
  17. package/esm/components/primary-tablist/index.css +167 -180
  18. package/esm/components/primary-tablist/index.module.css.js +1 -1
  19. package/esm/components/primary-tablist/mobile.css +291 -317
  20. package/esm/components/primary-tablist/mobile.module.css.js +1 -1
  21. package/esm/components/scroll-controls/index.css +11 -11
  22. package/esm/components/scroll-controls/index.module.css.js +1 -1
  23. package/esm/components/scrollable-container/index.css +5 -5
  24. package/esm/components/scrollable-container/index.module.css.js +1 -1
  25. package/esm/components/secondary-tablist/index.css +18 -18
  26. package/esm/components/secondary-tablist/index.module.css.js +1 -1
  27. package/esm/components/secondary-tablist/mobile.css +22 -22
  28. package/esm/components/secondary-tablist/mobile.module.css.js +1 -1
  29. package/esm/components/tab/index.css +2 -2
  30. package/esm/components/tab/index.module.css.js +1 -1
  31. package/modern/components/primary-tablist/index.css +167 -180
  32. package/modern/components/primary-tablist/index.module.css.js +1 -1
  33. package/modern/components/primary-tablist/mobile.css +291 -317
  34. package/modern/components/primary-tablist/mobile.module.css.js +1 -1
  35. package/modern/components/scroll-controls/index.css +11 -11
  36. package/modern/components/scroll-controls/index.module.css.js +1 -1
  37. package/modern/components/scrollable-container/index.css +5 -5
  38. package/modern/components/scrollable-container/index.module.css.js +1 -1
  39. package/modern/components/secondary-tablist/index.css +18 -18
  40. package/modern/components/secondary-tablist/index.module.css.js +1 -1
  41. package/modern/components/secondary-tablist/mobile.css +22 -22
  42. package/modern/components/secondary-tablist/mobile.module.css.js +1 -1
  43. package/modern/components/tab/index.css +2 -2
  44. package/modern/components/tab/index.module.css.js +1 -1
  45. package/moderncssm/components/primary-tablist/index.module.css +30 -45
  46. package/moderncssm/components/primary-tablist/mobile.module.css +30 -45
  47. package/package.json +12 -12
package/cssm/components/primary-tablist/mobile.module.css CHANGED
@@ -6,9 +6,11 @@
6
6
  --gap-24: var(--gap-xl);
7
7
  }
8
8
  :root {
9
- --font-family-alfasans:
10
- 'Alfa Interface Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
11
- Helvetica, sans-serif;
9
+ --font-family-system:
10
+ system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica, sans-serif;
11
+ --font-family-styrene:
12
+ 'Styrene UI', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Helvetica,
13
+ sans-serif;
12
14
  }
13
15
  :root {
14
16
  --primary-tablist-mobile-gaps: var(--gap-24);
@@ -27,64 +29,55 @@
27
29
  font-size: 18px;
28
30
  line-height: 24px;
29
31
  font-weight: 400;
30
- letter-spacing: -0.36px;
31
- font-family: var(--font-family-alfasans);
32
+ font-family: var(--font-family-system);
32
33
  }
33
34
  .mobile.paragraph-primary-medium .title {
34
35
  font-size: 16px;
35
36
  line-height: 24px;
36
37
  font-weight: 400;
37
- letter-spacing: -0.24px;
38
- font-family: var(--font-family-alfasans);
38
+ font-family: var(--font-family-system);
39
39
  }
40
40
  .mobile.paragraph-primary-small .title {
41
41
  font-size: 14px;
42
42
  line-height: 20px;
43
43
  font-weight: 400;
44
- letter-spacing: -0.08px;
45
- font-family: var(--font-family-alfasans);
44
+ font-family: var(--font-family-system);
46
45
  }
47
46
  .mobile.action-primary-large .title {
48
47
  font-size: 18px;
49
48
  line-height: 24px;
50
49
  font-weight: 500;
51
- letter-spacing: -0.17px;
52
- font-family: var(--font-family-alfasans);
50
+ font-family: var(--font-family-system);
53
51
  }
54
52
  .mobile.action-primary-medium .title {
55
53
  font-size: 16px;
56
54
  line-height: 24px;
57
55
  font-weight: 500;
58
- letter-spacing: -0.05px;
59
- font-family: var(--font-family-alfasans);
56
+ font-family: var(--font-family-system);
60
57
  }
61
58
  .mobile.action-primary-small .title {
62
59
  font-size: 14px;
63
60
  line-height: 20px;
64
61
  font-weight: 500;
65
- letter-spacing: 0.07px;
66
- font-family: var(--font-family-alfasans);
62
+ font-family: var(--font-family-system);
67
63
  }
68
64
  .mobile.accent-primary-large .title {
69
65
  font-size: 18px;
70
66
  line-height: 24px;
71
67
  font-weight: 700;
72
- letter-spacing: 0.38px;
73
- font-family: var(--font-family-alfasans);
68
+ font-family: var(--font-family-system);
74
69
  }
75
70
  .mobile.accent-primary-medium .title {
76
71
  font-size: 16px;
77
72
  line-height: 24px;
78
73
  font-weight: 700;
79
- letter-spacing: 0.43px;
80
- font-family: var(--font-family-alfasans);
74
+ font-family: var(--font-family-system);
81
75
  }
82
76
  .mobile.accent-primary-small .title {
83
77
  font-size: 14px;
84
78
  line-height: 20px;
85
79
  font-weight: 700;
86
- letter-spacing: 0.47px;
87
- font-family: var(--font-family-alfasans);
80
+ font-family: var(--font-family-system);
88
81
  }
89
82
  .mobile.paragraph-primary-large .title, .mobile.paragraph-primary-medium .title, .mobile.accent-primary-large .title, .mobile.accent-primary-medium .title, .mobile.action-primary-large .title, .mobile.action-primary-medium .title {
90
83
  padding-bottom: calc(24px / 2);
@@ -141,72 +134,67 @@
141
134
  .mobile.headline-system-xlarge .title {
142
135
  font-size: 34px;
143
136
  line-height: 40px;
144
- font-weight: 500;
145
- letter-spacing: -0.32px;
146
- font-family: var(--font-family-alfasans);
137
+ font-weight: 600;
138
+ font-family: var(--font-family-system);
147
139
  }
148
140
  .mobile.headline-system-large .title {
149
141
  font-size: 30px;
150
142
  line-height: 36px;
151
- font-weight: 500;
152
- letter-spacing: -0.25px;
153
- font-family: var(--font-family-alfasans);
143
+ font-weight: 600;
144
+ font-family: var(--font-family-system);
154
145
  }
155
146
  .mobile.headline-system-medium .title {
156
147
  font-size: 26px;
157
148
  line-height: 32px;
158
- font-weight: 500;
159
- letter-spacing: -0.25px;
160
- font-family: var(--font-family-alfasans);
149
+ font-weight: 600;
150
+ font-family: var(--font-family-system);
161
151
  }
162
152
  .mobile.headline-system-small .title {
163
153
  font-size: 20px;
164
154
  line-height: 28px;
165
- font-weight: 500;
166
- letter-spacing: -0.15px;
167
- font-family: var(--font-family-alfasans);
155
+ font-weight: 600;
156
+ font-family: var(--font-family-system);
168
157
  }
169
158
  .mobile.headline-system-xsmall .title {
170
159
  font-size: 16px;
171
160
  line-height: 20px;
172
- font-weight: 500;
173
- letter-spacing: 0.17px;
174
- font-family: var(--font-family-alfasans);
161
+ font-weight: 600;
162
+ font-family: var(--font-family-system);
175
163
  }
176
164
  .mobile.headline-xlarge .title {
177
165
  font-size: 34px;
178
166
  line-height: 40px;
179
167
  font-weight: 500;
180
- letter-spacing: -0.32px;
181
- font-family: var(--font-family-alfasans);
168
+ font-feature-settings: 'ss01';
169
+ font-family: var(--font-family-styrene);
182
170
  }
183
171
  .mobile.headline-large .title {
184
172
  font-size: 30px;
185
173
  line-height: 36px;
186
174
  font-weight: 500;
187
- letter-spacing: -0.25px;
188
- font-family: var(--font-family-alfasans);
175
+ font-feature-settings: 'ss01';
176
+ font-family: var(--font-family-styrene);
189
177
  }
190
178
  .mobile.headline-medium .title {
191
179
  font-size: 26px;
192
180
  line-height: 32px;
193
181
  font-weight: 500;
194
- letter-spacing: -0.25px;
195
- font-family: var(--font-family-alfasans);
182
+ font-feature-settings: 'ss01';
183
+ font-family: var(--font-family-styrene);
196
184
  }
197
185
  .mobile.headline-small .title {
198
186
  font-size: 20px;
199
187
  line-height: 28px;
200
188
  font-weight: 500;
201
- letter-spacing: -0.15px;
202
- font-family: var(--font-family-alfasans);
189
+ font-feature-settings: 'ss01';
190
+ font-family: var(--font-family-styrene);
203
191
  }
204
192
  .mobile.headline-xsmall .title {
205
193
  font-size: 16px;
206
194
  line-height: 20px;
207
195
  font-weight: 500;
208
- letter-spacing: 0.17px;
209
- font-family: var(--font-family-alfasans);
196
+ font-feature-settings: 'ss01';
197
+ font-family: var(--font-family-styrene);
210
198
  }
211
199
  .mobile.headline-system-xlarge .title, .mobile.headline-xlarge .title {
212
200
  padding-bottom: calc(40px / 2);
@@ -317,6 +305,5 @@
317
305
  font-size: 16px;
318
306
  line-height: 24px;
319
307
  font-weight: 400;
320
- letter-spacing: -0.24px;
321
- font-family: var(--font-family-alfasans);
308
+ font-family: var(--font-family-system);
322
309
  }