@proximus/lavender-styling 2.0.0-alpha.4 → 2.0.0-alpha.41
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.
- package/dist/css/proximus/themes-tokens.css +49 -47
- package/dist/css/proximus-ebu/themes-tokens.css +47 -47
- package/dist/css/scarlet/themes-tokens.css +45 -45
- package/dist/js/proximus/themesTokens.d.ts +4 -2
- package/dist/js/proximus/themesTokens.js +165 -163
- package/dist/js/proximus-ebu/themesTokens.d.ts +2 -2
- package/dist/js/proximus-ebu/themesTokens.js +163 -163
- package/dist/js/scarlet/themesTokens.js +159 -159
- package/package.json +1 -1
|
@@ -15,6 +15,8 @@
|
|
|
15
15
|
--px-color-background-data-magenta: #FF418C;
|
|
16
16
|
--px-color-background-data-blue: #016BC1;
|
|
17
17
|
--px-color-background-data-turquoise: #66D2CC;
|
|
18
|
+
--px-color-background-footer-default: #7d57a7;
|
|
19
|
+
--px-color-background-footer-inverted: #ffffff;
|
|
18
20
|
--px-color-background-gradient-purple-top-red: 180deg, #5C2D91 66%, #EE2E5D 100%;
|
|
19
21
|
--px-color-background-gradient-purple-top-magenta: 180deg, #5C2D91 66%, #FF418C 100%;
|
|
20
22
|
--px-color-background-gradient-purple-top-orange: 180deg, #5C2D91 66%, #F39200 100%;
|
|
@@ -88,8 +90,8 @@
|
|
|
88
90
|
--px-color-background-state-hover-inverted: rgba(255, 255, 255, 0.12);
|
|
89
91
|
--px-color-background-state-hover-bordered-default: rgba(255, 255, 255, 0.40);
|
|
90
92
|
--px-color-background-state-hover-bordered-inverted: rgba(0, 0, 0, 0.12);
|
|
91
|
-
--px-color-background-state-active-default: #
|
|
92
|
-
--px-color-background-state-active-inverted:
|
|
93
|
+
--px-color-background-state-active-default: #5C2D91;
|
|
94
|
+
--px-color-background-state-active-inverted: #ffffff;
|
|
93
95
|
--px-color-background-state-disabled-default: rgba(0, 0, 0, 0.04);
|
|
94
96
|
--px-color-background-state-disabled-inverted: rgba(255, 255, 255, 0.08);
|
|
95
97
|
--px-color-background-surface-light: #ffffff;
|
|
@@ -121,8 +123,8 @@
|
|
|
121
123
|
--px-color-border-purpose-unlimited-inverted: #0088F5;
|
|
122
124
|
--px-color-border-state-hover-default: #5C2D91;
|
|
123
125
|
--px-color-border-state-hover-inverted: #ffffff;
|
|
124
|
-
--px-color-border-state-active-default: #
|
|
125
|
-
--px-color-border-state-active-inverted:
|
|
126
|
+
--px-color-border-state-active-default: #5C2D91;
|
|
127
|
+
--px-color-border-state-active-inverted: #ffffff;
|
|
126
128
|
--px-color-icon-brand-default: #5C2D91;
|
|
127
129
|
--px-color-icon-brand-inverted: #ffffff;
|
|
128
130
|
--px-color-icon-accent-default: #5C2D91;
|
|
@@ -143,8 +145,8 @@
|
|
|
143
145
|
--px-color-icon-purpose-promo-inverted: #FF4371;
|
|
144
146
|
--px-color-icon-state-hover-default: #7d57a7;
|
|
145
147
|
--px-color-icon-state-hover-inverted: rgba(255, 255, 255, 0.80);
|
|
146
|
-
--px-color-icon-state-active-default: #
|
|
147
|
-
--px-color-icon-state-active-inverted:
|
|
148
|
+
--px-color-icon-state-active-default: #5C2D91;
|
|
149
|
+
--px-color-icon-state-active-inverted: #ffffff;
|
|
148
150
|
--px-color-icon-state-disabled-default: rgba(0, 0, 0, 0.12);
|
|
149
151
|
--px-color-icon-state-disabled-inverted: rgba(255, 255, 255, 0.16);
|
|
150
152
|
--px-color-text-brand-default: #5C2D91;
|
|
@@ -163,10 +165,10 @@
|
|
|
163
165
|
--px-color-text-purpose-unlimited-inverted: #0088F5;
|
|
164
166
|
--px-color-text-purpose-promo-default: #C7264D;
|
|
165
167
|
--px-color-text-purpose-promo-inverted: #FF4371;
|
|
166
|
-
--px-color-text-state-hover-default: #
|
|
168
|
+
--px-color-text-state-hover-default: #5C2D91;
|
|
167
169
|
--px-color-text-state-hover-inverted: rgba(255, 255, 255, 0.80);
|
|
168
|
-
--px-color-text-state-active-default: #
|
|
169
|
-
--px-color-text-state-active-inverted:
|
|
170
|
+
--px-color-text-state-active-default: #5C2D91;
|
|
171
|
+
--px-color-text-state-active-inverted: #ffffff;
|
|
170
172
|
--px-color-text-state-disabled-default: rgba(0, 0, 0, 0.12);
|
|
171
173
|
--px-color-text-state-disabled-inverted: rgba(255, 255, 255, 0.16);
|
|
172
174
|
--px-font-family: Proximus, Verdana, Helvetica, sans-serif;
|
|
@@ -219,7 +221,7 @@
|
|
|
219
221
|
--px-utility-size-s: 0.125em;
|
|
220
222
|
--px-utility-size-m: 0.5em;
|
|
221
223
|
--px-focus-l-mobile: 18px;
|
|
222
|
-
--px-focus-l-tablet:
|
|
224
|
+
--px-focus-l-tablet: 18px;
|
|
223
225
|
--px-focus-l-laptop: 20px;
|
|
224
226
|
--px-focus-l-desktop: 20px;
|
|
225
227
|
--px-focus-offset-mobile: 4px;
|
|
@@ -275,67 +277,67 @@
|
|
|
275
277
|
--px-padding-m-laptop: 24px;
|
|
276
278
|
--px-padding-m-desktop: 24px;
|
|
277
279
|
--px-padding-l-mobile: 24px;
|
|
278
|
-
--px-padding-l-tablet:
|
|
280
|
+
--px-padding-l-tablet: 24px;
|
|
279
281
|
--px-padding-l-laptop: 40px;
|
|
280
282
|
--px-padding-l-desktop: 40px;
|
|
281
283
|
--px-padding-xl-mobile: 40px;
|
|
282
|
-
--px-padding-xl-tablet:
|
|
284
|
+
--px-padding-xl-tablet: 40px;
|
|
283
285
|
--px-padding-xl-laptop: 80px;
|
|
284
286
|
--px-padding-xl-desktop: 80px;
|
|
285
287
|
--px-platform-default-width-mobile: 23.4375em;
|
|
286
|
-
--px-platform-default-width-tablet:
|
|
288
|
+
--px-platform-default-width-tablet: 23.4375em;
|
|
287
289
|
--px-platform-default-width-laptop: 90em;
|
|
288
290
|
--px-platform-default-width-desktop: 90em;
|
|
289
291
|
--px-content-wrapper-min-width-mobile: 21.4375em;
|
|
290
|
-
--px-content-wrapper-min-width-tablet:
|
|
292
|
+
--px-content-wrapper-min-width-tablet: 21.4375em;
|
|
291
293
|
--px-content-wrapper-min-width-laptop: 73.75em;
|
|
292
294
|
--px-content-wrapper-min-width-desktop: 73.75em;
|
|
293
295
|
--px-content-wrapper-max-width-mobile: 62em;
|
|
294
|
-
--px-content-wrapper-max-width-tablet:
|
|
296
|
+
--px-content-wrapper-max-width-tablet: 62em;
|
|
295
297
|
--px-content-wrapper-max-width-laptop: 73.75em;
|
|
296
298
|
--px-content-wrapper-max-width-desktop: 73.75em;
|
|
297
299
|
--px-price-size-decimal-s-mobile: 0.9375em;
|
|
298
|
-
--px-price-size-decimal-s-tablet:
|
|
300
|
+
--px-price-size-decimal-s-tablet: 0.9375em;
|
|
299
301
|
--px-price-size-decimal-s-laptop: 1em;
|
|
300
302
|
--px-price-size-decimal-s-desktop: 1em;
|
|
301
303
|
--px-price-size-decimal-m-mobile: 0.8125em;
|
|
302
|
-
--px-price-size-decimal-m-tablet:
|
|
304
|
+
--px-price-size-decimal-m-tablet: 0.8125em;
|
|
303
305
|
--px-price-size-decimal-m-laptop: 1em;
|
|
304
306
|
--px-price-size-decimal-m-desktop: 1em;
|
|
305
307
|
--px-price-size-decimal-l-mobile: 0.875em;
|
|
306
|
-
--px-price-size-decimal-l-tablet:
|
|
308
|
+
--px-price-size-decimal-l-tablet: 0.875em;
|
|
307
309
|
--px-price-size-decimal-l-laptop: 1.125em;
|
|
308
310
|
--px-price-size-decimal-l-desktop: 1.125em;
|
|
309
311
|
--px-price-size-sign-s-mobile: 0.875em;
|
|
310
|
-
--px-price-size-sign-s-tablet:
|
|
312
|
+
--px-price-size-sign-s-tablet: 0.875em;
|
|
311
313
|
--px-price-size-sign-s-laptop: 1.125em;
|
|
312
314
|
--px-price-size-sign-s-desktop: 1.125em;
|
|
313
315
|
--px-price-size-sign-m-mobile: 1em;
|
|
314
|
-
--px-price-size-sign-m-tablet:
|
|
316
|
+
--px-price-size-sign-m-tablet: 1em;
|
|
315
317
|
--px-price-size-sign-m-laptop: 1.3125em;
|
|
316
318
|
--px-price-size-sign-m-desktop: 1.3125em;
|
|
317
319
|
--px-price-size-sign-l-mobile: 1.25em;
|
|
318
|
-
--px-price-size-sign-l-tablet: 1.
|
|
320
|
+
--px-price-size-sign-l-tablet: 1.25em;
|
|
319
321
|
--px-price-size-sign-l-laptop: 1.75em;
|
|
320
322
|
--px-price-size-sign-l-desktop: 1.75em;
|
|
321
323
|
--px-price-size-unit-s-mobile: 1.125em;
|
|
322
|
-
--px-price-size-unit-s-tablet: 1.
|
|
324
|
+
--px-price-size-unit-s-tablet: 1.125em;
|
|
323
325
|
--px-price-size-unit-s-laptop: 1.25em;
|
|
324
326
|
--px-price-size-unit-s-desktop: 1.25em;
|
|
325
327
|
--px-price-size-unit-m-mobile: 1.25em;
|
|
326
|
-
--px-price-size-unit-m-tablet: 1.
|
|
328
|
+
--px-price-size-unit-m-tablet: 1.25em;
|
|
327
329
|
--px-price-size-unit-m-laptop: 1.5em;
|
|
328
330
|
--px-price-size-unit-m-desktop: 1.5em;
|
|
329
331
|
--px-price-size-unit-l-mobile: 1.75em;
|
|
330
|
-
--px-price-size-unit-l-tablet:
|
|
332
|
+
--px-price-size-unit-l-tablet: 1.75em;
|
|
331
333
|
--px-price-size-unit-l-laptop: 2em;
|
|
332
334
|
--px-price-size-unit-l-desktop: 2em;
|
|
333
335
|
--px-spacing-heading-to-subtitle-mobile: 8px;
|
|
334
|
-
--px-spacing-heading-to-subtitle-tablet:
|
|
336
|
+
--px-spacing-heading-to-subtitle-tablet: 8px;
|
|
335
337
|
--px-spacing-heading-to-subtitle-laptop: 16px;
|
|
336
338
|
--px-spacing-heading-to-subtitle-desktop: 16px;
|
|
337
339
|
--px-spacing-heading-to-content-mobile: 16px;
|
|
338
|
-
--px-spacing-heading-to-content-tablet:
|
|
340
|
+
--px-spacing-heading-to-content-tablet: 16px;
|
|
339
341
|
--px-spacing-heading-to-content-laptop: 24px;
|
|
340
342
|
--px-spacing-heading-to-content-desktop: 24px;
|
|
341
343
|
--px-spacing-none-mobile: 0px;
|
|
@@ -359,87 +361,87 @@
|
|
|
359
361
|
--px-spacing-default-laptop: 24px;
|
|
360
362
|
--px-spacing-default-desktop: 24px;
|
|
361
363
|
--px-spacing-l-mobile: 24px;
|
|
362
|
-
--px-spacing-l-tablet:
|
|
364
|
+
--px-spacing-l-tablet: 24px;
|
|
363
365
|
--px-spacing-l-laptop: 40px;
|
|
364
366
|
--px-spacing-l-desktop: 40px;
|
|
365
367
|
--px-overlapped-mobile: -24px;
|
|
366
|
-
--px-overlapped-tablet: -
|
|
368
|
+
--px-overlapped-tablet: -24px;
|
|
367
369
|
--px-overlapped-laptop: -40px;
|
|
368
370
|
--px-overlapped-desktop: -40px;
|
|
369
371
|
--px-spacing-page-layout-between-sections-mobile: 40px;
|
|
370
|
-
--px-spacing-page-layout-between-sections-tablet:
|
|
372
|
+
--px-spacing-page-layout-between-sections-tablet: 40px;
|
|
371
373
|
--px-spacing-page-layout-between-sections-laptop: 80px;
|
|
372
374
|
--px-spacing-page-layout-between-sections-desktop: 80px;
|
|
373
375
|
--px-text-size-body-l-mobile: 1em;
|
|
374
|
-
--px-text-size-body-l-tablet:
|
|
376
|
+
--px-text-size-body-l-tablet: 1em;
|
|
375
377
|
--px-text-size-body-l-laptop: 1.125em;
|
|
376
378
|
--px-text-size-body-l-desktop: 1.125em;
|
|
377
379
|
--px-text-size-body-m-mobile: 0.875em;
|
|
378
|
-
--px-text-size-body-m-tablet:
|
|
380
|
+
--px-text-size-body-m-tablet: 0.875em;
|
|
379
381
|
--px-text-size-body-m-laptop: 1em;
|
|
380
382
|
--px-text-size-body-m-desktop: 1em;
|
|
381
383
|
--px-text-size-body-s-mobile: 0.75em;
|
|
382
|
-
--px-text-size-body-s-tablet: 0.
|
|
384
|
+
--px-text-size-body-s-tablet: 0.75em;
|
|
383
385
|
--px-text-size-body-s-laptop: 0.875em;
|
|
384
386
|
--px-text-size-body-s-desktop: 0.875em;
|
|
385
387
|
--px-text-size-body-xs-mobile: 0.625em;
|
|
386
|
-
--px-text-size-body-xs-tablet: 0.
|
|
388
|
+
--px-text-size-body-xs-tablet: 0.625em;
|
|
387
389
|
--px-text-size-body-xs-laptop: 0.75em;
|
|
388
390
|
--px-text-size-body-xs-desktop: 0.75em;
|
|
389
391
|
--px-text-size-heading-5xl-mobile: 2.25em;
|
|
390
|
-
--px-text-size-heading-5xl-tablet: 2.
|
|
392
|
+
--px-text-size-heading-5xl-tablet: 2.25em;
|
|
391
393
|
--px-text-size-heading-5xl-laptop: 2.5em;
|
|
392
394
|
--px-text-size-heading-5xl-desktop: 2.5em;
|
|
393
395
|
--px-text-size-heading-4xl-mobile: 2em;
|
|
396
|
+
--px-text-size-heading-4xl-tablet: 2em;
|
|
394
397
|
--px-text-size-heading-4xl-laptop: 2.5em;
|
|
395
|
-
--px-text-size-heading-4xl-tablet: 2.5em;
|
|
396
398
|
--px-text-size-heading-4xl-desktop: 2.5em;
|
|
397
399
|
--px-text-size-heading-3xl-mobile: 1.75em;
|
|
398
|
-
--px-text-size-heading-3xl-tablet:
|
|
400
|
+
--px-text-size-heading-3xl-tablet: 1.75em;
|
|
399
401
|
--px-text-size-heading-3xl-laptop: 2.25em;
|
|
400
402
|
--px-text-size-heading-3xl-desktop: 2.25em;
|
|
401
403
|
--px-text-size-heading-2xl-mobile: 1.5em;
|
|
402
|
-
--px-text-size-heading-2xl-tablet: 1.
|
|
404
|
+
--px-text-size-heading-2xl-tablet: 1.5em;
|
|
403
405
|
--px-text-size-heading-2xl-laptop: 1.75em;
|
|
404
406
|
--px-text-size-heading-2xl-desktop: 1.75em;
|
|
405
407
|
--px-text-size-heading-xl-mobile: 1.25em;
|
|
406
|
-
--px-text-size-heading-xl-tablet: 1.
|
|
408
|
+
--px-text-size-heading-xl-tablet: 1.25em;
|
|
407
409
|
--px-text-size-heading-xl-laptop: 1.5em;
|
|
408
410
|
--px-text-size-heading-xl-desktop: 1.5em;
|
|
409
411
|
--px-text-size-heading-l-mobile: 1.125em;
|
|
410
|
-
--px-text-size-heading-l-tablet: 1.
|
|
412
|
+
--px-text-size-heading-l-tablet: 1.125em;
|
|
411
413
|
--px-text-size-heading-l-laptop: 1.25em;
|
|
412
414
|
--px-text-size-heading-l-desktop: 1.25em;
|
|
413
415
|
--px-text-size-heading-m-mobile: 1em;
|
|
414
|
-
--px-text-size-heading-m-tablet:
|
|
416
|
+
--px-text-size-heading-m-tablet: 1em;
|
|
415
417
|
--px-text-size-heading-m-laptop: 1.125em;
|
|
416
418
|
--px-text-size-heading-m-desktop: 1.125em;
|
|
417
419
|
--px-text-size-heading-s-mobile: 0.875em;
|
|
418
|
-
--px-text-size-heading-s-tablet:
|
|
420
|
+
--px-text-size-heading-s-tablet: 0.875em;
|
|
419
421
|
--px-text-size-heading-s-laptop: 1em;
|
|
420
422
|
--px-text-size-heading-s-desktop: 1em;
|
|
421
423
|
--px-text-size-label-l-mobile: 1em;
|
|
422
|
-
--px-text-size-label-l-tablet:
|
|
424
|
+
--px-text-size-label-l-tablet: 1em;
|
|
423
425
|
--px-text-size-label-l-laptop: 1.125em;
|
|
424
426
|
--px-text-size-label-l-desktop: 1.125em;
|
|
425
427
|
--px-text-size-label-m-mobile: 0.875em;
|
|
426
|
-
--px-text-size-label-m-tablet:
|
|
428
|
+
--px-text-size-label-m-tablet: 0.875em;
|
|
427
429
|
--px-text-size-label-m-laptop: 1em;
|
|
428
430
|
--px-text-size-label-m-desktop: 1em;
|
|
429
431
|
--px-text-size-label-s-mobile: 0.75em;
|
|
430
|
-
--px-text-size-label-s-tablet: 0.
|
|
432
|
+
--px-text-size-label-s-tablet: 0.75em;
|
|
431
433
|
--px-text-size-label-s-laptop: 0.875em;
|
|
432
434
|
--px-text-size-label-s-desktop: 0.875em;
|
|
433
435
|
--px-text-size-label-xs-mobile: 0.625em;
|
|
434
|
-
--px-text-size-label-xs-tablet: 0.
|
|
436
|
+
--px-text-size-label-xs-tablet: 0.625em;
|
|
435
437
|
--px-text-size-label-xs-laptop: 0.75em;
|
|
436
438
|
--px-text-size-label-xs-desktop: 0.75em;
|
|
437
439
|
--px-text-size-link-m-mobile: 0.875em;
|
|
438
|
-
--px-text-size-link-m-tablet:
|
|
440
|
+
--px-text-size-link-m-tablet: 0.875em;
|
|
439
441
|
--px-text-size-link-m-laptop: 1em;
|
|
440
442
|
--px-text-size-link-m-desktop: 1em;
|
|
441
443
|
--px-text-size-link-s-mobile: 0.75em;
|
|
442
|
-
--px-text-size-link-s-tablet: 0.
|
|
444
|
+
--px-text-size-link-s-tablet: 0.75em;
|
|
443
445
|
--px-text-size-link-s-laptop: 0.875em;
|
|
444
446
|
--px-text-size-link-s-desktop: 0.875em;
|
|
445
447
|
}
|
|
@@ -88,8 +88,8 @@
|
|
|
88
88
|
--px-color-background-state-hover-inverted: rgba(255, 255, 255, 0.12);
|
|
89
89
|
--px-color-background-state-hover-bordered-default: rgba(255, 255, 255, 0.40);
|
|
90
90
|
--px-color-background-state-hover-bordered-inverted: rgba(0, 0, 0, 0.12);
|
|
91
|
-
--px-color-background-state-active-default: #
|
|
92
|
-
--px-color-background-state-active-inverted:
|
|
91
|
+
--px-color-background-state-active-default: #5C2D91;
|
|
92
|
+
--px-color-background-state-active-inverted: #ffffff;
|
|
93
93
|
--px-color-background-state-disabled-default: rgba(0, 0, 0, 0.04);
|
|
94
94
|
--px-color-background-state-disabled-inverted: rgba(255, 255, 255, 0.08);
|
|
95
95
|
--px-color-background-surface-light: #ffffff;
|
|
@@ -121,8 +121,8 @@
|
|
|
121
121
|
--px-color-border-purpose-unlimited-inverted: #0088F5;
|
|
122
122
|
--px-color-border-state-hover-default: #5C2D91;
|
|
123
123
|
--px-color-border-state-hover-inverted: #ffffff;
|
|
124
|
-
--px-color-border-state-active-default: #
|
|
125
|
-
--px-color-border-state-active-inverted:
|
|
124
|
+
--px-color-border-state-active-default: #5C2D91;
|
|
125
|
+
--px-color-border-state-active-inverted: #ffffff;
|
|
126
126
|
--px-color-icon-brand-default: #5C2D91;
|
|
127
127
|
--px-color-icon-brand-inverted: #ffffff;
|
|
128
128
|
--px-color-icon-accent-default: #5C2D91;
|
|
@@ -143,8 +143,8 @@
|
|
|
143
143
|
--px-text-color-purpose-promo-inverted: #FF4371;
|
|
144
144
|
--px-color-icon-state-hover-default: #7d57a7;
|
|
145
145
|
--px-color-icon-state-hover-inverted: rgba(255, 255, 255, 0.80);
|
|
146
|
-
--px-color-icon-state-active-default: #
|
|
147
|
-
--px-color-icon-state-active-inverted:
|
|
146
|
+
--px-color-icon-state-active-default: #5C2D91;
|
|
147
|
+
--px-color-icon-state-active-inverted: #ffffff;
|
|
148
148
|
--px-color-icon-state-disabled-default: rgba(0, 0, 0, 0.12);
|
|
149
149
|
--px-color-icon-state-disabled-inverted: rgba(255, 255, 255, 0.16);
|
|
150
150
|
--px-color-text-brand-default: #5C2D91;
|
|
@@ -163,10 +163,10 @@
|
|
|
163
163
|
--px-color-text-purpose-unlimited-inverted: #0088F5;
|
|
164
164
|
--px-color-text-purpose-promo-default: #C7264D;
|
|
165
165
|
--px-color-text-purpose-promo-inverted: #FF4371;
|
|
166
|
-
--px-color-text-state-hover-default: #
|
|
166
|
+
--px-color-text-state-hover-default: #5C2D91;
|
|
167
167
|
--px-color-text-state-hover-inverted: rgba(255, 255, 255, 0.80);
|
|
168
|
-
--px-color-text-state-active-default: #
|
|
169
|
-
--px-color-text-state-active-inverted:
|
|
168
|
+
--px-color-text-state-active-default: #5C2D91;
|
|
169
|
+
--px-color-text-state-active-inverted: #ffffff;
|
|
170
170
|
--px-color-text-state-disabled-default: rgba(0, 0, 0, 0.12);
|
|
171
171
|
--px-color-text-state-disabled-inverted: rgba(255, 255, 255, 0.16);
|
|
172
172
|
--px-font-family: Proximus, Verdana, Helvetica, sans-serif;
|
|
@@ -217,7 +217,7 @@
|
|
|
217
217
|
--px-utility-size-s: 0.125em;
|
|
218
218
|
--px-utility-size-m: 0.5em;
|
|
219
219
|
--px-focus-l-mobile: 18px;
|
|
220
|
-
--px-focus-l-tablet:
|
|
220
|
+
--px-focus-l-tablet: 18px;
|
|
221
221
|
--px-focus-l-laptop: 20px;
|
|
222
222
|
--px-focus-l-desktop: 20px;
|
|
223
223
|
--px-focus-offset-mobile: 4px;
|
|
@@ -273,67 +273,67 @@
|
|
|
273
273
|
--px-padding-m-laptop: 24px;
|
|
274
274
|
--px-padding-m-desktop: 24px;
|
|
275
275
|
--px-padding-l-mobile: 24px;
|
|
276
|
-
--px-padding-l-tablet:
|
|
276
|
+
--px-padding-l-tablet: 24px;
|
|
277
277
|
--px-padding-l-laptop: 40px;
|
|
278
278
|
--px-padding-l-desktop: 40px;
|
|
279
279
|
--px-padding-xl-mobile: 40px;
|
|
280
|
-
--px-padding-xl-tablet:
|
|
280
|
+
--px-padding-xl-tablet: 40px;
|
|
281
281
|
--px-padding-xl-laptop: 80px;
|
|
282
282
|
--px-padding-xl-desktop: 80px;
|
|
283
283
|
--px-platform-default-width-mobile: 23.4375em;
|
|
284
|
+
--px-platform-default-width-tablet: 23.4375em;
|
|
284
285
|
--px-platform-default-width-laptop: 90em;
|
|
285
|
-
--px-platform-default-width-tablet: 90em;
|
|
286
286
|
--px-platform-default-width-desktop: 90em;
|
|
287
287
|
--px-content-wrapper-min-width-mobile: 21.4375em;
|
|
288
|
-
--px-content-wrapper-min-width-tablet:
|
|
288
|
+
--px-content-wrapper-min-width-tablet: 21.4375em;
|
|
289
289
|
--px-content-wrapper-min-width-laptop: 73.75em;
|
|
290
290
|
--px-content-wrapper-min-width-desktop: 73.75em;
|
|
291
291
|
--px-content-wrapper-max-width-mobile: 62em;
|
|
292
|
-
--px-content-wrapper-max-width-tablet:
|
|
292
|
+
--px-content-wrapper-max-width-tablet: 62em;
|
|
293
293
|
--px-content-wrapper-max-width-laptop: 73.75em;
|
|
294
294
|
--px-content-wrapper-max-width-desktop: 73.75em;
|
|
295
295
|
--px-price-size-decimal-s-mobile: 0.9375em;
|
|
296
|
-
--px-price-size-decimal-s-tablet:
|
|
296
|
+
--px-price-size-decimal-s-tablet: 0.9375em;
|
|
297
297
|
--px-price-size-decimal-s-laptop: 1em;
|
|
298
298
|
--px-price-size-decimal-s-desktop: 1em;
|
|
299
299
|
--px-price-size-decimal-m-mobile: 0.8125em;
|
|
300
|
-
--px-price-size-decimal-m-tablet:
|
|
300
|
+
--px-price-size-decimal-m-tablet: 0.8125em;
|
|
301
301
|
--px-price-size-decimal-m-laptop: 1em;
|
|
302
302
|
--px-price-size-decimal-m-desktop: 1em;
|
|
303
303
|
--px-price-size-decimal-l-mobile: 0.875em;
|
|
304
|
-
--px-price-size-decimal-l-tablet:
|
|
304
|
+
--px-price-size-decimal-l-tablet: 0.875em;
|
|
305
305
|
--px-price-size-decimal-l-laptop: 1.125em;
|
|
306
306
|
--px-price-size-decimal-l-desktop: 1.125em;
|
|
307
307
|
--px-price-size-sign-s-mobile: 0.875em;
|
|
308
|
-
--px-price-size-sign-s-tablet:
|
|
308
|
+
--px-price-size-sign-s-tablet: 0.875em;
|
|
309
309
|
--px-price-size-sign-s-laptop: 1.125em;
|
|
310
310
|
--px-price-size-sign-s-desktop: 1.125em;
|
|
311
311
|
--px-price-size-sign-m-mobile: 1em;
|
|
312
|
-
--px-price-size-sign-m-tablet:
|
|
312
|
+
--px-price-size-sign-m-tablet: 1em;
|
|
313
313
|
--px-price-size-sign-m-laptop: 1.3125em;
|
|
314
314
|
--px-price-size-sign-m-desktop: 1.3125em;
|
|
315
315
|
--px-price-size-sign-l-mobile: 1.25em;
|
|
316
|
-
--px-price-size-sign-l-tablet: 1.
|
|
316
|
+
--px-price-size-sign-l-tablet: 1.25em;
|
|
317
317
|
--px-price-size-sign-l-laptop: 1.75em;
|
|
318
318
|
--px-price-size-sign-l-desktop: 1.75em;
|
|
319
319
|
--px-price-size-unit-s-mobile: 1.125em;
|
|
320
|
-
--px-price-size-unit-s-tablet: 1.
|
|
320
|
+
--px-price-size-unit-s-tablet: 1.125em;
|
|
321
321
|
--px-price-size-unit-s-laptop: 1.25em;
|
|
322
322
|
--px-price-size-unit-s-desktop: 1.25em;
|
|
323
323
|
--px-price-size-unit-m-mobile: 1.25em;
|
|
324
|
-
--px-price-size-unit-m-tablet: 1.
|
|
324
|
+
--px-price-size-unit-m-tablet: 1.25em;
|
|
325
325
|
--px-price-size-unit-m-laptop: 1.5em;
|
|
326
326
|
--px-price-size-unit-m-desktop: 1.5em;
|
|
327
327
|
--px-price-size-unit-l-mobile: 1.75em;
|
|
328
|
-
--px-price-size-unit-l-tablet:
|
|
328
|
+
--px-price-size-unit-l-tablet: 1.75em;
|
|
329
329
|
--px-price-size-unit-l-laptop: 2em;
|
|
330
330
|
--px-price-size-unit-l-desktop: 2em;
|
|
331
331
|
--px-spacing-heading-to-subtitle-mobile: 8px;
|
|
332
|
-
--px-spacing-heading-to-subtitle-tablet:
|
|
332
|
+
--px-spacing-heading-to-subtitle-tablet: 8px;
|
|
333
333
|
--px-spacing-heading-to-subtitle-laptop: 16px;
|
|
334
334
|
--px-spacing-heading-to-subtitle-desktop: 16px;
|
|
335
335
|
--px-spacing-heading-to-content-mobile: 16px;
|
|
336
|
-
--px-spacing-heading-to-content-tablet:
|
|
336
|
+
--px-spacing-heading-to-content-tablet: 16px;
|
|
337
337
|
--px-spacing-heading-to-content-laptop: 24px;
|
|
338
338
|
--px-spacing-heading-to-content-desktop: 24px;
|
|
339
339
|
--px-none-mobile: 0px;
|
|
@@ -357,87 +357,87 @@
|
|
|
357
357
|
--px-spacing-default-laptop: 24px;
|
|
358
358
|
--px-spacing-default-desktop: 24px;
|
|
359
359
|
--px-spacing-l-mobile: 24px;
|
|
360
|
-
--px-spacing-l-tablet:
|
|
360
|
+
--px-spacing-l-tablet: 24px;
|
|
361
361
|
--px-spacing-l-laptop: 40px;
|
|
362
362
|
--px-spacing-l-desktop: 40px;
|
|
363
363
|
--px-overlapped-mobile: -24px;
|
|
364
|
-
--px-overlapped-tablet: -
|
|
364
|
+
--px-overlapped-tablet: -24px;
|
|
365
365
|
--px-overlapped-laptop: -40px;
|
|
366
366
|
--px-overlapped-desktop: -40px;
|
|
367
367
|
--px-spacing-page-layout-between-sections-mobile: 40px;
|
|
368
|
-
--px-spacing-page-layout-between-sections-tablet:
|
|
368
|
+
--px-spacing-page-layout-between-sections-tablet: 40px;
|
|
369
369
|
--px-spacing-page-layout-between-sections-laptop: 80px;
|
|
370
370
|
--px-spacing-page-layout-between-sections-desktop: 80px;
|
|
371
371
|
--px-text-size-body-l-mobile: 1em;
|
|
372
|
-
--px-text-size-body-l-tablet:
|
|
372
|
+
--px-text-size-body-l-tablet: 1em;
|
|
373
373
|
--px-text-size-body-l-laptop: 1.125em;
|
|
374
374
|
--px-text-size-body-l-desktop: 1.125em;
|
|
375
375
|
--px-text-size-body-m-mobile: 0.875em;
|
|
376
|
-
--px-text-size-body-m-tablet:
|
|
376
|
+
--px-text-size-body-m-tablet: 0.875em;
|
|
377
377
|
--px-text-size-body-m-laptop: 1em;
|
|
378
378
|
--px-text-size-body-m-desktop: 1em;
|
|
379
379
|
--px-text-size-body-s-mobile: 0.75em;
|
|
380
|
-
--px-text-size-body-s-tablet: 0.
|
|
380
|
+
--px-text-size-body-s-tablet: 0.75em;
|
|
381
381
|
--px-text-size-body-s-laptop: 0.875em;
|
|
382
382
|
--px-text-size-body-s-desktop: 0.875em;
|
|
383
383
|
--px-text-size-body-xs-mobile: 0.625em;
|
|
384
|
-
--px-text-size-body-xs-tablet: 0.
|
|
384
|
+
--px-text-size-body-xs-tablet: 0.625em;
|
|
385
385
|
--px-text-size-body-xs-laptop: 0.75em;
|
|
386
386
|
--px-text-size-body-xs-desktop: 0.75em;
|
|
387
387
|
--px-text-size-heading-5xl-mobile: 2.25em;
|
|
388
|
-
--px-text-size-heading-5xl-tablet: 2.
|
|
388
|
+
--px-text-size-heading-5xl-tablet: 2.25em;
|
|
389
389
|
--px-text-size-heading-5xl-laptop: 2.5em;
|
|
390
390
|
--px-text-size-heading-5xl-desktop: 2.5em;
|
|
391
391
|
--px-text-size-heading-4xl-mobile: 2em;
|
|
392
|
-
--px-text-size-heading-4xl-tablet:
|
|
392
|
+
--px-text-size-heading-4xl-tablet: 2em;
|
|
393
393
|
--px-text-size-heading-4xl-laptop: 2.25em;
|
|
394
394
|
--px-text-size-heading-4xl-desktop: 2.25em;
|
|
395
395
|
--px-text-size-heading-3xl-mobile: 1.75em;
|
|
396
|
-
--px-text-size-heading-3xl-tablet:
|
|
396
|
+
--px-text-size-heading-3xl-tablet: 1.75em;
|
|
397
397
|
--px-text-size-heading-3xl-laptop: 2em;
|
|
398
398
|
--px-text-size-heading-3xl-desktop: 2em;
|
|
399
399
|
--px-text-size-heading-2xl-mobile: 1.5em;
|
|
400
|
-
--px-text-size-heading-2xl-tablet: 1.
|
|
400
|
+
--px-text-size-heading-2xl-tablet: 1.5em;
|
|
401
401
|
--px-text-size-heading-2xl-laptop: 1.75em;
|
|
402
402
|
--px-text-size-heading-2xl-desktop: 1.75em;
|
|
403
403
|
--px-text-size-heading-xl-mobile: 1.25em;
|
|
404
|
-
--px-text-size-heading-xl-tablet: 1.
|
|
404
|
+
--px-text-size-heading-xl-tablet: 1.25em;
|
|
405
405
|
--px-text-size-heading-xl-laptop: 1.5em;
|
|
406
406
|
--px-text-size-heading-xl-desktop: 1.5em;
|
|
407
407
|
--px-text-size-heading-l-mobile: 1.125em;
|
|
408
|
-
--px-text-size-heading-l-tablet: 1.
|
|
408
|
+
--px-text-size-heading-l-tablet: 1.125em;
|
|
409
409
|
--px-text-size-heading-l-laptop: 1.25em;
|
|
410
410
|
--px-text-size-heading-l-desktop: 1.25em;
|
|
411
411
|
--px-text-size-heading-m-mobile: 1em;
|
|
412
|
-
--px-text-size-heading-m-tablet:
|
|
412
|
+
--px-text-size-heading-m-tablet: 1em;
|
|
413
413
|
--px-text-size-heading-m-laptop: 1.125em;
|
|
414
414
|
--px-text-size-heading-m-desktop: 1.125em;
|
|
415
415
|
--px-text-size-heading-s-mobile: 0.875em;
|
|
416
|
-
--px-text-size-heading-s-tablet:
|
|
416
|
+
--px-text-size-heading-s-tablet: 0.875em;
|
|
417
417
|
--px-text-size-heading-s-laptop: 1em;
|
|
418
418
|
--px-text-size-heading-s-desktop: 1em;
|
|
419
419
|
--px-text-size-label-l-mobile: 1em;
|
|
420
|
-
--px-text-size-label-l-tablet:
|
|
420
|
+
--px-text-size-label-l-tablet: 1em;
|
|
421
421
|
--px-text-size-label-l-laptop: 1.125em;
|
|
422
422
|
--px-text-size-label-l-desktop: 1.125em;
|
|
423
423
|
--px-text-size-label-m-mobile: 0.875em;
|
|
424
|
-
--px-text-size-label-m-tablet:
|
|
424
|
+
--px-text-size-label-m-tablet: 0.875em;
|
|
425
425
|
--px-text-size-label-m-laptop: 1em;
|
|
426
426
|
--px-text-size-label-m-desktop: 1em;
|
|
427
427
|
--px-text-size-label-s-mobile: 0.75em;
|
|
428
|
-
--px-text-size-label-s-tablet: 0.
|
|
428
|
+
--px-text-size-label-s-tablet: 0.75em;
|
|
429
429
|
--px-text-size-label-s-laptop: 0.875em;
|
|
430
430
|
--px-text-size-label-s-desktop: 0.875em;
|
|
431
431
|
--px-text-size-label-xs-mobile: 0.625em;
|
|
432
|
-
--px-text-size-label-xs-tablet: 0.
|
|
432
|
+
--px-text-size-label-xs-tablet: 0.625em;
|
|
433
433
|
--px-text-size-label-xs-laptop: 0.75em;
|
|
434
434
|
--px-text-size-label-xs-desktop: 0.75em;
|
|
435
435
|
--px-text-size-link-m-mobile: 0.875em;
|
|
436
|
-
--px-text-size-link-m-tablet:
|
|
436
|
+
--px-text-size-link-m-tablet: 0.875em;
|
|
437
437
|
--px-text-size-link-m-laptop: 1em;
|
|
438
438
|
--px-text-size-link-m-desktop: 1em;
|
|
439
439
|
--px-text-size-link-s-mobile: 0.75em;
|
|
440
|
-
--px-text-size-link-s-tablet: 0.
|
|
440
|
+
--px-text-size-link-s-tablet: 0.75em;
|
|
441
441
|
--px-text-size-link-s-laptop: 0.875em;
|
|
442
442
|
--px-text-size-link-s-desktop: 0.875em;
|
|
443
443
|
}
|