@wix/design-system-tokens 1.129.0 → 1.131.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 (26) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/all.css +86 -22
  3. package/all.scss +86 -22
  4. package/all.st.css +224 -96
  5. package/component.st.css +173 -59
  6. package/foundation.st.css +15 -15
  7. package/odeditor/all.css +84 -51
  8. package/odeditor/all.scss +84 -51
  9. package/odeditor/all.st.css +159 -93
  10. package/odeditor/component.st.css +112 -60
  11. package/odeditor/foundation.st.css +16 -16
  12. package/odeditor/semantic.st.css +31 -17
  13. package/package.json +2 -2
  14. package/semantic.st.css +36 -22
  15. package/studio/all.css +98 -33
  16. package/studio/all.scss +98 -33
  17. package/studio/all.st.css +264 -134
  18. package/studio/component.st.css +186 -70
  19. package/studio/foundation.st.css +17 -17
  20. package/studio/semantic.st.css +61 -47
  21. package/wixel/all.css +105 -29
  22. package/wixel/all.scss +105 -29
  23. package/wixel/all.st.css +247 -95
  24. package/wixel/component.st.css +178 -64
  25. package/wixel/foundation.st.css +10 -10
  26. package/wixel/semantic.st.css +59 -21
package/component.st.css CHANGED
@@ -13,7 +13,16 @@
13
13
  @property st-global(--wds-accordion-title-font-size-small);
14
14
  @property st-global(--wds-accordion-title-font-weight);
15
15
  @property st-global(--wds-accordion-title-font-weight-small);
16
+ @property st-global(--wds-add-item-border-color);
17
+ @property st-global(--wds-add-item-border-color-disabled);
18
+ @property st-global(--wds-add-item-border-color-hover);
19
+ @property st-global(--wds-add-item-border-dashed-radius);
16
20
  @property st-global(--wds-add-item-border-radius);
21
+ @property st-global(--wds-add-item-fill);
22
+ @property st-global(--wds-add-item-fill-disabled);
23
+ @property st-global(--wds-add-item-fill-hover);
24
+ @property st-global(--wds-add-item-fill-pressed);
25
+ @property st-global(--wds-add-item-label-color);
17
26
  @property st-global(--wds-add-item-padding-horizontal-large);
18
27
  @property st-global(--wds-add-item-padding-horizontal-tiny);
19
28
  @property st-global(--wds-add-item-padding-vertical-large);
@@ -37,6 +46,32 @@
37
46
  @property st-global(--wds-badge-border-radius-medium);
38
47
  @property st-global(--wds-badge-border-radius-small);
39
48
  @property st-global(--wds-badge-border-radius-tiny);
49
+ @property st-global(--wds-badge-label-font-line-height-small);
50
+ @property st-global(--wds-badge-label-font-size-small);
51
+ @property st-global(--wds-badge-outline-dark-border-color);
52
+ @property st-global(--wds-badge-outline-dark-fill);
53
+ @property st-global(--wds-badge-outline-dark-label-color);
54
+ @property st-global(--wds-badge-outline-destructive-border-color);
55
+ @property st-global(--wds-badge-outline-destructive-fill);
56
+ @property st-global(--wds-badge-outline-destructive-label-color);
57
+ @property st-global(--wds-badge-outline-neutral-border-color);
58
+ @property st-global(--wds-badge-outline-neutral-fill);
59
+ @property st-global(--wds-badge-outline-neutral-label-color);
60
+ @property st-global(--wds-badge-outline-premium-border-color);
61
+ @property st-global(--wds-badge-outline-premium-fill);
62
+ @property st-global(--wds-badge-outline-premium-label-color);
63
+ @property st-global(--wds-badge-outline-standard-border-color);
64
+ @property st-global(--wds-badge-outline-standard-fill);
65
+ @property st-global(--wds-badge-outline-standard-label-color);
66
+ @property st-global(--wds-badge-outline-success-border-color);
67
+ @property st-global(--wds-badge-outline-success-fill);
68
+ @property st-global(--wds-badge-outline-success-label-color);
69
+ @property st-global(--wds-badge-outline-urgent-border-color);
70
+ @property st-global(--wds-badge-outline-urgent-fill);
71
+ @property st-global(--wds-badge-outline-urgent-label-color);
72
+ @property st-global(--wds-badge-outline-warning-border-color);
73
+ @property st-global(--wds-badge-outline-warning-fill);
74
+ @property st-global(--wds-badge-outline-warning-label-color);
40
75
  @property st-global(--wds-badge-padding-horizontal-medium);
41
76
  @property st-global(--wds-badge-padding-horizontal-small);
42
77
  @property st-global(--wds-badge-padding-horizontal-tiny);
@@ -329,6 +364,11 @@
329
364
  @property st-global(--wds-field-set-label-font-weight);
330
365
  @property st-global(--wds-field-set-label-gap-small);
331
366
  @property st-global(--wds-field-set-label-gap-tiny);
367
+ @property st-global(--wds-fill-button-border-color);
368
+ @property st-global(--wds-fill-button-border-width);
369
+ @property st-global(--wds-fill-button-fill);
370
+ @property st-global(--wds-fill-button-fill-hover);
371
+ @property st-global(--wds-fill-button-icon-color);
332
372
  @property st-global(--wds-floating-helper-main-action-padding-top);
333
373
  @property st-global(--wds-floating-helper-padding-horizontal);
334
374
  @property st-global(--wds-floating-helper-padding-vertical);
@@ -533,12 +573,15 @@
533
573
  @property st-global(--wds-internal-thumbnail-illustration-size-small);
534
574
  @property st-global(--wds-internal-thumbnail-illustration-size-tiny);
535
575
  @property st-global(--wds-linear-progress-bar-border-radius);
576
+ @property st-global(--wds-linear-progress-bar-label-font-letter-spacing);
577
+ @property st-global(--wds-linear-progress-bar-label-font-line-height);
578
+ @property st-global(--wds-linear-progress-bar-value-gap);
579
+ @property st-global(--wds-list-item-action-affix-margin);
536
580
  @property st-global(--wds-list-item-action-border-radius);
537
581
  @property st-global(--wds-list-item-action-fill);
538
582
  @property st-global(--wds-list-item-action-fill-active);
