@proximus/lavender-styling 2.0.0-alpha.6 → 2.0.0-alpha.60

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