@rescui/typography 0.21.1-RUI-230-Update-icons-0bd4e5fc.9 → 0.22.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 (8) hide show
  1. package/lib/index-moduled.css +310 -252
  2. package/lib/index-moduled.p.module.css.js +120 -120
  3. package/lib/index.css +195 -137
  4. package/lib/mixins.p.css +400 -278
  5. package/lib/mixins.pcss +400 -278
  6. package/lib/public-api.p.css +819 -407
  7. package/lib/public-api.pcss +819 -407
  8. package/package.json +6 -6
package/lib/mixins.pcss CHANGED
@@ -8,7 +8,13 @@
8
8
  @define-mixin rs-typography-dark{
9
9
  }
10
10
  @define-mixin rs-super-hero-base{
11
- --_rs-typography-letter-spacing:var(--rs-super-hero-letter-spacing, -0.02em);
11
+ --_rs-typography-letter-spacing:var(
12
+ --_rs-typography-super-hero-sm-letter-spacing,
13
+ var(
14
+ --_rs-typography-super-hero-md-letter-spacing,
15
+ var(--rs-super-hero-letter-spacing, -0.02em)
16
+ )
17
+ );
12
18
  --_rs-typography-text-transform:initial;
13
19
  --_rs-typography-font-variant-numeric:initial;
14
20
  --_rs-typography-font-family:var(
@@ -18,16 +24,22 @@
18
24
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
19
25
  );
20
26
  --_rs-typography-font-size:var(
21
- --rs-super-hero-font-size,
22
- 142px
27
+ --_rs-typography-super-hero-sm-font-size,
28
+ var(
29
+ --_rs-typography-super-hero-md-font-size,
30
+ var(--rs-super-hero-font-size, 142px)
31
+ )
23
32
  );
24
33
  --_rs-typography-font-weight:var(
25
34
  --rs-font-weight-semi-bold,
26
35
  600
27
36
  );
28
37
  --_rs-typography-line-height:var(
29
- --rs-super-hero-line-height,
30
- 142px
38
+ --_rs-typography-super-hero-sm-line-height,
39
+ var(
40
+ --_rs-typography-super-hero-md-line-height,
41
+ var(--rs-super-hero-line-height, 142px)
42
+ )
31
43
  );
32
44
  --_rs-typography-base-color:var(
33
45
  --_rs-typography-heading-hardness-color,
@@ -42,38 +54,39 @@
42
54
  --_rs-typography-list-li-margin-top-from-text:initial;
43
55
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
44
56
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
45
- --_rs-typography-link-border-bottom-width-from-text:4px;
57
+ --_rs-typography-link-border-bottom-width-from-text:var(
58
+ --_rs-typography-super-hero-sm-link-border-bottom-width-from-text,
59
+ var(--_rs-typography-super-hero-md-link-border-bottom-width-from-text, 4px)
60
+ );
46
61
  @media screen and (max-width: 1000px){
47
- --_rs-typography-font-size:var(
48
- --rs-middle-hero-font-size,
49
- 92px
50
- );
51
- --_rs-typography-line-height:var(
52
- --rs-middle-hero-line-height,
53
- 92px
54
- );
55
- --_rs-typography-letter-spacing:var(
56
- --rs-middle-hero-letter-spacing,
57
- -0.008em
58
- );
59
-
60
- --_rs-typography-link-border-bottom-width-from-text:3px;
62
+ --_rs-typography-super-hero-md-font-size:var(
63
+ --rs-middle-hero-font-size,
64
+ 92px
65
+ );
66
+ --_rs-typography-super-hero-md-line-height:var(
67
+ --rs-middle-hero-line-height,
68
+ 92px
69
+ );
70
+ --_rs-typography-super-hero-md-letter-spacing:var(
71
+ --rs-middle-hero-letter-spacing,
72
+ -0.008em
73
+ );
74
+ --_rs-typography-super-hero-md-link-border-bottom-width-from-text:3px;
61
75
  }
62
76
  @media screen and (max-width: 640px){
63
- --_rs-typography-font-size:var(
64
- --rs-middle-hero-font-size-mobile,
65
- 58px
66
- );
67
- --_rs-typography-line-height:var(
68
- --rs-middle-hero-line-height-mobile,
69
- 62px
70
- );
71
- --_rs-typography-letter-spacing:var(
72
- --rs-middle-hero-letter-spacing-mobile,
73
- -0.0007em
74
- );
75
-
76
- --_rs-typography-link-border-bottom-width-from-text:2px;
77
+ --_rs-typography-super-hero-sm-font-size:var(
78
+ --rs-middle-hero-font-size-mobile,
79
+ 58px
80
+ );
81
+ --_rs-typography-super-hero-sm-line-height:var(
82
+ --rs-middle-hero-line-height-mobile,
83
+ 62px
84
+ );
85
+ --_rs-typography-super-hero-sm-letter-spacing:var(
86
+ --rs-middle-hero-letter-spacing-mobile,
87
+ -0.0007em
88
+ );
89
+ --_rs-typography-super-hero-sm-link-border-bottom-width-from-text:2px;
77
90
  }
78
91
  letter-spacing:var(
79
92
  --rs-text-base-letter-spacing,
@@ -88,7 +101,13 @@
88
101
  font-feature-settings:'kern', 'liga', 'calt';
89
102
  }
90
103
  @define-mixin rs-super-hero{
91
- --_rs-typography-letter-spacing:var(--rs-super-hero-letter-spacing, -0.02em);
104
+ --_rs-typography-letter-spacing:var(
105
+ --_rs-typography-super-hero-sm-letter-spacing,
106
+ var(
107
+ --_rs-typography-super-hero-md-letter-spacing,
108
+ var(--rs-super-hero-letter-spacing, -0.02em)
109
+ )
110
+ );
92
111
  --_rs-typography-text-transform:initial;
93
112
  --_rs-typography-font-variant-numeric:initial;
94
113
  --_rs-typography-font-family:var(
@@ -98,16 +117,22 @@
98
117
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
99
118
  );
100
119
  --_rs-typography-font-size:var(
101
- --rs-super-hero-font-size,
102
- 142px
120
+ --_rs-typography-super-hero-sm-font-size,
121
+ var(
122
+ --_rs-typography-super-hero-md-font-size,
123
+ var(--rs-super-hero-font-size, 142px)
124
+ )
103
125
  );
104
126
  --_rs-typography-font-weight:var(
105
127
  --rs-font-weight-semi-bold,
106
128
  600
107
129
  );
108
130
  --_rs-typography-line-height:var(
109
- --rs-super-hero-line-height,
110
- 142px
131
+ --_rs-typography-super-hero-sm-line-height,
132
+ var(
133
+ --_rs-typography-super-hero-md-line-height,
134
+ var(--rs-super-hero-line-height, 142px)
135
+ )
111
136
  );
112
137
  --_rs-typography-base-color:var(
113
138
  --_rs-typography-heading-hardness-color,
@@ -122,38 +147,39 @@
122
147
  --_rs-typography-list-li-margin-top-from-text:initial;
123
148
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
124
149
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
125
- --_rs-typography-link-border-bottom-width-from-text:4px;
150
+ --_rs-typography-link-border-bottom-width-from-text:var(
151
+ --_rs-typography-super-hero-sm-link-border-bottom-width-from-text,
152
+ var(--_rs-typography-super-hero-md-link-border-bottom-width-from-text, 4px)
153
+ );
126
154
  @media screen and (max-width: 1000px){
127
- --_rs-typography-font-size:var(
128
- --rs-middle-hero-font-size,
129
- 92px
130
- );
131
- --_rs-typography-line-height:var(
132
- --rs-middle-hero-line-height,
133
- 92px
134
- );
135
- --_rs-typography-letter-spacing:var(
136
- --rs-middle-hero-letter-spacing,
137
- -0.008em
138
- );
139
-
140
- --_rs-typography-link-border-bottom-width-from-text:3px;
155
+ --_rs-typography-super-hero-md-font-size:var(
156
+ --rs-middle-hero-font-size,
157
+ 92px
158
+ );
159
+ --_rs-typography-super-hero-md-line-height:var(
160
+ --rs-middle-hero-line-height,
161
+ 92px
162
+ );
163
+ --_rs-typography-super-hero-md-letter-spacing:var(
164
+ --rs-middle-hero-letter-spacing,
165
+ -0.008em
166
+ );
167
+ --_rs-typography-super-hero-md-link-border-bottom-width-from-text:3px;
141
168
  }
142
169
  @media screen and (max-width: 640px){
143
- --_rs-typography-font-size:var(
144
- --rs-middle-hero-font-size-mobile,
145
- 58px
146
- );
147
- --_rs-typography-line-height:var(
148
- --rs-middle-hero-line-height-mobile,
149
- 62px
150
- );
151
- --_rs-typography-letter-spacing:var(
152
- --rs-middle-hero-letter-spacing-mobile,
153
- -0.0007em
154
- );
155
-
156
- --_rs-typography-link-border-bottom-width-from-text:2px;
170
+ --_rs-typography-super-hero-sm-font-size:var(
171
+ --rs-middle-hero-font-size-mobile,
172
+ 58px
173
+ );
174
+ --_rs-typography-super-hero-sm-line-height:var(
175
+ --rs-middle-hero-line-height-mobile,
176
+ 62px
177
+ );
178
+ --_rs-typography-super-hero-sm-letter-spacing:var(
179
+ --rs-middle-hero-letter-spacing-mobile,
180
+ -0.0007em
181
+ );
182
+ --_rs-typography-super-hero-sm-link-border-bottom-width-from-text:2px;
157
183
  }
158
184
  letter-spacing:var(
159
185
  --rs-text-base-letter-spacing,
@@ -198,8 +224,8 @@
198
224
  }
199
225
  @define-mixin rs-middle-hero-base{
200
226
  --_rs-typography-letter-spacing:var(
201
- --rs-middle-hero-letter-spacing,
202
- -0.008em
227
+ --_rs-typography-middle-hero-sm-letter-spacing,
228
+ var(--rs-middle-hero-letter-spacing, -0.008em)
203
229
  );
204
230
  --_rs-typography-text-transform:initial;
205
231
  --_rs-typography-font-variant-numeric:initial;
@@ -210,16 +236,16 @@
210
236
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
211
237
  );
212
238
  --_rs-typography-font-size:var(
213
- --rs-middle-hero-font-size,
214
- 92px
239
+ --_rs-typography-middle-hero-sm-font-size,
240
+ var(--rs-middle-hero-font-size, 92px)
215
241
  );
216
242
  --_rs-typography-font-weight:var(
217
243
  --rs-font-weight-semi-bold,
218
244
  600
219
245
  );
220
246
  --_rs-typography-line-height:var(
221
- --rs-middle-hero-line-height,
222
- 92px
247
+ --_rs-typography-middle-hero-sm-line-height,
248
+ var(--rs-middle-hero-line-height, 92px)
223
249
  );
224
250
  --_rs-typography-base-color:var(
225
251
  --_rs-typography-heading-hardness-color,
@@ -234,22 +260,24 @@
234
260
  --_rs-typography-list-li-margin-top-from-text:initial;
235
261
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
236
262
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
237
- --_rs-typography-link-border-bottom-width-from-text:3px;
263
+ --_rs-typography-link-border-bottom-width-from-text:var(
264
+ --_rs-typography-middle-hero-sm-link-border-bottom-width-from-text,
265
+ 3px
266
+ );
238
267
  @media screen and (max-width: 640px){
239
- --_rs-typography-font-size:var(
240
- --rs-middle-hero-font-size-mobile,
241
- 58px
242
- );
243
- --_rs-typography-line-height:var(
244
- --rs-middle-hero-line-height-mobile,
245
- 62px
246
- );
247
- --_rs-typography-letter-spacing:var(
248
- --rs-middle-hero-letter-spacing-mobile,
249
- -0.0007em
250
- );
251
-
252
- --_rs-typography-link-border-bottom-width-from-text:2px;
268
+ --_rs-typography-middle-hero-sm-font-size:var(
269
+ --rs-middle-hero-font-size-mobile,
270
+ 58px
271
+ );
272
+ --_rs-typography-middle-hero-sm-line-height:var(
273
+ --rs-middle-hero-line-height-mobile,
274
+ 62px
275
+ );
276
+ --_rs-typography-middle-hero-sm-letter-spacing:var(
277
+ --rs-middle-hero-letter-spacing-mobile,
278
+ -0.0007em
279
+ );
280
+ --_rs-typography-middle-hero-sm-link-border-bottom-width-from-text:2px;
253
281
  }
254
282
  letter-spacing:var(
255
283
  --rs-text-base-letter-spacing,
@@ -265,8 +293,8 @@
265
293
  }
266
294
  @define-mixin rs-middle-hero{
267
295
  --_rs-typography-letter-spacing:var(
268
- --rs-middle-hero-letter-spacing,
269
- -0.008em
296
+ --_rs-typography-middle-hero-sm-letter-spacing,
297
+ var(--rs-middle-hero-letter-spacing, -0.008em)
270
298
  );
271
299
  --_rs-typography-text-transform:initial;
272
300
  --_rs-typography-font-variant-numeric:initial;
@@ -277,16 +305,16 @@
277
305
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
278
306
  );
279
307
  --_rs-typography-font-size:var(
280
- --rs-middle-hero-font-size,
281
- 92px
308
+ --_rs-typography-middle-hero-sm-font-size,
309
+ var(--rs-middle-hero-font-size, 92px)
282
310
  );
283
311
  --_rs-typography-font-weight:var(
284
312
  --rs-font-weight-semi-bold,
285
313
  600
286
314
  );
287
315
  --_rs-typography-line-height:var(
288
- --rs-middle-hero-line-height,
289
- 92px
316
+ --_rs-typography-middle-hero-sm-line-height,
317
+ var(--rs-middle-hero-line-height, 92px)
290
318
  );
291
319
  --_rs-typography-base-color:var(
292
320
  --_rs-typography-heading-hardness-color,
@@ -301,22 +329,24 @@
301
329
  --_rs-typography-list-li-margin-top-from-text:initial;
302
330
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
303
331
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
304
- --_rs-typography-link-border-bottom-width-from-text:3px;
332
+ --_rs-typography-link-border-bottom-width-from-text:var(
333
+ --_rs-typography-middle-hero-sm-link-border-bottom-width-from-text,
334
+ 3px
335
+ );
305
336
  @media screen and (max-width: 640px){
306
- --_rs-typography-font-size:var(
307
- --rs-middle-hero-font-size-mobile,
308
- 58px
309
- );
310
- --_rs-typography-line-height:var(
311
- --rs-middle-hero-line-height-mobile,
312
- 62px
313
- );
314
- --_rs-typography-letter-spacing:var(
315
- --rs-middle-hero-letter-spacing-mobile,
316
- -0.0007em
317
- );
318
-
319
- --_rs-typography-link-border-bottom-width-from-text:2px;
337
+ --_rs-typography-middle-hero-sm-font-size:var(
338
+ --rs-middle-hero-font-size-mobile,
339
+ 58px
340
+ );
341
+ --_rs-typography-middle-hero-sm-line-height:var(
342
+ --rs-middle-hero-line-height-mobile,
343
+ 62px
344
+ );
345
+ --_rs-typography-middle-hero-sm-letter-spacing:var(
346
+ --rs-middle-hero-letter-spacing-mobile,
347
+ -0.0007em
348
+ );
349
+ --_rs-typography-middle-hero-sm-link-border-bottom-width-from-text:2px;
320
350
  }
321
351
  letter-spacing:var(
322
352
  --rs-text-base-letter-spacing,
@@ -454,16 +484,16 @@
454
484
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
455
485
  );
456
486
  --_rs-typography-font-size:var(
457
- --rs-digits-1-font-size,
458
- 69px
487
+ --_rs-typography-digits-1-sm-font-size,
488
+ var(--rs-digits-1-font-size, 69px)
459
489
  );
460
490
  --_rs-typography-font-weight:var(
461
491
  --rs-font-weight-light,
462
492
  300
463
493
  );
464
494
  --_rs-typography-line-height:var(
465
- --rs-digits-1-line-height,
466
- 71px
495
+ --_rs-typography-digits-1-sm-line-height,
496
+ var(--rs-digits-1-line-height, 71px)
467
497
  );
468
498
  --_rs-typography-base-color:var(
469
499
  --_rs-typography-hardness-color,
@@ -478,12 +508,17 @@
478
508
  --_rs-typography-list-li-margin-top-from-text:initial;
479
509
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
480
510
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
481
- --_rs-typography-link-border-bottom-width-from-text:3px;
511
+ --_rs-typography-link-border-bottom-width-from-text:var(
512
+ --_rs-typography-digits-1-sm-link-border-bottom-width-from-text,
513
+ 3px
514
+ );
482
515
  @media screen and (max-width: 640px){
483
- --_rs-typography-font-size:var(--rs-digits-2-font-size, 40px);
484
- --_rs-typography-line-height:var(--rs-digits-2-line-height, 44px);
485
-
486
- --_rs-typography-link-border-bottom-width-from-text:2px;
516
+ --_rs-typography-digits-1-sm-font-size:var(--rs-digits-2-font-size, 40px);
517
+ --_rs-typography-digits-1-sm-line-height:var(
518
+ --rs-digits-2-line-height,
519
+ 44px
520
+ );
521
+ --_rs-typography-digits-1-sm-link-border-bottom-width-from-text:2px;
487
522
  }
488
523
  letter-spacing:var(
489
524
  --rs-text-base-letter-spacing,
@@ -508,16 +543,16 @@
508
543
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
509
544
  );
510
545
  --_rs-typography-font-size:var(
511
- --rs-digits-1-font-size,
512
- 69px
546
+ --_rs-typography-digits-1-sm-font-size,
547
+ var(--rs-digits-1-font-size, 69px)
513
548
  );
514
549
  --_rs-typography-font-weight:var(
515
550
  --rs-font-weight-light,
516
551
  300
517
552
  );
518
553
  --_rs-typography-line-height:var(
519
- --rs-digits-1-line-height,
520
- 71px
554
+ --_rs-typography-digits-1-sm-line-height,
555
+ var(--rs-digits-1-line-height, 71px)
521
556
  );
522
557
  --_rs-typography-base-color:var(
523
558
  --_rs-typography-hardness-color,
@@ -532,12 +567,17 @@
532
567
  --_rs-typography-list-li-margin-top-from-text:initial;
533
568
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
534
569
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
535
- --_rs-typography-link-border-bottom-width-from-text:3px;
570
+ --_rs-typography-link-border-bottom-width-from-text:var(
571
+ --_rs-typography-digits-1-sm-link-border-bottom-width-from-text,
572
+ 3px
573
+ );
536
574
  @media screen and (max-width: 640px){
537
- --_rs-typography-font-size:var(--rs-digits-2-font-size, 40px);
538
- --_rs-typography-line-height:var(--rs-digits-2-line-height, 44px);
539
-
540
- --_rs-typography-link-border-bottom-width-from-text:2px;
575
+ --_rs-typography-digits-1-sm-font-size:var(--rs-digits-2-font-size, 40px);
576
+ --_rs-typography-digits-1-sm-line-height:var(
577
+ --rs-digits-2-line-height,
578
+ 44px
579
+ );
580
+ --_rs-typography-digits-1-sm-link-border-bottom-width-from-text:2px;
541
581
  }
542
582
  letter-spacing:var(
543
583
  --rs-text-base-letter-spacing,
@@ -706,7 +746,10 @@
706
746
  margin-top:calc(var(--rs-flow-unit, 8px)*4);
707
747
  }
708
748
  @define-mixin rs-hero-base{
709
- --_rs-typography-letter-spacing:var(--rs-hero-letter-spacing, -0.005em);
749
+ --_rs-typography-letter-spacing:var(
750
+ --_rs-typography-hero-sm-letter-spacing,
751
+ var(--rs-hero-letter-spacing, -0.005em)
752
+ );
710
753
  --_rs-typography-text-transform:initial;
711
754
  --_rs-typography-font-variant-numeric:initial;
712
755
  --_rs-typography-font-family:var(
@@ -715,14 +758,17 @@
715
758
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
716
759
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
717
760
  );
718
- --_rs-typography-font-size:var(--rs-hero-font-size, 72px);
761
+ --_rs-typography-font-size:var(
762
+ --_rs-typography-hero-sm-font-size,
763
+ var(--rs-hero-font-size, 72px)
764
+ );
719
765
  --_rs-typography-font-weight:var(
720
766
  --rs-font-weight-semi-bold,
721
767
  600
722
768
  );
723
769
  --_rs-typography-line-height:var(
724
- --rs-hero-line-height,
725
- 72px
770
+ --_rs-typography-hero-sm-line-height,
771
+ var(--rs-hero-line-height, 72px)
726
772
  );
727
773
  --_rs-typography-base-color:var(
728
774
  --_rs-typography-heading-hardness-color,
@@ -737,22 +783,24 @@
737
783
  --_rs-typography-list-li-margin-top-from-text:initial;
738
784
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
739
785
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
740
- --_rs-typography-link-border-bottom-width-from-text:3px;
786
+ --_rs-typography-link-border-bottom-width-from-text:var(
787
+ --_rs-typography-hero-sm-link-border-bottom-width-from-text,
788
+ 3px
789
+ );
741
790
  @media screen and (max-width: 640px){
742
- --_rs-typography-font-size:var(
743
- --rs-hero-font-size-mobile,
744
- 42px
745
- );
746
- --_rs-typography-line-height:var(
747
- --rs-hero-line-height-mobile,
748
- 50px
749
- );
750
- --_rs-typography-letter-spacing:var(
751
- --rs-hero-letter-spacing-mobile,
752
- -0.001em
753
- );
754
-
755
- --_rs-typography-link-border-bottom-width-from-text:2px;
791
+ --_rs-typography-hero-sm-font-size:var(
792
+ --rs-hero-font-size-mobile,
793
+ 42px
794
+ );
795
+ --_rs-typography-hero-sm-line-height:var(
796
+ --rs-hero-line-height-mobile,
797
+ 50px
798
+ );
799
+ --_rs-typography-hero-sm-letter-spacing:var(
800
+ --rs-hero-letter-spacing-mobile,
801
+ -0.001em
802
+ );
803
+ --_rs-typography-hero-sm-link-border-bottom-width-from-text:2px;
756
804
  }
757
805
  letter-spacing:var(
758
806
  --rs-text-base-letter-spacing,
@@ -767,7 +815,10 @@
767
815
  font-feature-settings:'kern', 'liga', 'calt';
768
816
  }
769
817
  @define-mixin rs-hero{
770
- --_rs-typography-letter-spacing:var(--rs-hero-letter-spacing, -0.005em);
818
+ --_rs-typography-letter-spacing:var(
819
+ --_rs-typography-hero-sm-letter-spacing,
820
+ var(--rs-hero-letter-spacing, -0.005em)
821
+ );
771
822
  --_rs-typography-text-transform:initial;
772
823
  --_rs-typography-font-variant-numeric:initial;
773
824
  --_rs-typography-font-family:var(
@@ -776,14 +827,17 @@
776
827
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
777
828
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
778
829
  );
779
- --_rs-typography-font-size:var(--rs-hero-font-size, 72px);
830
+ --_rs-typography-font-size:var(
831
+ --_rs-typography-hero-sm-font-size,
832
+ var(--rs-hero-font-size, 72px)
833
+ );
780
834
  --_rs-typography-font-weight:var(
781
835
  --rs-font-weight-semi-bold,
782
836
  600
783
837
  );
784
838
  --_rs-typography-line-height:var(
785
- --rs-hero-line-height,
786
- 72px
839
+ --_rs-typography-hero-sm-line-height,
840
+ var(--rs-hero-line-height, 72px)
787
841
  );
788
842
  --_rs-typography-base-color:var(
789
843
  --_rs-typography-heading-hardness-color,
@@ -798,22 +852,24 @@
798
852
  --_rs-typography-list-li-margin-top-from-text:initial;
799
853
  --_rs-typography-link-standalone-border-offset-from-text-base:1.12em;
800
854
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
801
- --_rs-typography-link-border-bottom-width-from-text:3px;
855
+ --_rs-typography-link-border-bottom-width-from-text:var(
856
+ --_rs-typography-hero-sm-link-border-bottom-width-from-text,
857
+ 3px
858
+ );
802
859
  @media screen and (max-width: 640px){
803
- --_rs-typography-font-size:var(
804
- --rs-hero-font-size-mobile,
805
- 42px
806
- );
807
- --_rs-typography-line-height:var(
808
- --rs-hero-line-height-mobile,
809
- 50px
810
- );
811
- --_rs-typography-letter-spacing:var(
812
- --rs-hero-letter-spacing-mobile,
813
- -0.001em
814
- );
815
-
816
- --_rs-typography-link-border-bottom-width-from-text:2px;
860
+ --_rs-typography-hero-sm-font-size:var(
861
+ --rs-hero-font-size-mobile,
862
+ 42px
863
+ );
864
+ --_rs-typography-hero-sm-line-height:var(
865
+ --rs-hero-line-height-mobile,
866
+ 50px
867
+ );
868
+ --_rs-typography-hero-sm-letter-spacing:var(
869
+ --rs-hero-letter-spacing-mobile,
870
+ -0.001em
871
+ );
872
+ --_rs-typography-hero-sm-link-border-bottom-width-from-text:2px;
817
873
  }
818
874
  letter-spacing:var(
819
875
  --rs-text-base-letter-spacing,
@@ -867,16 +923,16 @@
867
923
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
868
924
  );
869
925
  --_rs-typography-font-size:var(
870
- --rs-subtitle-1-font-size,
871
- 39px
926
+ --_rs-typography-subtitle-1-sm-font-size,
927
+ var(--rs-subtitle-1-font-size, 39px)
872
928
  );
873
929
  --_rs-typography-font-weight:var(
874
930
  --rs-font-weight-light,
875
931
  300
876
932
  );
877
933
  --_rs-typography-line-height:var(
878
- --rs-subtitle-1-line-height,
879
- 49px
934
+ --_rs-typography-subtitle-1-sm-line-height,
935
+ var(--rs-subtitle-1-line-height, 49px)
880
936
  );
881
937
  --_rs-typography-base-color:var(
882
938
  --_rs-typography-hardness-color,
@@ -893,14 +949,14 @@
893
949
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
894
950
  --_rs-typography-link-border-bottom-width-from-text:2px;
895
951
  @media screen and (max-width: 640px){
896
- --_rs-typography-font-size:var(
897
- --rs-subtitle-2-font-size-mobile,
898
- 23px
899
- );
900
- --_rs-typography-line-height:var(
901
- --rs-subtitle-2-line-height-mobile,
902
- 30px
903
- );
952
+ --_rs-typography-subtitle-1-sm-font-size:var(
953
+ --rs-subtitle-2-font-size-mobile,
954
+ 23px
955
+ );
956
+ --_rs-typography-subtitle-1-sm-line-height:var(
957
+ --rs-subtitle-2-line-height-mobile,
958
+ 30px
959
+ );
904
960
  }
905
961
  letter-spacing:var(
906
962
  --rs-text-base-letter-spacing,
@@ -925,16 +981,16 @@
925
981
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
926
982
  );
927
983
  --_rs-typography-font-size:var(
928
- --rs-subtitle-1-font-size,
929
- 39px
984
+ --_rs-typography-subtitle-1-sm-font-size,
985
+ var(--rs-subtitle-1-font-size, 39px)
930
986
  );
931
987
  --_rs-typography-font-weight:var(
932
988
  --rs-font-weight-light,
933
989
  300
934
990
  );
935
991
  --_rs-typography-line-height:var(
936
- --rs-subtitle-1-line-height,
937
- 49px
992
+ --_rs-typography-subtitle-1-sm-line-height,
993
+ var(--rs-subtitle-1-line-height, 49px)
938
994
  );
939
995
  --_rs-typography-base-color:var(
940
996
  --_rs-typography-hardness-color,
@@ -951,14 +1007,14 @@
951
1007
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
952
1008
  --_rs-typography-link-border-bottom-width-from-text:2px;
953
1009
  @media screen and (max-width: 640px){
954
- --_rs-typography-font-size:var(
955
- --rs-subtitle-2-font-size-mobile,
956
- 23px
957
- );
958
- --_rs-typography-line-height:var(
959
- --rs-subtitle-2-line-height-mobile,
960
- 30px
961
- );
1010
+ --_rs-typography-subtitle-1-sm-font-size:var(
1011
+ --rs-subtitle-2-font-size-mobile,
1012
+ 23px
1013
+ );
1014
+ --_rs-typography-subtitle-1-sm-line-height:var(
1015
+ --rs-subtitle-2-line-height-mobile,
1016
+ 30px
1017
+ );
962
1018
  }
963
1019
  letter-spacing:var(
964
1020
  --rs-text-base-letter-spacing,
@@ -1002,7 +1058,10 @@
1002
1058
  margin-top:calc(var(--rs-flow-unit, 8px)*4);
1003
1059
  }
1004
1060
  @define-mixin rs-h1-base{
1005
- --_rs-typography-letter-spacing:var(--rs-h1-letter-spacing, -0.001em);
1061
+ --_rs-typography-letter-spacing:var(
1062
+ --_rs-typography-h1-sm-letter-spacing,
1063
+ var(--rs-h1-letter-spacing, -0.001em)
1064
+ );
1006
1065
  --_rs-typography-text-transform:initial;
1007
1066
  --_rs-typography-font-variant-numeric:initial;
1008
1067
  --_rs-typography-font-family:var(
@@ -1011,12 +1070,18 @@
1011
1070
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
1012
1071
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1013
1072
  );
1014
- --_rs-typography-font-size:var(--rs-h1-font-size, 43px);
1073
+ --_rs-typography-font-size:var(
1074
+ --_rs-typography-h1-sm-font-size,
1075
+ var(--rs-h1-font-size, 43px)
1076
+ );
1015
1077
  --_rs-typography-font-weight:var(
1016
1078
  --rs-font-weight-semi-bold,
1017
1079
  600
1018
1080
  );
1019
- --_rs-typography-line-height:var(--rs-h1-line-height, 49px);
1081
+ --_rs-typography-line-height:var(
1082
+ --_rs-typography-h1-sm-line-height,
1083
+ var(--rs-h1-line-height, 49px)
1084
+ );
1020
1085
  --_rs-typography-base-color:var(
1021
1086
  --_rs-typography-heading-hardness-color,
1022
1087
  var(
@@ -1032,15 +1097,18 @@
1032
1097
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
1033
1098
  --_rs-typography-link-border-bottom-width-from-text:2px;
1034
1099
  @media screen and (max-width: 640px){
1035
- --_rs-typography-font-size:var(
1036
- --rs-h1-font-size-mobile,
1037
- 35px
1038
- );
1039
- --_rs-typography-line-height:var(
1040
- --rs-h1-line-height-mobile,
1041
- 39px
1042
- );
1043
- --_rs-typography-letter-spacing:var(--rs-h1-letter-spacing-mobile, normal);
1100
+ --_rs-typography-h1-sm-font-size:var(
1101
+ --rs-h1-font-size-mobile,
1102
+ 35px
1103
+ );
1104
+ --_rs-typography-h1-sm-line-height:var(
1105
+ --rs-h1-line-height-mobile,
1106
+ 39px
1107
+ );
1108
+ --_rs-typography-h1-sm-letter-spacing:var(
1109
+ --rs-h1-letter-spacing-mobile,
1110
+ normal
1111
+ );
1044
1112
  }
1045
1113
  letter-spacing:var(
1046
1114
  --rs-text-base-letter-spacing,
@@ -1055,7 +1123,10 @@
1055
1123
  font-feature-settings:'kern', 'liga', 'calt';
1056
1124
  }
1057
1125
  @define-mixin rs-h1{
1058
- --_rs-typography-letter-spacing:var(--rs-h1-letter-spacing, -0.001em);
1126
+ --_rs-typography-letter-spacing:var(
1127
+ --_rs-typography-h1-sm-letter-spacing,
1128
+ var(--rs-h1-letter-spacing, -0.001em)
1129
+ );
1059
1130
  --_rs-typography-text-transform:initial;
1060
1131
  --_rs-typography-font-variant-numeric:initial;
1061
1132
  --_rs-typography-font-family:var(
@@ -1064,12 +1135,18 @@
1064
1135
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
1065
1136
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1066
1137
  );
1067
- --_rs-typography-font-size:var(--rs-h1-font-size, 43px);
1138
+ --_rs-typography-font-size:var(
1139
+ --_rs-typography-h1-sm-font-size,
1140
+ var(--rs-h1-font-size, 43px)
1141
+ );
1068
1142
  --_rs-typography-font-weight:var(
1069
1143
  --rs-font-weight-semi-bold,
1070
1144
  600
1071
1145
  );
1072
- --_rs-typography-line-height:var(--rs-h1-line-height, 49px);
1146
+ --_rs-typography-line-height:var(
1147
+ --_rs-typography-h1-sm-line-height,
1148
+ var(--rs-h1-line-height, 49px)
1149
+ );
1073
1150
  --_rs-typography-base-color:var(
1074
1151
  --_rs-typography-heading-hardness-color,
1075
1152
  var(
@@ -1085,15 +1162,18 @@
1085
1162
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
1086
1163
  --_rs-typography-link-border-bottom-width-from-text:2px;
1087
1164
  @media screen and (max-width: 640px){
1088
- --_rs-typography-font-size:var(
1089
- --rs-h1-font-size-mobile,
1090
- 35px
1091
- );
1092
- --_rs-typography-line-height:var(
1093
- --rs-h1-line-height-mobile,
1094
- 39px
1095
- );
1096
- --_rs-typography-letter-spacing:var(--rs-h1-letter-spacing-mobile, normal);
1165
+ --_rs-typography-h1-sm-font-size:var(
1166
+ --rs-h1-font-size-mobile,
1167
+ 35px
1168
+ );
1169
+ --_rs-typography-h1-sm-line-height:var(
1170
+ --rs-h1-line-height-mobile,
1171
+ 39px
1172
+ );
1173
+ --_rs-typography-h1-sm-letter-spacing:var(
1174
+ --rs-h1-letter-spacing-mobile,
1175
+ normal
1176
+ );
1097
1177
  }
1098
1178
  letter-spacing:var(
1099
1179
  --rs-text-base-letter-spacing,
@@ -1147,16 +1227,16 @@
1147
1227
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1148
1228
  );
1149
1229
  --_rs-typography-font-size:var(
1150
- --rs-subtitle-2-font-size,
1151
- 29px
1230
+ --_rs-typography-subtitle-2-sm-font-size,
1231
+ var(--rs-subtitle-2-font-size, 29px)
1152
1232
  );
1153
1233
  --_rs-typography-font-weight:var(
1154
1234
  --rs-font-weight-light,
1155
1235
  300
1156
1236
  );
1157
1237
  --_rs-typography-line-height:var(
1158
- --rs-subtitle-2-line-height,
1159
- 39px
1238
+ --_rs-typography-subtitle-2-sm-line-height,
1239
+ var(--rs-subtitle-2-line-height, 39px)
1160
1240
  );
1161
1241
  --_rs-typography-base-color:var(
1162
1242
  --_rs-typography-hardness-color,
@@ -1173,14 +1253,14 @@
1173
1253
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1174
1254
  --_rs-typography-link-border-bottom-width-from-text:2px;
1175
1255
  @media screen and (max-width: 640px){
1176
- --_rs-typography-font-size:var(
1177
- --rs-subtitle-2-font-size-mobile,
1178
- 23px
1179
- );
1180
- --_rs-typography-line-height:var(
1181
- --rs-subtitle-2-line-height-mobile,
1182
- 30px
1183
- );
1256
+ --_rs-typography-subtitle-2-sm-font-size:var(
1257
+ --rs-subtitle-2-font-size-mobile,
1258
+ 23px
1259
+ );
1260
+ --_rs-typography-subtitle-2-sm-line-height:var(
1261
+ --rs-subtitle-2-line-height-mobile,
1262
+ 30px
1263
+ );
1184
1264
  }
1185
1265
  letter-spacing:var(
1186
1266
  --rs-text-base-letter-spacing,
@@ -1205,16 +1285,16 @@
1205
1285
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1206
1286
  );
1207
1287
  --_rs-typography-font-size:var(
1208
- --rs-subtitle-2-font-size,
1209
- 29px
1288
+ --_rs-typography-subtitle-2-sm-font-size,
1289
+ var(--rs-subtitle-2-font-size, 29px)
1210
1290
  );
1211
1291
  --_rs-typography-font-weight:var(
1212
1292
  --rs-font-weight-light,
1213
1293
  300
1214
1294
  );
1215
1295
  --_rs-typography-line-height:var(
1216
- --rs-subtitle-2-line-height,
1217
- 39px
1296
+ --_rs-typography-subtitle-2-sm-line-height,
1297
+ var(--rs-subtitle-2-line-height, 39px)
1218
1298
  );
1219
1299
  --_rs-typography-base-color:var(
1220
1300
  --_rs-typography-hardness-color,
@@ -1231,14 +1311,14 @@
1231
1311
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1232
1312
  --_rs-typography-link-border-bottom-width-from-text:2px;
1233
1313
  @media screen and (max-width: 640px){
1234
- --_rs-typography-font-size:var(
1235
- --rs-subtitle-2-font-size-mobile,
1236
- 23px
1237
- );
1238
- --_rs-typography-line-height:var(
1239
- --rs-subtitle-2-line-height-mobile,
1240
- 30px
1241
- );
1314
+ --_rs-typography-subtitle-2-sm-font-size:var(
1315
+ --rs-subtitle-2-font-size-mobile,
1316
+ 23px
1317
+ );
1318
+ --_rs-typography-subtitle-2-sm-line-height:var(
1319
+ --rs-subtitle-2-line-height-mobile,
1320
+ 30px
1321
+ );
1242
1322
  }
1243
1323
  letter-spacing:var(
1244
1324
  --rs-text-base-letter-spacing,
@@ -1291,12 +1371,18 @@
1291
1371
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
1292
1372
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1293
1373
  );
1294
- --_rs-typography-font-size:var(--rs-h2-font-size, 35px);
1374
+ --_rs-typography-font-size:var(
1375
+ --_rs-typography-h2-sm-font-size,
1376
+ var(--rs-h2-font-size, 35px)
1377
+ );
1295
1378
  --_rs-typography-font-weight:var(
1296
1379
  --rs-font-weight-semi-bold,
1297
1380
  600
1298
1381
  );
1299
- --_rs-typography-line-height:var(--rs-h2-line-height, 42px);
1382
+ --_rs-typography-line-height:var(
1383
+ --_rs-typography-h2-sm-line-height,
1384
+ var(--rs-h2-line-height, 42px)
1385
+ );
1300
1386
  --_rs-typography-base-color:var(
1301
1387
  --_rs-typography-heading-hardness-color,
1302
1388
  var(
@@ -1312,14 +1398,14 @@
1312
1398
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
1313
1399
  --_rs-typography-link-border-bottom-width-from-text:2px;
1314
1400
  @media screen and (max-width: 640px){
1315
- --_rs-typography-font-size:var(
1316
- --rs-h2-font-size-mobile,
1317
- 28px
1318
- );
1319
- --_rs-typography-line-height:var(
1320
- --rs-h2-line-height-mobile,
1321
- 32px
1322
- );
1401
+ --_rs-typography-h2-sm-font-size:var(
1402
+ --rs-h2-font-size-mobile,
1403
+ 28px
1404
+ );
1405
+ --_rs-typography-h2-sm-line-height:var(
1406
+ --rs-h2-line-height-mobile,
1407
+ 32px
1408
+ );
1323
1409
  }
1324
1410
  letter-spacing:var(
1325
1411
  --rs-text-base-letter-spacing,
@@ -1343,12 +1429,18 @@
1343
1429
  BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
1344
1430
  'Droid Sans', 'Helvetica Neue', Arial, sans-serif)
1345
1431
  );
1346
- --_rs-typography-font-size:var(--rs-h2-font-size, 35px);
1432
+ --_rs-typography-font-size:var(
1433
+ --_rs-typography-h2-sm-font-size,
1434
+ var(--rs-h2-font-size, 35px)
1435
+ );
1347
1436
  --_rs-typography-font-weight:var(
1348
1437
  --rs-font-weight-semi-bold,
1349
1438
  600
1350
1439
  );
1351
- --_rs-typography-line-height:var(--rs-h2-line-height, 42px);
1440
+ --_rs-typography-line-height:var(
1441
+ --_rs-typography-h2-sm-line-height,
1442
+ var(--rs-h2-line-height, 42px)
1443
+ );
1352
1444
  --_rs-typography-base-color:var(
1353
1445
  --_rs-typography-heading-hardness-color,
1354
1446
  var(
@@ -1364,14 +1456,14 @@
1364
1456
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1em;
1365
1457
  --_rs-typography-link-border-bottom-width-from-text:2px;
1366
1458
  @media screen and (max-width: 640px){
1367
- --_rs-typography-font-size:var(
1368
- --rs-h2-font-size-mobile,
1369
- 28px
1370
- );
1371
- --_rs-typography-line-height:var(
1372
- --rs-h2-line-height-mobile,
1373
- 32px
1374
- );
1459
+ --_rs-typography-h2-sm-font-size:var(
1460
+ --rs-h2-font-size-mobile,
1461
+ 28px
1462
+ );
1463
+ --_rs-typography-h2-sm-line-height:var(
1464
+ --rs-h2-line-height-mobile,
1465
+ 32px
1466
+ );
1375
1467
  }
1376
1468
  letter-spacing:var(
1377
1469
  --rs-text-base-letter-spacing,
@@ -1556,12 +1648,15 @@
1556
1648
  --_rs-typography-text-auto-offset:32px;
1557
1649
  --_rs-typography-ul-list-li-padding-left:26px;
1558
1650
  --_rs-typography-ol-list-li-padding-left:32px;
1559
- --_rs-typography-list-li-margin-top-from-text:24px;
1651
+ --_rs-typography-list-li-margin-top-from-text:var(
1652
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
1653
+ 24px
1654
+ );
1560
1655
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
1561
1656
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1562
1657
  --_rs-typography-link-border-bottom-width-from-text:1px;
1563
1658
  @media screen and (max-width: 640px){
1564
- --_rs-typography-list-li-margin-top-from-text:16px;
1659
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
1565
1660
  }
1566
1661
  letter-spacing:var(
1567
1662
  --rs-text-base-letter-spacing,
@@ -1604,12 +1699,15 @@
1604
1699
  --_rs-typography-text-auto-offset:32px;
1605
1700
  --_rs-typography-ul-list-li-padding-left:26px;
1606
1701
  --_rs-typography-ol-list-li-padding-left:32px;
1607
- --_rs-typography-list-li-margin-top-from-text:24px;
1702
+ --_rs-typography-list-li-margin-top-from-text:var(
1703
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
1704
+ 24px
1705
+ );
1608
1706
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
1609
1707
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1610
1708
  --_rs-typography-link-border-bottom-width-from-text:1px;
1611
1709
  @media screen and (max-width: 640px){
1612
- --_rs-typography-list-li-margin-top-from-text:16px;
1710
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
1613
1711
  }
1614
1712
  letter-spacing:var(
1615
1713
  --rs-text-base-letter-spacing,
@@ -1794,12 +1892,15 @@
1794
1892
  --_rs-typography-text-auto-offset:16px;
1795
1893
  --_rs-typography-ul-list-li-padding-left:22px;
1796
1894
  --_rs-typography-ol-list-li-padding-left:26px;
1797
- --_rs-typography-list-li-margin-top-from-text:16px;
1895
+ --_rs-typography-list-li-margin-top-from-text:var(
1896
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
1897
+ 16px
1898
+ );
1798
1899
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
1799
1900
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1800
1901
  --_rs-typography-link-border-bottom-width-from-text:1px;
1801
1902
  @media screen and (max-width: 640px){
1802
- --_rs-typography-list-li-margin-top-from-text:12px;
1903
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
1803
1904
  }
1804
1905
  letter-spacing:var(
1805
1906
  --rs-text-base-letter-spacing,
@@ -1842,12 +1943,15 @@
1842
1943
  --_rs-typography-text-auto-offset:16px;
1843
1944
  --_rs-typography-ul-list-li-padding-left:22px;
1844
1945
  --_rs-typography-ol-list-li-padding-left:26px;
1845
- --_rs-typography-list-li-margin-top-from-text:16px;
1946
+ --_rs-typography-list-li-margin-top-from-text:var(
1947
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
1948
+ 16px
1949
+ );
1846
1950
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
1847
1951
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
1848
1952
  --_rs-typography-link-border-bottom-width-from-text:1px;
1849
1953
  @media screen and (max-width: 640px){
1850
- --_rs-typography-list-li-margin-top-from-text:12px;
1954
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
1851
1955
  }
1852
1956
  letter-spacing:var(
1853
1957
  --rs-text-base-letter-spacing,
@@ -2207,15 +2311,21 @@
2207
2311
  --_rs-typography-list-li-margin-top:12px;
2208
2312
  }
2209
2313
  @define-mixin rs-core-list-offset-items-16{
2210
- --_rs-typography-list-li-margin-top:16px;
2314
+ --_rs-typography-list-li-margin-top:var(
2315
+ --_rs-typography-offset-items-16-sm-list-li-margin-top,
2316
+ 16px
2317
+ );
2211
2318
  @media screen and (max-width: 640px){
2212
- --_rs-typography-list-li-margin-top:12px;
2319
+ --_rs-typography-offset-items-16-sm-list-li-margin-top:12px;
2213
2320
  }
2214
2321
  }
2215
2322
  @define-mixin rs-core-list-offset-items-24{
2216
- --_rs-typography-list-li-margin-top:24px;
2323
+ --_rs-typography-list-li-margin-top:var(
2324
+ --_rs-typography-offset-items-24-sm-list-li-margin-top,
2325
+ 24px
2326
+ );
2217
2327
  @media screen and (max-width: 640px){
2218
- --_rs-typography-list-li-margin-top:16px;
2328
+ --_rs-typography-offset-items-24-sm-list-li-margin-top:16px;
2219
2329
  }
2220
2330
  }
2221
2331
  @define-mixin rs-ul{
@@ -2292,22 +2402,28 @@
2292
2402
  }
2293
2403
 
2294
2404
  &_offset-items_16{
2295
- --_rs-typography-list-li-margin-top:16px;
2405
+ --_rs-typography-list-li-margin-top:var(
2406
+ --_rs-typography-offset-items-16-sm-list-li-margin-top,
2407
+ 16px
2408
+ );
2296
2409
  }
2297
2410
  @media screen and (max-width: 640px){
2298
2411
 
2299
2412
  &_offset-items_16{
2300
- --_rs-typography-list-li-margin-top:12px;
2413
+ --_rs-typography-offset-items-16-sm-list-li-margin-top:12px;
2301
2414
  }
2302
2415
  }
2303
2416
 
2304
2417
  &_offset-items_24{
2305
- --_rs-typography-list-li-margin-top:24px;
2418
+ --_rs-typography-list-li-margin-top:var(
2419
+ --_rs-typography-offset-items-24-sm-list-li-margin-top,
2420
+ 24px
2421
+ );
2306
2422
  }
2307
2423
  @media screen and (max-width: 640px){
2308
2424
 
2309
2425
  &_offset-items_24{
2310
- --_rs-typography-list-li-margin-top:16px;
2426
+ --_rs-typography-offset-items-24-sm-list-li-margin-top:16px;
2311
2427
  }
2312
2428
  }
2313
2429
  }
@@ -2385,22 +2501,28 @@
2385
2501
  }
2386
2502
 
2387
2503
  &_offset-items_16{
2388
- --_rs-typography-list-li-margin-top:16px;
2504
+ --_rs-typography-list-li-margin-top:var(
2505
+ --_rs-typography-offset-items-16-sm-list-li-margin-top,
2506
+ 16px
2507
+ );
2389
2508
  }
2390
2509
  @media screen and (max-width: 640px){
2391
2510
 
2392
2511
  &_offset-items_16{
2393
- --_rs-typography-list-li-margin-top:12px;
2512
+ --_rs-typography-offset-items-16-sm-list-li-margin-top:12px;
2394
2513
  }
2395
2514
  }
2396
2515
 
2397
2516
  &_offset-items_24{
2398
- --_rs-typography-list-li-margin-top:24px;
2517
+ --_rs-typography-list-li-margin-top:var(
2518
+ --_rs-typography-offset-items-24-sm-list-li-margin-top,
2519
+ 24px
2520
+ );
2399
2521
  }
2400
2522
  @media screen and (max-width: 640px){
2401
2523
 
2402
2524
  &_offset-items_24{
2403
- --_rs-typography-list-li-margin-top:16px;
2525
+ --_rs-typography-offset-items-24-sm-list-li-margin-top:16px;
2404
2526
  }
2405
2527
  }
2406
2528
  }