539
583
  @property st-global(--wds-list-item-action-fill-hover);
540
- @property st-global(--wds-list-item-action-gap-medium);
541
- @property st-global(--wds-list-item-action-gap-small);
584
+ @property st-global(--wds-list-item-action-gap);
542
585
  @property st-global(--wds-list-item-action-label-fill-active);
543
586
  @property st-global(--wds-list-item-action-label-font-line-height-medium);
544
587
  @property st-global(--wds-list-item-action-label-font-line-height-small);
@@ -572,10 +615,13 @@
572
615
  @property st-global(--wds-list-item-padding-vertical-tiny);
573
616
  @property st-global(--wds-list-item-padding-vertical-x-tiny);
574
617
  @property st-global(--wds-list-item-padding-vertical-xx-tiny);
618
+ @property st-global(--wds-list-item-section-divider-padding-horizontal);
575
619
  @property st-global(--wds-list-item-section-fill);
620
+ @property st-global(--wds-list-item-section-font-line-height);
576
621
  @property st-global(--wds-list-item-section-font-size);
577
- @property st-global(--wds-list-item-section-line-height);
622
+ @property st-global(--wds-list-item-section-font-weight);
578
623
  @property st-global(--wds-list-item-section-padding-horizontal);
624
+ @property st-global(--wds-list-item-section-title-label-fill);
579
625
  @property st-global(--wds-list-item-select-active-fill);
580
626
  @property st-global(--wds-list-item-select-active-fill-active);
581
627
  @property st-global(--wds-list-item-select-active-fill-active-screen-small);
@@ -596,6 +642,7 @@
596
642
  @property st-global(--wds-list-item-select-fill-active);
597
643
  @property st-global(--wds-list-item-select-fill-disabled);
598
644
  @property st-global(--wds-list-item-select-fill-hover);
645
+ @property st-global(--wds-list-item-select-gap);
599
646
  @property st-global(--wds-list-item-select-icon-padding-horizontal-medium);
600
647
  @property st-global(--wds-list-item-select-icon-padding-horizontal-small);
601
648
  @property st-global(--wds-list-item-select-icon-padding-vertical-medium);
@@ -604,8 +651,9 @@
604
651
  @property st-global(--wds-list-item-select-label-font-line-height-small);
605
652
  @property st-global(--wds-list-item-select-label-font-size-medium);
606
653
  @property st-global(--wds-list-item-select-label-font-size-small);
654
+ @property st-global(--wds-list-item-select-label-font-weight-active);
607
655
  @property st-global(--wds-list-item-select-label-font-weight-medium);
608
- @property st-global(--wds-list-item-select-label-font-weight-small);
656
+ @property st-global(--wds-list-item-select-label-hover-font-weight-medium);
609
657
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
610
658
  @property st-global(--wds-list-item-select-padding-horizontal-small);
611
659
  @property st-global(--wds-list-item-select-padding-left-medium);
@@ -625,7 +673,6 @@
625
673
  @property st-global(--wds-list-item-select-suffix-pressed);
626
674
  @property st-global(--wds-list-item-select-title);
627
675
  @property st-global(--wds-list-item-select-title-disabled);
628
- @property st-global(--wds-list-item-select-title-pressed);
629
676
  @property st-global(--wds-loader-fill);
630
677
  @property st-global(--wds-loader-fill-error);
631
678
  @property st-global(--wds-loader-fill-light);
@@ -659,6 +706,8 @@
659
706
  @property st-global(--wds-mobile-modal-footer-padding-horizontal);
660
707
  @property st-global(--wds-mobile-modal-footer-padding-vertical);
661
708
  @property st-global(--wds-multiselect-icon-fill);
709
+ @property st-global(--wds-nestable-list-fill);
710
+ @property st-global(--wds-nestable-list-paddings);
662
711
  @property st-global(--wds-notification-fill-error);
663
712
  @property st-global(--wds-notification-fill-premium);
664
713
  @property st-global(--wds-notification-fill-standard);
@@ -768,6 +817,8 @@
768
817
  @property st-global(--wds-segmented-toggle-border-width-default);
769
818
  @property st-global(--wds-segmented-toggle-border-width-hover);
770
819
  @property st-global(--wds-segmented-toggle-border-width-selected);
820
+ @property st-global(--wds-segmented-toggle-container-border-radius-medium);
821
+ @property st-global(--wds-segmented-toggle-container-border-radius-small);
771
822
  @property st-global(--wds-segmented-toggle-fill);
772
823
  @property st-global(--wds-segmented-toggle-fill-default);
773
824
  @property st-global(--wds-segmented-toggle-fill-disabled);
@@ -844,11 +895,13 @@
844
895
  @property st-global(--wds-side-panel-floating-title-font-line-height);
845
896
  @property st-global(--wds-side-panel-floating-title-font-size);
846
897
  @property st-global(--wds-side-panel-footer-border-width);
898
+ @property st-global(--wds-side-panel-footer-divider-height);
847
899
  @property st-global(--wds-side-panel-footer-fill);
848
900
  @property st-global(--wds-side-panel-footer-padding-horizontal);
849
901
  @property st-global(--wds-side-panel-footer-padding-vertical);
850
902
  @property st-global(--wds-side-panel-footnote-padding-horizontal);
851
903
  @property st-global(--wds-side-panel-footnote-padding-vertical);
904
+ @property st-global(--wds-side-panel-header-divider-height);
852
905
  @property st-global(--wds-side-panel-header-padding-left);
853
906
  @property st-global(--wds-side-panel-header-padding-right);
854
907
  @property st-global(--wds-side-panel-header-padding-vertical);
@@ -938,12 +991,10 @@
938
991
  @property st-global(--wds-social-post-preview-content-padding-vertical);
939
992
  @property st-global(--wds-social-preview-content-padding-horizontal);
940
993
  @property st-global(--wds-social-preview-content-padding-vertical);
941
- @property st-global(--wds-status-toast-horizontal-padding);
942
994
  @property st-global(--wds-status-toast-info-icon-fill);
943
995
  @property st-global(--wds-status-toast-text-fill);
944
996
  @property st-global(--wds-status-toast-text-font-line-height);
945
997
  @property st-global(--wds-status-toast-text-font-size);
946
- @property st-global(--wds-status-toast-vertical-padding);
947
998
  @property st-global(--wds-status-toast-width);
948
999
  @property st-global(--wds-stepper-prefix-size-circle);
949
1000
  @property st-global(--wds-stepper-prefix-size-number);
@@ -960,6 +1011,7 @@
960
1011
  @property st-global(--wds-swatches-swatch-size-small);
961
1012
  @property st-global(--wds-swatches-swatch-size-tiny);
962
1013
  @property st-global(--wds-swatches-swatch-size-x-tiny);
1014
+ @property st-global(--wds-table-list-item-border-color);
963
1015
  @property st-global(--wds-table-list-item-border-radius);
964
1016
  @property st-global(--wds-table-list-item-drag-handle-color);
965
1017
  @property st-global(--wds-table-list-item-fill);
@@ -1021,6 +1073,7 @@
1021
1073
  @property st-global(--wds-thumbnail-illustration-fill-1);
1022
1074
  @property st-global(--wds-thumbnail-illustration-fill-2);
1023
1075
  @property st-global(--wds-thumbnail-illustration-fill-3);
1076
+ @property st-global(--wds-thumbnail-overlay-fill);
1024
1077
  @property st-global(--wds-thumbnail-subtitle-fill);
1025
1078
  @property st-global(--wds-thumbnail-subtitle-font-line-height-tiny);
1026
1079
  @property st-global(--wds-thumbnail-subtitle-font-size-tiny);
@@ -1031,6 +1084,8 @@
1031
1084
  @property st-global(--wds-timeline-title-font-line-height);
1032
1085
  @property st-global(--wds-timeline-title-font-size);
1033
1086
  @property st-global(--wds-toast-background-fill);
1087
+ @property st-global(--wds-toast-horizontal-padding);
1088
+ @property st-global(--wds-toast-vertical-padding);
1034
1089
  @property st-global(--wds-toggle-button-border-color-dark);
1035
1090
  @property st-global(--wds-toggle-button-border-color-dark-disabled);
1036
1091
  @property st-global(--wds-toggle-button-border-color-dark-hover);
@@ -1175,6 +1230,8 @@
1175
1230
  @property st-global(--wds-tooltip-padding-vertical-medium);
1176
1231
  @property st-global(--wds-tooltip-padding-vertical-small);
1177
1232
  @property st-global(--wds-tooltip-text-fill);
1233
+ @property st-global(--wds-variable-input-padding-vertical-small);
1234
+ @property st-global(--wds-variable-input-padding-vertical-tiny);
1178
1235
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
1179
1236
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-small);
1180
1237
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-tiny);
@@ -1256,7 +1313,7 @@
1256
1313
  .root {
1257
1314
  --wds-accordion-background-fill-light: #ffffff;
1258
1315
  --wds-accordion-background-fill-light-hover: #e7f0ff;
1259
- --wds-accordion-border-radius: 0;
1316
+ --wds-accordion-border-radius: 0px;
1260
1317
  --wds-accordion-caret-fill: #44485f;
1261
1318
  --wds-accordion-caret-fill-hover: #44485f;
1262
1319
  --wds-accordion-inner-content-fill: #f4f7ff;
@@ -1269,7 +1326,16 @@
1269
1326
  --wds-accordion-title-font-size-small: 14px;
1270
1327
  --wds-accordion-title-font-weight: 500;
1271
1328
  --wds-accordion-title-font-weight-small: 500;
1329
+ --wds-add-item-border-color: #a8caff;
1330
+ --wds-add-item-border-color-disabled: rgba(0, 6, 36, .1);
1331
+ --wds-add-item-border-color-hover: #5999ff;
1332
+ --wds-add-item-border-dashed-radius: 2px;
1272
1333
  --wds-add-item-border-radius: 8px;
1334
+ --wds-add-item-fill: #f4f7ff;
1335
+ --wds-add-item-fill-disabled: rgba(0, 6, 36, .05);
1336
+ --wds-add-item-fill-hover: #e7f0ff;
1337
+ --wds-add-item-fill-pressed: #d6e6fe;
1338
+ --wds-add-item-label-color: #116dff;
1273
1339
  --wds-add-item-padding-horizontal-large: 30px;
1274
1340
  --wds-add-item-padding-horizontal-tiny: 12px;
1275
1341
  --wds-add-item-padding-vertical-large: 30px;
@@ -1293,12 +1359,38 @@
1293
1359
  --wds-badge-border-radius-medium: 2px;
1294
1360
  --wds-badge-border-radius-small: 2px;
1295
1361
  --wds-badge-border-radius-tiny: 2px;
1362
+ --wds-badge-label-font-line-height-small: 18px;
1363
+ --wds-badge-label-font-size-small: 14px;
1364
+ --wds-badge-outline-dark-border-color: #868aa5;
1365
+ --wds-badge-outline-dark-fill: #ffffff;
1366
+ --wds-badge-outline-dark-label-color: #44485f;
1367
+ --wds-badge-outline-destructive-border-color: #f69891;
1368
+ --wds-badge-outline-destructive-fill: #ffffff;
1369
+ --wds-badge-outline-destructive-label-color: #e62214;
1370
+ --wds-badge-outline-neutral-border-color: #868aa5;
1371
+ --wds-badge-outline-neutral-fill: #ffffff;
1372
+ --wds-badge-outline-neutral-label-color: #868aa5;
1373
+ --wds-badge-outline-premium-border-color: #cf8cf1;
1374
+ --wds-badge-outline-premium-fill: #ffffff;
1375
+ --wds-badge-outline-premium-label-color: #9a27d5;
1376
+ --wds-badge-outline-standard-border-color: #a8caff;
1377
+ --wds-badge-outline-standard-fill: #ffffff;
1378
+ --wds-badge-outline-standard-label-color: #116dff;
1379
+ --wds-badge-outline-success-border-color: #87cea5;
1380
+ --wds-badge-outline-success-fill: #ffffff;
1381
+ --wds-badge-outline-success-label-color: #25a55a;
1382
+ --wds-badge-outline-urgent-border-color: #fcbd9c;
1383
+ --wds-badge-outline-urgent-fill: #ffffff;
1384
+ --wds-badge-outline-urgent-label-color: #fe620f;
1385
+ --wds-badge-outline-warning-border-color: #ffd16e;
1386
+ --wds-badge-outline-warning-fill: #ffffff;
1387
+ --wds-badge-outline-warning-label-color: #ffb700;
1296
1388
  --wds-badge-padding-horizontal-medium: 12px;
1297
1389
  --wds-badge-padding-horizontal-small: 6px;
1298
1390
  --wds-badge-padding-horizontal-tiny: 6px;
1299
1391
  --wds-badge-padding-vertical-medium: 3px;
1300
- --wds-badge-padding-vertical-small: 0;
1301
- --wds-badge-padding-vertical-tiny: 0;
1392
+ --wds-badge-padding-vertical-small: 0px;
1393
+ --wds-badge-padding-vertical-tiny: 0px;
1302
1394
  --wds-badge-size-medium: 24px;
1303
1395
  --wds-badge-size-small: 18px;
1304
1396
  --wds-badge-size-tiny: 18px;
@@ -1432,11 +1524,11 @@
1432
1524
  --wds-card-content-padding-medium: 24px;
1433
1525
  --wds-card-content-paddings-horizontal: 24px;
1434
1526
  --wds-card-content-paddings-vertical: 18px;
1435
- --wds-card-gallery-item-border-radius-0: 0;
1527
+ --wds-card-gallery-item-border-radius-0: 0px;
1436
1528
  --wds-card-gallery-item-border-radius-100: 8px;
1437
- --wds-card-gallery-item-content-margin-vertical: 0;
1529
+ --wds-card-gallery-item-content-margin-vertical: 0px;
1438
1530
  --wds-card-gallery-item-fill: #ffffff;
1439
- --wds-card-gallery-item-image-border-radius-bottom: 0;
1531
+ --wds-card-gallery-item-image-border-radius-bottom: 0px;
1440
1532
  --wds-card-gallery-item-image-border-radius-top: 8px;
1441
1533
  --wds-card-gallery-item-overlay-fill: rgba(68, 72, 95, .5);
1442
1534
  --wds-card-gallery-item-padding-left-medium: 18px;
@@ -1569,7 +1661,7 @@
1569
1661
  --wds-dropdown-icon-fill-disabled: rgba(0, 6, 36, .3);
1570
1662
  --wds-dropdown-layout-option-size-big: 48px;
1571
1663
  --wds-dropdown-layout-option-size-small: 36px;
1572
- --wds-dropdown-list-paddings: 0;
1664
+ --wds-dropdown-list-paddings: 0px;
1573
1665
  --wds-empty-state-border-radius: 8px;
1574
1666
  --wds-empty-state-page-content-paddings: 18px;
1575
1667
  --wds-empty-state-section-content-paddings: 15px;
@@ -1585,6 +1677,11 @@
1585
1677
  --wds-field-set-label-font-weight: 400;
1586
1678
  --wds-field-set-label-gap-small: 9px;
1587
1679
  --wds-field-set-label-gap-tiny: 6px;
1680
+ --wds-fill-button-border-color: #d6e6fe;
1681
+ --wds-fill-button-border-width: 0px;
1682
+ --wds-fill-button-fill: #d6e6fe;
1683
+ --wds-fill-button-fill-hover: #a8caff;
1684
+ --wds-fill-button-icon-color: #116dff;
1588
1685
  --wds-floating-helper-main-action-padding-top: 18px;
1589
1686
  --wds-floating-helper-padding-horizontal: 36px;
1590
1687
  --wds-floating-helper-padding-vertical: 30px;
@@ -1715,7 +1812,7 @@
1715
1812
  --wds-icon-button-color-text-standard-tertiary-disabled: rgba(0, 6, 36, .3);
1716
1813
  --wds-icon-button-color-text-standard-tertiary-hover: #116dff;
1717
1814
  --wds-image-border-radius-default: 8px;
1718
- --wds-image-border-radius-none: 0;
1815
+ --wds-image-border-radius-none: 0px;
1719
1816
  --wds-info-icon-fill: #116dff;
1720
1817
  --wds-info-icon-fill-hover: #116dff;
1721
1818
  --wds-input-area-border-radius-default-medium: 6px;
@@ -1744,7 +1841,7 @@
1744
1841
  --wds-input-border-radius-round-medium: 1000px;
1745
1842
  --wds-input-border-radius-round-small: 1000px;
1746
1843
  --wds-input-border-radius-round-tiny: 1000px;
1747
- --wds-input-border-width-default: 0;
1844
+ --wds-input-border-width-default: 0px;
1748
1845
  --wds-input-icon-affix-fill: #116dff;
1749
1846
  --wds-input-padding-horizontal-large: 9px;
1750
1847
  --wds-input-padding-horizontal-medium: 6px;
@@ -1789,12 +1886,15 @@
1789
1886
  --wds-internal-thumbnail-illustration-size-small: 51px;
1790
1887
  --wds-internal-thumbnail-illustration-size-tiny: 38px;
1791
1888
  --wds-linear-progress-bar-border-radius: 1000px;
1792
- --wds-list-item-action-border-radius: 0;
1889
+ --wds-linear-progress-bar-label-font-letter-spacing: 1px;
1890
+ --wds-linear-progress-bar-label-font-line-height: 18px;
1891
+ --wds-linear-progress-bar-value-gap: 18px;
1892
+ --wds-list-item-action-affix-margin: 6px;
1893
+ --wds-list-item-action-border-radius: 0px;
1793
1894
  --wds-list-item-action-fill: #ffffff;
1794
1895
  --wds-list-item-action-fill-active: #d6e6fe;
1795
1896
  --wds-list-item-action-fill-hover: #e7f0ff;
1796
- --wds-list-item-action-gap-medium: 6px;
1797
- --wds-list-item-action-gap-small: 6px;
1897
+ --wds-list-item-action-gap: 0px;
1798
1898
  --wds-list-item-action-label-fill-active: #116dff;
1799
1899
  --wds-list-item-action-label-font-line-height-medium: 24px;
1800
1900
  --wds-list-item-action-label-font-line-height-small: 18px;
@@ -1828,10 +1928,13 @@
1828
1928
  --wds-list-item-padding-vertical-tiny: 12px;
1829
1929
  --wds-list-item-padding-vertical-x-tiny: 6px;
1830
1930
  --wds-list-item-padding-vertical-xx-tiny: 3px;
1931
+ --wds-list-item-section-divider-padding-horizontal: 24px;
1831
1932
  --wds-list-item-section-fill: #ffffff;
1933
+ --wds-list-item-section-font-line-height: 18px;
1832
1934
  --wds-list-item-section-font-size: 14px;
1833
- --wds-list-item-section-line-height: 18px;
1935
+ --wds-list-item-section-font-weight: 700;
1834
1936
  --wds-list-item-section-padding-horizontal: 24px;
1937
+ --wds-list-item-section-title-label-fill: #868aa5;
1835
1938
  --wds-list-item-select-active-fill: #116dff;
1836
1939
  --wds-list-item-select-active-fill-active: #084ebd;
1837
1940
  --wds-list-item-select-active-fill-active-screen-small: #d6e6fe;
@@ -1847,11 +1950,12 @@
1847
1950
  --wds-list-item-select-active-title-disabled-screen-small: rgba(0, 6, 36, .3);
1848
1951
  --wds-list-item-select-active-title-screen-small: #116dff;
1849
1952
  --wds-list-item-select-affix-margin: 6px;
1850
- --wds-list-item-select-border-radius: 0;
1953
+ --wds-list-item-select-border-radius: 0px;
1851
1954
  --wds-list-item-select-fill: #ffffff;
1852
1955
  --wds-list-item-select-fill-active: #d6e6fe;
1853
1956
  --wds-list-item-select-fill-disabled: #ffffff;
1854
1957
  --wds-list-item-select-fill-hover: #e7f0ff;
1958
+ --wds-list-item-select-gap: 0px;
1855
1959
  --wds-list-item-select-icon-padding-horizontal-medium: 12px;
1856
1960
  --wds-list-item-select-icon-padding-horizontal-small: 12px;
1857
1961
  --wds-list-item-select-icon-padding-vertical-medium: 6px;
@@ -1860,8 +1964,9 @@
1860
1964
  --wds-list-item-select-label-font-line-height-small: 18px;
1861
1965
  --wds-list-item-select-label-font-size-medium: 16px;
1862
1966
  --wds-list-item-select-label-font-size-small: 14px;
1967
+ --wds-list-item-select-label-font-weight-active: 400;
1863
1968
  --wds-list-item-select-label-font-weight-medium: 400;
1864
- --wds-list-item-select-label-font-weight-small: 400;
1969
+ --wds-list-item-select-label-hover-font-weight-medium: 400;
1865
1970
  --wds-list-item-select-padding-horizontal-medium: 18px;
1866
1971
  --wds-list-item-select-padding-horizontal-small: 18px;
1867
1972
  --wds-list-item-select-padding-left-medium: 18px;
@@ -1881,7 +1986,6 @@
1881
1986
  --wds-list-item-select-suffix-pressed: #868aa5;
1882
1987
  --wds-list-item-select-title: #000624;
1883
1988
  --wds-list-item-select-title-disabled: rgba(0, 6, 36, .3);
1884
- --wds-list-item-select-title-pressed: #000624;
1885
1989
  --wds-loader-fill: #d6e6fe;
1886
1990
  --wds-loader-fill-error: #e62214;
1887
1991
  --wds-loader-fill-light: #ffffff;
@@ -1915,6 +2019,8 @@
1915
2019
  --wds-mobile-modal-footer-padding-horizontal: 24px;
1916
2020
  --wds-mobile-modal-footer-padding-vertical: 24px;
1917
2021
  --wds-multiselect-icon-fill: #116dff;
2022
+ --wds-nestable-list-fill: #ffffff;
2023
+ --wds-nestable-list-paddings: 0px;
1918
2024
  --wds-notification-fill-error: #ff6d63;
1919
2025
  --wds-notification-fill-premium: #c161f0;
1920
2026
  --wds-notification-fill-standard: #5999ff;
@@ -1935,10 +2041,10 @@
1935
2041
  --wds-palette-border: 6px;
1936
2042
  --wds-popover-border-fill: rgba(0, 6, 36, 0);
1937
2043
  --wds-popover-border-radius: 8px;
1938
- --wds-popover-border-width: 0;
2044
+ --wds-popover-border-width: 0px;
1939
2045
  --wds-popover-fill: #ffffff;
1940
2046
  --wds-popover-menu-border-radius: 8px;
1941
- --wds-popover-menu-paddings-horizontal: 0;
2047
+ --wds-popover-menu-paddings-horizontal: 0px;
1942
2048
  --wds-popover-menu-paddings-vertical: 12px;
1943
2049
  --wds-radio-border: #116dff;
1944
2050
  --wds-radio-border-active: #116dff;
@@ -1959,9 +2065,9 @@
1959
2065
  --wds-radio-group-gap-horizontal-small: 24px;
1960
2066
  --wds-radio-group-gap-vertical-medium: 12px;
1961
2067
  --wds-radio-group-gap-vertical-small: 6px;
1962
- --wds-radio-group-item-padding-default-horizontal: 0;
1963
- --wds-radio-group-item-padding-default-horizontal-screen-small: 0;
1964
- --wds-radio-group-item-padding-default-vertical: 0;
2068
+ --wds-radio-group-item-padding-default-horizontal: 0px;
2069
+ --wds-radio-group-item-padding-default-horizontal-screen-small: 0px;
2070
+ --wds-radio-group-item-padding-default-vertical: 0px;
1965
2071
  --wds-radio-group-item-padding-default-vertical-screen-small: 12px;
1966
2072
  --wds-radio-group-item-padding-filled-horizontal: 18px;
1967
2073
  --wds-radio-group-item-padding-filled-horizontal-screen-small: 18px;
@@ -2024,6 +2130,8 @@
2024
2130
  --wds-segmented-toggle-border-width-default: 1px;
2025
2131
  --wds-segmented-toggle-border-width-hover: 1px;
2026
2132
  --wds-segmented-toggle-border-width-selected: 2px;
2133
+ --wds-segmented-toggle-container-border-radius-medium: 6px;
2134
+ --wds-segmented-toggle-container-border-radius-small: 6px;
2027
2135
  --wds-segmented-toggle-fill: #ffffff;
2028
2136
  --wds-segmented-toggle-fill-default: #ffffff;
2029
2137
  --wds-segmented-toggle-fill-disabled: #ffffff;
@@ -2038,7 +2146,7 @@
2038
2146
  --wds-segmented-toggle-label-font-line-height-small: 18px;
2039
2147
  --wds-segmented-toggle-label-font-size-medium: 16px;
2040
2148
  --wds-segmented-toggle-label-font-size-small: 14px;
2041
- --wds-segmented-toggle-padding-container: 0;
2149
+ --wds-segmented-toggle-padding-container: 0px;
2042
2150
  --wds-segmented-toggle-padding-horizontal-medium: 24px;
2043
2151
  --wds-segmented-toggle-padding-horizontal-small: 12px;
2044
2152
  --wds-segmented-toggle-padding-vertical-medium: 6px;
@@ -2086,7 +2194,7 @@
2086
2194
  --wds-selector-list-item-padding-horizontal-small: 18px;
2087
2195
  --wds-selector-list-item-padding-vertical-medium: 12px;
2088
2196
  --wds-selector-list-item-padding-vertical-small: 6px;
2089
- --wds-side-panel-back-button-top-padding: 0;
2197
+ --wds-side-panel-back-button-top-padding: 0px;
2090
2198
  --wds-side-panel-content-padding-horizontal: 24px;
2091
2199
  --wds-side-panel-content-padding-vertical: 24px;
2092
2200
  --wds-side-panel-control-layout-divider-border-width: 1px;
@@ -2099,16 +2207,18 @@
2099
2207
  --wds-side-panel-floating-max-height: 576px;
2100
2208
  --wds-side-panel-floating-title-font-line-height: 24px;
2101
2209
  --wds-side-panel-floating-title-font-size: 16px;
2102
- --wds-side-panel-footer-border-width: 0;
2210
+ --wds-side-panel-footer-border-width: 0px;
2211
+ --wds-side-panel-footer-divider-height: 1px;
2103
2212
  --wds-side-panel-footer-fill: #ffffff;
2104
2213
  --wds-side-panel-footer-padding-horizontal: 24px;
2105
2214
  --wds-side-panel-footer-padding-vertical: 18px;
2106
2215
  --wds-side-panel-footnote-padding-horizontal: 24px;
2107
2216
  --wds-side-panel-footnote-padding-vertical: 12px;
2217
+ --wds-side-panel-header-divider-height: 1px;
2108
2218
  --wds-side-panel-header-padding-left: 24px;
2109
2219
  --wds-side-panel-header-padding-right: 9px;
2110
2220
  --wds-side-panel-header-padding-vertical: 18px;
2111
- --wds-side-panel-title-font-letter-spacing: 0;
2221
+ --wds-side-panel-title-font-letter-spacing: 0px;
2112
2222
  --wds-side-panel-title-font-line-height: 24px;
2113
2223
  --wds-side-panel-title-font-size: 18px;
2114
2224
  --wds-sidebar-clear-button-fill: #5a5d63;
@@ -2194,12 +2304,10 @@
2194
2304
  --wds-social-post-preview-content-padding-vertical: 12px;
2195
2305
  --wds-social-preview-content-padding-horizontal: 12px;
2196
2306
  --wds-social-preview-content-padding-vertical: 9px;
2197
- --wds-status-toast-horizontal-padding: 12px;
2198
2307
  --wds-status-toast-info-icon-fill: #ffffff;
2199
2308
  --wds-status-toast-text-fill: #ffffff;
2200
2309
  --wds-status-toast-text-font-line-height: 24px;
2201
2310
  --wds-status-toast-text-font-size: 16px;
2202
- --wds-status-toast-vertical-padding: 9px;
2203
2311
  --wds-status-toast-width: 600px;
2204
2312
  --wds-stepper-prefix-size-circle: 30px;
2205
2313
  --wds-stepper-prefix-size-number: 24px;
@@ -2216,7 +2324,8 @@
2216
2324
  --wds-swatches-swatch-size-small: 30px;
2217
2325
  --wds-swatches-swatch-size-tiny: 24px;
2218
2326
  --wds-swatches-swatch-size-x-tiny: 18px;
2219
- --wds-table-list-item-border-radius: 0;
2327
+ --wds-table-list-item-border-color: #d6e6fe;
2328
+ --wds-table-list-item-border-radius: 0px;
2220
2329
  --wds-table-list-item-drag-handle-color: #116dff;
2221
2330
  --wds-table-list-item-fill: #ffffff;
2222
2331
  --wds-table-list-item-fill-active: #d6e6fe;
@@ -2224,10 +2333,10 @@
2224
2333
  --wds-table-list-item-gap: 24px;
2225
2334
  --wds-table-list-item-indentation-level-2: 12px;
2226
2335
  --wds-table-list-item-indentation-level-3: 36px;
2227
- --wds-table-list-item-paddings: 0;
2336
+ --wds-table-list-item-paddings: 0px;
2228
2337
  --wds-table-toolbar-padding-horizontal: 24px;
2229
- --wds-tabs-border-radius: 0;
2230
- --wds-tabs-gap-horizontal: 0;
2338
+ --wds-tabs-border-radius: 0px;
2339
+ --wds-tabs-gap-horizontal: 0px;
2231
2340
  --wds-tabs-item-fill-active: rgba(0, 6, 36, 0);
2232
2341
  --wds-tabs-item-fill-hover: rgba(0, 6, 36, 0);
2233
2342
  --wds-tabs-item-gap-medium: 6px;
@@ -2259,7 +2368,7 @@
2259
2368
  --wds-tag-padding-vertical-large: 6px;
2260
2369
  --wds-tag-padding-vertical-medium: 6px;
2261
2370
  --wds-tag-padding-vertical-small: 3px;
2262
- --wds-tag-padding-vertical-tiny: 0;
2371
+ --wds-tag-padding-vertical-tiny: 0px;
2263
2372
  --wds-tag-size-large: 36px;
2264
2373
  --wds-tag-size-medium: 30px;
2265
2374
  --wds-tag-size-small: 24px;
@@ -2277,6 +2386,7 @@
2277
2386
  --wds-thumbnail-illustration-fill-1: #80b1ff;
2278
2387
  --wds-thumbnail-illustration-fill-2: #116dff;
2279
2388
  --wds-thumbnail-illustration-fill-3: #e7f0ff;
2389
+ --wds-thumbnail-overlay-fill: rgba(0, 6, 36, 0);
2280
2390
  --wds-thumbnail-subtitle-fill: #44485f;
2281
2391
  --wds-thumbnail-subtitle-font-line-height-tiny: 18px;
2282
2392
  --wds-thumbnail-subtitle-font-size-tiny: 12px;
@@ -2287,6 +2397,8 @@
2287
2397
  --wds-timeline-title-font-line-height: 18px;
2288
2398
  --wds-timeline-title-font-size: 14px;
2289
2399
  --wds-toast-background-fill: #000624;
2400
+ --wds-toast-horizontal-padding: 12px;
2401
+ --wds-toast-vertical-padding: 9px;
2290
2402
  --wds-toggle-button-border-color-dark: #dfe5eb;
2291
2403
  --wds-toggle-button-border-color-dark-disabled: rgba(0, 6, 36, .1);
2292
2404
  --wds-toggle-button-border-color-dark-hover: #d6e6fe;
@@ -2318,12 +2430,12 @@
2318
2430
  --wds-toggle-button-fill-standard-selected: #d6e6fe;
2319
2431
  --wds-toggle-button-fill-standard-selected-disabled: rgba(0, 6, 36, .3);
2320
2432
  --wds-toggle-button-fill-standard-selected-hover: #a8caff;
2321
- --wds-toggle-button-inner-shadow-blur-primary: 0;
2322
- --wds-toggle-button-inner-shadow-blur-secondary: 0;
2433
+ --wds-toggle-button-inner-shadow-blur-primary: 0px;
2434
+ --wds-toggle-button-inner-shadow-blur-secondary: 0px;
2323
2435
  --wds-toggle-button-inner-shadow-fill-primary: rgba(255, 255, 255, 0);
2324
2436
  --wds-toggle-button-inner-shadow-fill-secondary: rgba(255, 255, 255, 0);
2325
- --wds-toggle-button-inner-shadow-x-primary: 0;
2326
- --wds-toggle-button-inner-shadow-x-secondary: 0;
2437
+ --wds-toggle-button-inner-shadow-x-primary: 0px;
2438
+ --wds-toggle-button-inner-shadow-x-secondary: 0px;
2327
2439
  --wds-toggle-button-inner-shadow-y-primary: 0;
2328
2440
  --wds-toggle-button-inner-shadow-y-secondary: 0;
2329
2441
  --wds-toggle-button-label-fill-dark-default: #000624;
@@ -2360,24 +2472,24 @@
2360
2472
  --wds-toggle-button-padding-small-round: 18px;
2361
2473
  --wds-toggle-button-padding-tiny: 6px;
2362
2474
  --wds-toggle-button-padding-tiny-round: 12px;
2363
- --wds-toggle-button-shadow-blur-primary: 0;
2364
- --wds-toggle-button-shadow-blur-primary-inverted: 0;
2365
- --wds-toggle-button-shadow-blur-secondary: 0;
2366
- --wds-toggle-button-shadow-blur-secondary-inverted: 0;
2367
- --wds-toggle-button-shadow-blur-tertiary: 0;
2368
- --wds-toggle-button-shadow-blur-tertiary-inverted: 0;
2475
+ --wds-toggle-button-shadow-blur-primary: 0px;
2476
+ --wds-toggle-button-shadow-blur-primary-inverted: 0px;
2477
+ --wds-toggle-button-shadow-blur-secondary: 0px;
2478
+ --wds-toggle-button-shadow-blur-secondary-inverted: 0px;
2479
+ --wds-toggle-button-shadow-blur-tertiary: 0px;
2480
+ --wds-toggle-button-shadow-blur-tertiary-inverted: 0px;
2369
2481
  --wds-toggle-button-shadow-fill-primary: rgba(0, 6, 36, 0);
2370
2482
  --wds-toggle-button-shadow-fill-primary-inverted: rgba(0, 6, 36, 0);
2371
2483
  --wds-toggle-button-shadow-fill-secondary: rgba(0, 6, 36, 0);
2372
2484
  --wds-toggle-button-shadow-fill-secondary-inverted: rgba(0, 6, 36, 0);
2373
2485
  --wds-toggle-button-shadow-fill-tertiary: rgba(0, 6, 36, 0);
2374
2486
  --wds-toggle-button-shadow-fill-tertiary-inverted: rgba(0, 6, 36, 0);
2375
- --wds-toggle-button-shadow-x-primary: 0;
2376
- --wds-toggle-button-shadow-x-primary-inverted: 0;
2377
- --wds-toggle-button-shadow-x-secondary: 0;
2378
- --wds-toggle-button-shadow-x-secondary-inverted: 0;
2379
- --wds-toggle-button-shadow-x-tertiary: 0;
2380
- --wds-toggle-button-shadow-x-tertiary-inverted: 0;
2487
+ --wds-toggle-button-shadow-x-primary: 0px;
2488
+ --wds-toggle-button-shadow-x-primary-inverted: 0px;
2489
+ --wds-toggle-button-shadow-x-secondary: 0px;
2490
+ --wds-toggle-button-shadow-x-secondary-inverted: 0px;
2491
+ --wds-toggle-button-shadow-x-tertiary: 0px;
2492
+ --wds-toggle-button-shadow-x-tertiary-inverted: 0px;
2381
2493
  --wds-toggle-button-shadow-y-primary: 0;
2382
2494
  --wds-toggle-button-shadow-y-primary-inverted: 0;
2383
2495
  --wds-toggle-button-shadow-y-secondary: 0;
@@ -2431,15 +2543,17 @@
2431
2543
  --wds-tooltip-padding-vertical-medium: 12px;
2432
2544
  --wds-tooltip-padding-vertical-small: 6px;
2433
2545
  --wds-tooltip-text-fill: #ffffff;
2546
+ --wds-variable-input-padding-vertical-small: 6px;
2547
+ --wds-variable-input-padding-vertical-tiny: 3px;
2434
2548
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
2435
2549
  --wds-vertical-tabs-action-padding-horizontal-small: 24px;
2436
2550
  --wds-vertical-tabs-action-padding-horizontal-tiny: 24px;
2437
2551
  --wds-vertical-tabs-action-padding-vertical-medium: 12px;
2438
2552
  --wds-vertical-tabs-action-padding-vertical-small: 12px;
2439
2553
  --wds-vertical-tabs-action-padding-vertical-tiny: 6px;
2440
- --wds-vertical-tabs-action-radius: 0;
2441
- --wds-vertical-tabs-gaps-horizontal: 0;
2442
- --wds-vertical-tabs-gaps-vertical: 0;
2554
+ --wds-vertical-tabs-action-radius: 0px;
2555
+ --wds-vertical-tabs-gaps-horizontal: 0px;
2556
+ --wds-vertical-tabs-gaps-vertical: 0px;
2443
2557
  --wds-vertical-tabs-icon-fill: #116dff;
2444
2558
  --wds-vertical-tabs-icon-fill-active: #000624;
2445
2559
  --wds-vertical-tabs-icon-fill-disabled: rgba(0, 6, 36, .3);
@@ -2495,7 +2609,7 @@
2495
2609
  --wds-vertical-tabs-item-round-fill-premium-disabled: #f6f7f9;
2496
2610
  --wds-vertical-tabs-item-round-fill-premium-hover: #f6f7f9;
2497
2611
  --wds-vertical-tabs-item-round-padding-bottom-tiny: 3px;
2498
- --wds-vertical-tabs-item-round-padding-top-tiny: 0;
2612
+ --wds-vertical-tabs-item-round-padding-top-tiny: 0px;
2499
2613
  --wds-vertical-tabs-section-text-font-line-height-small: 18px;
2500
2614
  --wds-vertical-tabs-section-text-font-size-small: 14px;
2501
2615
  --wds-vertical-tabs-section-text-font-weight-small: 400;
package/foundation.st.css CHANGED
@@ -220,16 +220,16 @@
220
220
  @property st-global(--wds-space-2400);
221
221
 
222
222
  .root {
223
- --wds-background-blur-0: 0;
224
- --wds-background-blur-10: 0;
225
- --wds-background-blur-50: 0;
226
- --wds-background-blur-150: 0;
227
- --wds-background-blur-200: 0;
228
- --wds-background-blur-250: 0;
229
- --wds-background-blur-300: 0;
230
- --wds-background-blur-350: 0;
231
- --wds-background-blur-375: 0;
232
- --wds-border-radius-0: 0;
223
+ --wds-background-blur-0: 0px;
224
+ --wds-background-blur-10: 0px;
225
+ --wds-background-blur-50: 0px;
226
+ --wds-background-blur-150: 0px;
227
+ --wds-background-blur-200: 0px;
228
+ --wds-background-blur-250: 0px;
229
+ --wds-background-blur-300: 0px;
230
+ --wds-background-blur-350: 0px;
231
+ --wds-background-blur-375: 0px;
232
+ --wds-border-radius-0: 0px;
233
233
  --wds-border-radius-100: 2px;
234
234
  --wds-border-radius-200: 4px;
235
235
  --wds-border-radius-300: 6px;
@@ -240,7 +240,7 @@
240
240
  --wds-border-width-100: 1px;
241
241
  --wds-border-width-150: 1.5px;
242
242
  --wds-border-width-200: 2px;
243
- --wds-border-width-none: 0;
243
+ --wds-border-width-none: 0px;
244
244
  --wds-breakpoint-large: 1186px;
245
245
  --wds-breakpoint-medium: 768px;
246
246
  --wds-breakpoint-small: 490px;
@@ -346,7 +346,7 @@
346
346
  --wds-color-yellow-600: #fff6e5;
347
347
  --wds-font-family-default: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
348
348
  --wds-font-family-display: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
349
- --wds-font-letter-spacing-0: 0;
349
+ --wds-font-letter-spacing-0: 0px;
350
350
  --wds-font-letter-spacing-100: 1px;
351
351
  --wds-font-line-height-100: 12px;
352
352
  --wds-font-line-height-200: 18px;
@@ -371,7 +371,7 @@
371
371
  --wds-shadow-200: 0 0 6px rgba(0, 6, 36, .1), 0 2px 4px rgba(0, 6, 36, .1);
372
372
  --wds-shadow-300: 0 0 18px rgba(0, 6, 36, .1), 0 6px 6px rgba(0, 6, 36, .05);
373
373
  --wds-shadow-400: 0 3px 24px rgba(0, 6, 36, .2), 0 8px 8px rgba(0, 6, 36, .1);
374
- --wds-shadow-blur-0: 0;
374
+ --wds-shadow-blur-0: 0px;
375
375
  --wds-shadow-blur-25: 1px;
376
376
  --wds-shadow-blur-35: 2px;
377
377
  --wds-shadow-blur-50: 3px;
@@ -400,7 +400,7 @@
400
400
  --wds-shadow-inner-400-right: -32px 0 24px -24px rgba(0, 6, 36, .2) inset, -8px 0 6px -6px rgba(0, 6, 36, .05) inset;
401
401
  --wds-shadow-inner-400-top: 0 32px 24px -24px rgba(0, 6, 36, .2) inset, 0 8px 6px -6px rgba(0, 6, 36, .05) inset;
402
402
  --wds-shadow-inner-400-vertical: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset, 0 -22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
403
- --wds-shadow-x-0: 0;
403
+ --wds-shadow-x-0: 0px;
404
404
  --wds-shadow-x-25: 2px;
405
405
  --wds-shadow-y-0: 0;
406
406
  --wds-shadow-y-25: 2px;
@@ -410,7 +410,7 @@
410
410
  --wds-shadow-y-200: 9px;
411
411
  --wds-shadow-y-300: 12px;
412
412
  --wds-shadow-y-350: 3px;
413
- --wds-space-0: 0;
413
+ --wds-space-0: 0px;
414
414
  --wds-space-25: 1px;
415
415
  --wds-space-50: 3px;
416
416
  --wds-space-100: 6px;