@wix/design-system-tokens 1.178.0 → 1.180.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 (32) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/all.css +11 -4
  3. package/all.scss +11 -4
  4. package/all.st.css +21 -7
  5. package/component.st.css +15 -7
  6. package/foundation.st.css +2 -0
  7. package/odeditor/all.css +16 -9
  8. package/odeditor/all.scss +16 -9
  9. package/odeditor/all.st.css +26 -12
  10. package/odeditor/component.st.css +20 -12
  11. package/odeditor/foundation.st.css +2 -0
  12. package/odeditor/semantic.st.css +4 -0
  13. package/odeditor-dark/all.css +28 -20
  14. package/odeditor-dark/all.scss +28 -20
  15. package/odeditor-dark/all.st.css +280 -264
  16. package/odeditor-dark/component.st.css +208 -200
  17. package/odeditor-dark/foundation.st.css +9 -5
  18. package/odeditor-dark/semantic.st.css +63 -59
  19. package/package.json +2 -2
  20. package/semantic.st.css +4 -0
  21. package/studio/all.css +10 -3
  22. package/studio/all.scss +10 -3
  23. package/studio/all.st.css +20 -6
  24. package/studio/component.st.css +14 -6
  25. package/studio/foundation.st.css +2 -0
  26. package/studio/semantic.st.css +4 -0
  27. package/wixel/all.css +10 -3
  28. package/wixel/all.scss +10 -3
  29. package/wixel/all.st.css +20 -6
  30. package/wixel/component.st.css +14 -6
  31. package/wixel/foundation.st.css +2 -0
  32. package/wixel/semantic.st.css +4 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,22 @@
1
+ ## 1.180.0 - 2026-04-07
2
+
3
+ ### Features
4
+
5
+ - feat(SegmentedToggle): added new size tiny [16106](https://github.com/wix-private/wix-design-systems/pull/16106)
6
+
7
+ ### Bug Fixes
8
+
9
+ - fix(SplitAction): instead of gap, added divider as per spec [16069](https://github.com/wix-private/wix-design-systems/pull/16069)
10
+ - fix(tokens): update toggle button standard-selected tokens in odeditor-dark [16112](https://github.com/wix-private/wix-design-systems/pull/16112)
11
+ - fix(tokens): update toggle button dark selected fill in odeditor-dark [16110](https://github.com/wix-private/wix-design-systems/pull/16110)
12
+ - fix(tokens): reduce input small border-radius in OdEditor themes [16101](https://github.com/wix-private/wix-design-systems/pull/16101)
13
+
14
+ ## 1.179.0 - 2026-04-02
15
+
16
+ ### Features
17
+
18
+ - feat(SelectorButton): rename text-fill tokens to text-fill-dark [16086](https://github.com/wix-private/wix-design-systems/pull/16086)
19
+
1
20
  ## 1.177.0 - 2026-03-31
2
21
 
3
22
  ### Bug Fixes
package/all.css CHANGED
@@ -200,6 +200,7 @@
200
200
  --wds-color-blue-300: #a8caff;
201
201
  --wds-color-blue-250: #80b1ff;
202
202
  --wds-color-blue-200: #5999ff;
203
+ --wds-color-blue-150: #116DFF;
203
204
  --wds-color-blue-100: #116dff;
204
205
  --wds-color-blue-50: #0f62e6;
205
206
  --wds-color-blue-0: #084ebd;
@@ -359,6 +360,7 @@
359
360
  --wds-border-radius-surface-modal-backdrop: var(--wds-border-radius-0);
360
361
  --wds-border-radius-surface-modal: var(--wds-border-radius-400);
361
362
  --wds-border-radius-surface-default: var(--wds-border-radius-400);
363
+ --wds-background-blur-surface-overlay: var(--wds-background-blur-0);
362
364
  --wds-background-blur-modal: var(--wds-background-blur-0);
363
365
  --wds-space-viewport-spacing: var(--wds-space-800);
364
366
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-50);
@@ -1042,6 +1044,7 @@
1042
1044
  --wds-select-area-fill-active: var(--wds-color-blue-400);
1043
1045
  --wds-select-area-fill: var(--wds-color-blue-600);
1044
1046
  --wds-select-area-border-radius: var(--wds-border-radius-400);
1047
+ --wds-segmented-toggle-size-tiny: var(--wds-space-400);
1045
1048
  --wds-segmented-toggle-size-small: var(--wds-space-500);
1046
1049
  --wds-segmented-toggle-size-medium: var(--wds-space-600);
1047
1050
  --wds-segmented-toggle-padding-vertical-small: var(--wds-space-100);
@@ -1444,6 +1447,7 @@
1444
1447
  --wds-font-line-height-body-small: var(--wds-font-line-height-200);
1445
1448
  --wds-font-line-height-body-medium: var(--wds-font-line-height-300);
1446
1449
  --wds-font-line-height-body-extra-tiny: var(--wds-font-line-height-100);
1450
+ --wds-color-fill-surface-overlay-blur: var(--wds-color-fill-surface-overlay);
1447
1451
  --wds-vertical-tabs-section-text-font-size-small: var(--wds-font-size-body-small);
1448
1452
  --wds-vertical-tabs-item-label-text-premium-active: var(--wds-color-text-premium);
1449
1453
  --wds-vertical-tabs-item-label-text-premium: var(--wds-color-text-premium);
@@ -1601,10 +1605,13 @@
1601
1605
  --wds-side-panel-title-font-size: var(--wds-font-size-heading-3);
1602
1606
  --wds-side-panel-footer-fill: var(--wds-color-fill-surface-modal);
1603
1607
  --wds-side-panel-floating-title-font-size: var(--wds-font-size-body-medium);
1604
- --wds-selector-button-text-fill-pressed: var(--wds-color-text-primary);
1605
- --wds-selector-button-text-fill-hover: var(--wds-color-text-primary);
1608
+ --wds-selector-button-text-fill-standard: var(--wds-color-text-primary);
1609
+ --wds-selector-button-text-fill-pressed-standard: var(--wds-color-text-primary);
1610
+ --wds-selector-button-text-fill-pressed-dark: var(--wds-color-text-primary);
1611
+ --wds-selector-button-text-fill-hover-standard: var(--wds-color-fill-standard-primary-hover);
1612
+ --wds-selector-button-text-fill-hover-dark: var(--wds-color-text-primary);
1606
1613
  --wds-selector-button-text-fill-disabled: var(--wds-color-text-disabled);
1607
- --wds-selector-button-text-fill: var(--wds-color-text-standard-primary);
1614
+ --wds-selector-button-text-fill-dark: var(--wds-color-text-standard-primary);
1608
1615
  --wds-selector-button-fill-pressed: var(--wds-color-fill-standard-tertiary-active);
1609
1616
  --wds-selector-button-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
1610
1617
  --wds-selector-button-fill-disabled: var(--wds-color-fill-standard-tertiary);
@@ -1944,7 +1951,7 @@
1944
1951
  --wds-button-font-size-large: var(--wds-font-size-body-medium);
1945
1952
  --wds-button-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary);
1946
1953
  --wds-button-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary);
1947
- --wds-button-fill-standard-secondary-active: linear-gradient(0deg, var(--wds-color-fill-standard-primary-active) 0%, var(--wds-color-fill-standard-primary-active) 100%);
1954
+ --wds-button-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1948
1955
  --wds-button-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1949
1956
  --wds-button-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1950
1957
  --wds-button-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
package/all.scss CHANGED
@@ -264,6 +264,7 @@
264
264
  --wds-color-blue-300: #a8caff;
265
265
  --wds-color-blue-250: #80b1ff;
266
266
  --wds-color-blue-200: #5999ff;
267
+ --wds-color-blue-150: #116DFF;
267
268
  --wds-color-blue-100: #116dff;
268
269
  --wds-color-blue-50: #0f62e6;
269
270
  --wds-color-blue-0: #084ebd;
@@ -693,6 +694,7 @@
693
694
  --wds-select-area-fill-active: var(--wds-color-blue-400);
694
695
  --wds-select-area-fill: var(--wds-color-blue-600);
695
696
  --wds-select-area-border-radius: var(--wds-border-radius-400);
697
+ --wds-segmented-toggle-size-tiny: var(--wds-space-400);
696
698
  --wds-segmented-toggle-size-small: var(--wds-space-500);
697
699
  --wds-segmented-toggle-size-medium: var(--wds-space-600);
698
700
  --wds-segmented-toggle-padding-vertical-small: var(--wds-space-100);
@@ -1406,6 +1408,7 @@
1406
1408
  --wds-badge-border-radius-tiny: var(--wds-border-radius-100);
1407
1409
  --wds-badge-border-radius-small: var(--wds-border-radius-100);
1408
1410
  --wds-badge-border-radius-medium: var(--wds-border-radius-100);
1411
+ --wds-background-blur-surface-overlay: var(--wds-background-blur-0);
1409
1412
  --wds-background-blur-modal: var(--wds-background-blur-0);
1410
1413
  --wds-avatar-group-gap-default: var(--wds-space-100);
1411
1414
  --wds-announcement-modal-padding-vertical: var(--wds-space-800);
@@ -1591,10 +1594,13 @@
1591
1594
  --wds-shadow-inner-400-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1592
1595
  --wds-shadow-inner-300-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
1593
1596
  --wds-shadow-inner-300-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1594
- --wds-selector-button-text-fill-pressed: var(--wds-color-text-primary);
1595
- --wds-selector-button-text-fill-hover: var(--wds-color-text-primary);
1597
+ --wds-selector-button-text-fill-standard: var(--wds-color-text-primary);
1598
+ --wds-selector-button-text-fill-pressed-standard: var(--wds-color-text-primary);
1599
+ --wds-selector-button-text-fill-pressed-dark: var(--wds-color-text-primary);
1600
+ --wds-selector-button-text-fill-hover-standard: var(--wds-color-fill-standard-primary-hover);
1601
+ --wds-selector-button-text-fill-hover-dark: var(--wds-color-text-primary);
1596
1602
  --wds-selector-button-text-fill-disabled: var(--wds-color-text-disabled);
1597
- --wds-selector-button-text-fill: var(--wds-color-text-standard-primary);
1603
+ --wds-selector-button-text-fill-dark: var(--wds-color-text-standard-primary);
1598
1604
  --wds-selector-button-fill-pressed: var(--wds-color-fill-standard-tertiary-active);
1599
1605
  --wds-selector-button-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
1600
1606
  --wds-selector-button-fill-disabled: var(--wds-color-fill-standard-tertiary);
@@ -1871,6 +1877,7 @@
1871
1877
  --wds-divider-fill-color-light: var(--wds-color-border-dark-secondary);
1872
1878
  --wds-custom-modal-header-subtitle-font-size: var(--wds-font-size-body-medium);
1873
1879
  --wds-custom-modal-footnote-text-font-size: var(--wds-font-size-body-small);
1880
+ --wds-color-fill-surface-overlay-blur: var(--wds-color-fill-surface-overlay);
1874
1881
  --wds-close-button-standard-filled-text-hover: var(--wds-color-text-primary);
1875
1882
  --wds-close-button-standard-filled-text-disabled: var(--wds-color-text-standard-primary-light);
1876
1883
  --wds-close-button-standard-filled-text: var(--wds-color-text-primary);
@@ -1944,7 +1951,7 @@
1944
1951
  --wds-button-font-size-large: var(--wds-font-size-body-medium);
1945
1952
  --wds-button-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary);
1946
1953
  --wds-button-fill-standard-secondary-disabled: var(--wds-color-fill-standard-tertiary);
1947
- --wds-button-fill-standard-secondary-active: linear-gradient(0deg, var(--wds-color-fill-standard-primary-active) 0%, var(--wds-color-fill-standard-primary-active) 100%);
1954
+ --wds-button-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
1948
1955
  --wds-button-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1949
1956
  --wds-button-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1950
1957
  --wds-button-fill-standard-primary-disabled: var(--wds-color-fill-standard-primary-disabled);
package/all.st.css CHANGED
@@ -63,6 +63,7 @@
63
63
  @property st-global(--wds-background-blur-350);
64
64
  @property st-global(--wds-background-blur-375);
65
65
  @property st-global(--wds-background-blur-modal);
66
+ @property st-global(--wds-background-blur-surface-overlay);
66
67
  @property st-global(--wds-badge-border-radius-medium);
67
68
  @property st-global(--wds-badge-border-radius-small);
68
69
  @property st-global(--wds-badge-border-radius-tiny);
@@ -375,6 +376,7 @@
375
376
  @property st-global(--wds-color-blue-0);
376
377
  @property st-global(--wds-color-blue-50);
377
378
  @property st-global(--wds-color-blue-100);
379
+ @property st-global(--wds-color-blue-150);
378
380
  @property st-global(--wds-color-blue-200);
379
381
  @property st-global(--wds-color-blue-250);
380
382
  @property st-global(--wds-color-blue-300);
@@ -661,6 +663,7 @@
661
663
  @property st-global(--wds-color-fill-surface-modal-backdrop);
662
664
  @property st-global(--wds-color-fill-surface-neutral);
663
665
  @property st-global(--wds-color-fill-surface-overlay);
666
+ @property st-global(--wds-color-fill-surface-overlay-blur);
664
667
  @property st-global(--wds-color-fill-surface-overlay-dark);
665
668
  @property st-global(--wds-color-fill-surface-premium);
666
669
  @property st-global(--wds-color-fill-surface-raised);
@@ -1440,6 +1443,7 @@
1440
1443
  @property st-global(--wds-segmented-toggle-padding-vertical-small);
1441
1444
  @property st-global(--wds-segmented-toggle-size-medium);
1442
1445
  @property st-global(--wds-segmented-toggle-size-small);
1446
+ @property st-global(--wds-segmented-toggle-size-tiny);
1443
1447
  @property st-global(--wds-segmented-toggle-value-fill);
1444
1448
  @property st-global(--wds-segmented-toggle-value-fill-default);
1445
1449
  @property st-global(--wds-segmented-toggle-value-fill-disabled);
@@ -1473,10 +1477,13 @@
1473
1477
  @property st-global(--wds-selector-button-size-large);
1474
1478
  @property st-global(--wds-selector-button-size-medium);
1475
1479
  @property st-global(--wds-selector-button-size-small);
1476
- @property st-global(--wds-selector-button-text-fill);
1480
+ @property st-global(--wds-selector-button-text-fill-dark);
1477
1481
  @property st-global(--wds-selector-button-text-fill-disabled);
1478
- @property st-global(--wds-selector-button-text-fill-hover);
1479
- @property st-global(--wds-selector-button-text-fill-pressed);
1482
+ @property st-global(--wds-selector-button-text-fill-hover-dark);
1483
+ @property st-global(--wds-selector-button-text-fill-hover-standard);
1484
+ @property st-global(--wds-selector-button-text-fill-pressed-dark);
1485
+ @property st-global(--wds-selector-button-text-fill-pressed-standard);
1486
+ @property st-global(--wds-selector-button-text-fill-standard);
1480
1487
  @property st-global(--wds-selector-list-item-padding-horizontal-medium);
1481
1488
  @property st-global(--wds-selector-list-item-padding-horizontal-small);
1482
1489
  @property st-global(--wds-selector-list-item-padding-vertical-medium);
@@ -2152,6 +2159,7 @@
2152
2159
  --wds-background-blur-350: 0px;
2153
2160
  --wds-background-blur-375: 0px;
2154
2161
  --wds-background-blur-modal: 0px;
2162
+ --wds-background-blur-surface-overlay: 0px;
2155
2163
  --wds-badge-border-radius-medium: 2px;
2156
2164
  --wds-badge-border-radius-small: 2px;
2157
2165
  --wds-badge-border-radius-tiny: 2px;
@@ -2271,7 +2279,7 @@
2271
2279
  --wds-button-fill-standard-primary-disabled: rgba(0, 6, 36, .3);
2272
2280
  --wds-button-fill-standard-primary-hover: #0f62e6;
2273
2281
  --wds-button-fill-standard-secondary: #ffffff;
2274
- --wds-button-fill-standard-secondary-active: linear-gradient(0deg, #084ebd 0%, #084ebd 100%);
2282
+ --wds-button-fill-standard-secondary-active: #084ebd;
2275
2283
  --wds-button-fill-standard-secondary-disabled: #ffffff;
2276
2284
  --wds-button-fill-standard-secondary-hover: #116dff;
2277
2285
  --wds-button-font-line-height-extra-large: 24px;
@@ -2464,6 +2472,7 @@
2464
2472
  --wds-color-blue-0: #084ebd;
2465
2473
  --wds-color-blue-50: #0f62e6;
2466
2474
  --wds-color-blue-100: #116dff;
2475
+ --wds-color-blue-150: #116DFF;
2467
2476
  --wds-color-blue-200: #5999ff;
2468
2477
  --wds-color-blue-250: #80b1ff;
2469
2478
  --wds-color-blue-300: #a8caff;
@@ -2750,6 +2759,7 @@
2750
2759
  --wds-color-fill-surface-modal-backdrop: rgba(0, 6, 36, .7);
2751
2760
  --wds-color-fill-surface-neutral: #f6f7f9;
2752
2761
  --wds-color-fill-surface-overlay: #ffffff;
2762
+ --wds-color-fill-surface-overlay-blur: #ffffff;
2753
2763
  --wds-color-fill-surface-overlay-dark: #000624;
2754
2764
  --wds-color-fill-surface-premium: #f1e0f9;
2755
2765
  --wds-color-fill-surface-raised: #ffffff;
@@ -3529,6 +3539,7 @@
3529
3539
  --wds-segmented-toggle-padding-vertical-small: 6px;
3530
3540
  --wds-segmented-toggle-size-medium: 36px;
3531
3541
  --wds-segmented-toggle-size-small: 30px;
3542
+ --wds-segmented-toggle-size-tiny: 24px;
3532
3543
  --wds-segmented-toggle-value-fill: #000624;
3533
3544
  --wds-segmented-toggle-value-fill-default: #000624;
3534
3545
  --wds-segmented-toggle-value-fill-disabled: rgba(0, 6, 36, .3);
@@ -3562,10 +3573,13 @@
3562
3573
  --wds-selector-button-size-large: 42px;
3563
3574
  --wds-selector-button-size-medium: 36px;
3564
3575
  --wds-selector-button-size-small: 30px;
3565
- --wds-selector-button-text-fill: #000624;
3576
+ --wds-selector-button-text-fill-dark: #000624;
3566
3577
  --wds-selector-button-text-fill-disabled: rgba(0, 6, 36, .3);
3567
- --wds-selector-button-text-fill-hover: #116dff;
3568
- --wds-selector-button-text-fill-pressed: #116dff;
3578
+ --wds-selector-button-text-fill-hover-dark: #116dff;
3579
+ --wds-selector-button-text-fill-hover-standard: #0f62e6;
3580
+ --wds-selector-button-text-fill-pressed-dark: #116dff;
3581
+ --wds-selector-button-text-fill-pressed-standard: #116dff;
3582
+ --wds-selector-button-text-fill-standard: #116dff;
3569
3583
  --wds-selector-list-item-padding-horizontal-medium: 24px;
3570
3584
  --wds-selector-list-item-padding-horizontal-small: 18px;
3571
3585
  --wds-selector-list-item-padding-vertical-medium: 12px;
package/component.st.css CHANGED
@@ -876,6 +876,7 @@
876
876
  @property st-global(--wds-segmented-toggle-padding-vertical-small);
877
877
  @property st-global(--wds-segmented-toggle-size-medium);
878
878
  @property st-global(--wds-segmented-toggle-size-small);
879
+ @property st-global(--wds-segmented-toggle-size-tiny);
879
880
  @property st-global(--wds-segmented-toggle-value-fill);
880
881
  @property st-global(--wds-segmented-toggle-value-fill-default);
881
882
  @property st-global(--wds-segmented-toggle-value-fill-disabled);
@@ -909,10 +910,13 @@
909
910
  @property st-global(--wds-selector-button-size-large);
910
911
  @property st-global(--wds-selector-button-size-medium);
911
912
  @property st-global(--wds-selector-button-size-small);
912
- @property st-global(--wds-selector-button-text-fill);
913
+ @property st-global(--wds-selector-button-text-fill-dark);
913
914
  @property st-global(--wds-selector-button-text-fill-disabled);
914
- @property st-global(--wds-selector-button-text-fill-hover);
915
- @property st-global(--wds-selector-button-text-fill-pressed);
915
+ @property st-global(--wds-selector-button-text-fill-hover-dark);
916
+ @property st-global(--wds-selector-button-text-fill-hover-standard);
917
+ @property st-global(--wds-selector-button-text-fill-pressed-dark);
918
+ @property st-global(--wds-selector-button-text-fill-pressed-standard);
919
+ @property st-global(--wds-selector-button-text-fill-standard);
916
920
  @property st-global(--wds-selector-list-item-padding-horizontal-medium);
917
921
  @property st-global(--wds-selector-list-item-padding-horizontal-small);
918
922
  @property st-global(--wds-selector-list-item-padding-vertical-medium);
@@ -1516,7 +1520,7 @@
1516
1520
  --wds-button-fill-standard-primary-disabled: rgba(0, 6, 36, .3);
1517
1521
  --wds-button-fill-standard-primary-hover: #0f62e6;
1518
1522
  --wds-button-fill-standard-secondary: #ffffff;
1519
- --wds-button-fill-standard-secondary-active: linear-gradient(0deg, #084ebd 0%, #084ebd 100%);
1523
+ --wds-button-fill-standard-secondary-active: #084ebd;
1520
1524
  --wds-button-fill-standard-secondary-disabled: #ffffff;
1521
1525
  --wds-button-fill-standard-secondary-hover: #116dff;
1522
1526
  --wds-button-font-line-height-extra-large: 24px;
@@ -2246,6 +2250,7 @@
2246
2250
  --wds-segmented-toggle-padding-vertical-small: 6px;
2247
2251
  --wds-segmented-toggle-size-medium: 36px;
2248
2252
  --wds-segmented-toggle-size-small: 30px;
2253
+ --wds-segmented-toggle-size-tiny: 24px;
2249
2254
  --wds-segmented-toggle-value-fill: #000624;
2250
2255
  --wds-segmented-toggle-value-fill-default: #000624;
2251
2256
  --wds-segmented-toggle-value-fill-disabled: rgba(0, 6, 36, .3);
@@ -2279,10 +2284,13 @@
2279
2284
  --wds-selector-button-size-large: 42px;
2280
2285
  --wds-selector-button-size-medium: 36px;
2281
2286
  --wds-selector-button-size-small: 30px;
2282
- --wds-selector-button-text-fill: #000624;
2287
+ --wds-selector-button-text-fill-dark: #000624;
2283
2288
  --wds-selector-button-text-fill-disabled: rgba(0, 6, 36, .3);
2284
- --wds-selector-button-text-fill-hover: #116dff;
2285
- --wds-selector-button-text-fill-pressed: #116dff;
2289
+ --wds-selector-button-text-fill-hover-dark: #116dff;
2290
+ --wds-selector-button-text-fill-hover-standard: #0f62e6;
2291
+ --wds-selector-button-text-fill-pressed-dark: #116dff;
2292
+ --wds-selector-button-text-fill-pressed-standard: #116dff;
2293
+ --wds-selector-button-text-fill-standard: #116dff;
2286
2294
  --wds-selector-list-item-padding-horizontal-medium: 24px;
2287
2295
  --wds-selector-list-item-padding-horizontal-small: 18px;
2288
2296
  --wds-selector-list-item-padding-vertical-medium: 12px;
package/foundation.st.css CHANGED
@@ -60,6 +60,7 @@
60
60
  @property st-global(--wds-color-blue-0);
61
61
  @property st-global(--wds-color-blue-50);
62
62
  @property st-global(--wds-color-blue-100);
63
+ @property st-global(--wds-color-blue-150);
63
64
  @property st-global(--wds-color-blue-200);
64
65
  @property st-global(--wds-color-blue-250);
65
66
  @property st-global(--wds-color-blue-300);
@@ -291,6 +292,7 @@
291
292
  --wds-color-blue-0: #084ebd;
292
293
  --wds-color-blue-50: #0f62e6;
293
294
  --wds-color-blue-100: #116dff;
295
+ --wds-color-blue-150: #116DFF;
294
296
  --wds-color-blue-200: #5999ff;
295
297
  --wds-color-blue-250: #80b1ff;
296
298
  --wds-color-blue-300: #a8caff;
package/odeditor/all.css CHANGED
@@ -215,6 +215,7 @@
215
215
  --wds-color-blue-300: #acbeff;
216
216
  --wds-color-blue-250: #7896ff;
217
217
  --wds-color-blue-200: #597dff;
218
+ --wds-color-blue-150: #116DFF;
218
219
  --wds-color-blue-100: #2f5dff;
219
220
  --wds-color-blue-50: #1c3fe5;
220
221
  --wds-color-blue-0: #0f2ccf;
@@ -381,6 +382,7 @@
381
382
  --wds-border-radius-surface-modal-backdrop: var(--wds-border-radius-0);
382
383
  --wds-border-radius-surface-modal: var(--wds-border-radius-600);
383
384
  --wds-border-radius-surface-default: var(--wds-border-radius-600);
385
+ --wds-background-blur-surface-overlay: var(--wds-background-blur-0);
384
386
  --wds-background-blur-modal: var(--wds-background-blur-175);
385
387
  --wds-space-viewport-spacing: var(--wds-space-1200);
386
388
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-100);
@@ -1070,6 +1072,7 @@
1070
1072
  --wds-select-area-fill-active: var(--wds-color-blue-400);
1071
1073
  --wds-select-area-fill: var(--wds-color-black-750);
1072
1074
  --wds-select-area-border-radius: var(--wds-border-radius-200);
1075
+ --wds-segmented-toggle-size-tiny: var(--wds-space-400);
1073
1076
  --wds-segmented-toggle-size-small: var(--wds-space-750);
1074
1077
  --wds-segmented-toggle-size-medium: var(--wds-space-1000);
1075
1078
  --wds-segmented-toggle-padding-vertical-small: var(--wds-space-100);
@@ -1258,7 +1261,7 @@
1258
1261
  --wds-input-padding-vertical-small: var(--wds-space-150);
1259
1262
  --wds-input-padding-vertical-medium: var(--wds-space-175);
1260
1263
  --wds-input-padding-vertical-large: var(--wds-space-300);
1261
- --wds-input-padding-horizontal-tiny: var(--wds-space-100);
1264
+ --wds-input-padding-horizontal-tiny: var(--wds-space-150);
1262
1265
  --wds-input-padding-horizontal-small: var(--wds-space-200);
1263
1266
  --wds-input-padding-horizontal-medium: var(--wds-space-200);
1264
1267
  --wds-input-padding-horizontal-large: var(--wds-space-300);
@@ -1266,8 +1269,8 @@
1266
1269
  --wds-input-border-radius-round-small: var(--wds-border-radius-full);
1267
1270
  --wds-input-border-radius-round-medium: var(--wds-border-radius-full);
1268
1271
  --wds-input-border-radius-round-large: var(--wds-border-radius-full);
1269
- --wds-input-border-radius-default-tiny: var(--wds-border-radius-200);
1270
- --wds-input-border-radius-default-small: var(--wds-border-radius-400);
1272
+ --wds-input-border-radius-default-tiny: var(--wds-border-radius-300);
1273
+ --wds-input-border-radius-default-small: var(--wds-border-radius-300);
1271
1274
  --wds-input-border-radius-default-medium: var(--wds-border-radius-400);
1272
1275
  --wds-input-border-radius-default-large: var(--wds-border-radius-400);
1273
1276
  --wds-input-border-color-disabled: var(--wds-color-black-700);
@@ -1291,6 +1294,7 @@
1291
1294
  --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-black-500);
1292
1295
  --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-black-500);
1293
1296
  --wds-icon-button-color-fill-standard-secondary-disabled: var(--wds-color-black-700);
1297
+ --wds-icon-button-color-fill-standard-secondary: var(--wds-color-black-100-transparent-0);
1294
1298
  --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-black-700);
1295
1299
  --wds-icon-button-color-fill-premium-secondary-disabled: var(--wds-color-black-700);
1296
1300
  --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-black-700);
@@ -1540,6 +1544,7 @@
1540
1544
  --wds-font-line-height-body-small: var(--wds-font-line-height-300);
1541
1545
  --wds-font-line-height-body-medium: var(--wds-font-line-height-400);
1542
1546
  --wds-font-line-height-body-extra-tiny: var(--wds-font-line-height-100);
1547
+ --wds-color-fill-surface-overlay-blur: var(--wds-color-fill-surface-overlay);
1543
1548
  --wds-color-fill-surface-modal-backdrop: var(--wds-color-fill-transparent-primary);
1544
1549
  --wds-vertical-tabs-item-label-text-premium-active: var(--wds-color-text-premium);
1545
1550
  --wds-vertical-tabs-item-label-text-premium: var(--wds-color-text-premium);
@@ -1661,10 +1666,13 @@
1661
1666
  --wds-side-panel-title-font-size: var(--wds-font-size-heading-3);
1662
1667
  --wds-side-panel-footer-fill: var(--wds-color-fill-surface-modal);
1663
1668
  --wds-side-panel-floating-title-font-size: var(--wds-font-size-heading-3);
1664
- --wds-selector-button-text-fill-pressed: var(--wds-color-text-primary);
1665
- --wds-selector-button-text-fill-hover: var(--wds-color-text-standard-primary);
1669
+ --wds-selector-button-text-fill-standard: var(--wds-color-text-primary);
1670
+ --wds-selector-button-text-fill-pressed-standard: var(--wds-color-text-primary);
1671
+ --wds-selector-button-text-fill-pressed-dark: var(--wds-color-text-primary);
1672
+ --wds-selector-button-text-fill-hover-standard: var(--wds-color-fill-standard-primary-hover);
1673
+ --wds-selector-button-text-fill-hover-dark: var(--wds-color-text-standard-primary);
1666
1674
  --wds-selector-button-text-fill-disabled: var(--wds-color-text-disabled);
1667
- --wds-selector-button-text-fill: var(--wds-color-text-standard-primary);
1675
+ --wds-selector-button-text-fill-dark: var(--wds-color-text-standard-primary);
1668
1676
  --wds-selector-button-font-size-small: var(--wds-font-size-body-tiny);
1669
1677
  --wds-selector-button-border-color-pressed: var(--wds-color-border-standard-secondary-active);
1670
1678
  --wds-selector-button-border-color-hover: var(--wds-color-border-standard-primary);
@@ -1751,7 +1759,7 @@
1751
1759
  --wds-list-item-action-fill-active: var(--wds-color-fill-dark-tertiary-active);
1752
1760
  --wds-linear-progress-bar-label-font-line-height: var(--wds-font-line-height-200);
1753
1761
  --wds-input-value-font-size-tiny: var(--wds-font-size-body-tiny);
1754
- --wds-input-value-font-size-small: var(--wds-font-size-body-small);
1762
+ --wds-input-value-font-size-small: var(--wds-font-size-body-tiny);
1755
1763
  --wds-input-value-font-size-medium: var(--wds-font-size-body-small);
1756
1764
  --wds-input-value-font-size-large: var(--wds-font-size-body-small);
1757
1765
  --wds-input-value-font-line-height-large: var(--wds-font-size-body-small);
@@ -1803,7 +1811,6 @@
1803
1811
  --wds-icon-button-color-fill-standard-tertiary: var(--wds-color-fill-light-secondary);
1804
1812
  --wds-icon-button-color-fill-standard-secondary-hover: var(--wds-color-fill-standard-tertiary-hover);
1805
1813
  --wds-icon-button-color-fill-standard-secondary-active: var(--wds-color-fill-standard-tertiary-active);
1806
- --wds-icon-button-color-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1807
1814
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1808
1815
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1809
1816
  --wds-icon-button-color-fill-standard-primary: var(--wds-color-fill-standard-primary);
@@ -1837,7 +1844,7 @@
1837
1844
  --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
1838
1845
  --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
1839
1846
  --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
1840
- --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-tertiary-hover);
1847
+ --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
1841
1848
  --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-tertiary-active);
1842
1849
  --wds-icon-button-color-border-standard-secondary: var(--wds-color-border-standard-primary);
1843
1850
  --wds-icon-button-color-border-premium-secondary-active: var(--wds-color-border-premium-tertiary-active);
package/odeditor/all.scss CHANGED
@@ -294,6 +294,7 @@
294
294
  --wds-color-blue-300: #acbeff;
295
295
  --wds-color-blue-250: #7896ff;
296
296
  --wds-color-blue-200: #597dff;
297
+ --wds-color-blue-150: #116DFF;
297
298
  --wds-color-blue-100: #2f5dff;
298
299
  --wds-color-blue-50: #1c3fe5;
299
300
  --wds-color-blue-0: #0f2ccf;
@@ -733,6 +734,7 @@
733
734
  --wds-select-area-fill-active: var(--wds-color-blue-400);
734
735
  --wds-select-area-fill: var(--wds-color-black-750);
735
736
  --wds-select-area-border-radius: var(--wds-border-radius-200);
737
+ --wds-segmented-toggle-size-tiny: var(--wds-space-400);
736
738
  --wds-segmented-toggle-size-small: var(--wds-space-750);
737
739
  --wds-segmented-toggle-size-medium: var(--wds-space-1000);
738
740
  --wds-segmented-toggle-padding-vertical-small: var(--wds-space-100);
@@ -913,7 +915,7 @@
913
915
  --wds-input-padding-vertical-small: var(--wds-space-150);
914
916
  --wds-input-padding-vertical-medium: var(--wds-space-175);
915
917
  --wds-input-padding-vertical-large: var(--wds-space-300);
916
- --wds-input-padding-horizontal-tiny: var(--wds-space-100);
918
+ --wds-input-padding-horizontal-tiny: var(--wds-space-150);
917
919
  --wds-input-padding-horizontal-small: var(--wds-space-200);
918
920
  --wds-input-padding-horizontal-medium: var(--wds-space-200);
919
921
  --wds-input-padding-horizontal-large: var(--wds-space-300);
@@ -921,8 +923,8 @@
921
923
  --wds-input-border-radius-round-small: var(--wds-border-radius-full);
922
924
  --wds-input-border-radius-round-medium: var(--wds-border-radius-full);
923
925
  --wds-input-border-radius-round-large: var(--wds-border-radius-full);
924
- --wds-input-border-radius-default-tiny: var(--wds-border-radius-200);
925
- --wds-input-border-radius-default-small: var(--wds-border-radius-400);
926
+ --wds-input-border-radius-default-tiny: var(--wds-border-radius-300);
927
+ --wds-input-border-radius-default-small: var(--wds-border-radius-300);
926
928
  --wds-input-border-radius-default-medium: var(--wds-border-radius-400);
927
929
  --wds-input-border-radius-default-large: var(--wds-border-radius-400);
928
930
  --wds-input-border-color-disabled: var(--wds-color-black-700);
@@ -967,6 +969,7 @@
967
969
  --wds-icon-button-color-text-dark-secondary-disabled: var(--wds-color-black-500);
968
970
  --wds-icon-button-color-text-dark-primary-disabled: var(--wds-color-black-500);
969
971
  --wds-icon-button-color-fill-standard-secondary-disabled: var(--wds-color-black-700);
972
+ --wds-icon-button-color-fill-standard-secondary: var(--wds-color-black-100-transparent-0);
970
973
  --wds-icon-button-color-fill-standard-primary-disabled: var(--wds-color-black-700);
971
974
  --wds-icon-button-color-fill-premium-secondary-disabled: var(--wds-color-black-700);
972
975
  --wds-icon-button-color-fill-premium-primary-disabled: var(--wds-color-black-700);
@@ -1502,6 +1505,7 @@
1502
1505
  --wds-badge-border-radius-tiny: var(--wds-border-radius-200);
1503
1506
  --wds-badge-border-radius-small: var(--wds-border-radius-200);
1504
1507
  --wds-badge-border-radius-medium: var(--wds-border-radius-200);
1508
+ --wds-background-blur-surface-overlay: var(--wds-background-blur-0);
1505
1509
  --wds-background-blur-modal: var(--wds-background-blur-175);
1506
1510
  --wds-avatar-group-gap-default: var(--wds-space-100);
1507
1511
  --wds-announcement-modal-padding-vertical: var(--wds-space-1100);
@@ -1650,10 +1654,13 @@
1650
1654
  --wds-shadow-inner-400-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1651
1655
  --wds-shadow-inner-300-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
1652
1656
  --wds-shadow-inner-300-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
1653
- --wds-selector-button-text-fill-pressed: var(--wds-color-text-primary);
1654
- --wds-selector-button-text-fill-hover: var(--wds-color-text-standard-primary);
1657
+ --wds-selector-button-text-fill-standard: var(--wds-color-text-primary);
1658
+ --wds-selector-button-text-fill-pressed-standard: var(--wds-color-text-primary);
1659
+ --wds-selector-button-text-fill-pressed-dark: var(--wds-color-text-primary);
1660
+ --wds-selector-button-text-fill-hover-standard: var(--wds-color-fill-standard-primary-hover);
1661
+ --wds-selector-button-text-fill-hover-dark: var(--wds-color-text-standard-primary);
1655
1662
  --wds-selector-button-text-fill-disabled: var(--wds-color-text-disabled);
1656
- --wds-selector-button-text-fill: var(--wds-color-text-standard-primary);
1663
+ --wds-selector-button-text-fill-dark: var(--wds-color-text-standard-primary);
1657
1664
  --wds-selector-button-font-size-small: var(--wds-font-size-body-tiny);
1658
1665
  --wds-selector-button-border-color-pressed: var(--wds-color-border-standard-secondary-active);
1659
1666
  --wds-selector-button-border-color-hover: var(--wds-color-border-standard-primary);
@@ -1740,7 +1747,7 @@
1740
1747
  --wds-list-item-action-fill-active: var(--wds-color-fill-dark-tertiary-active);
1741
1748
  --wds-linear-progress-bar-label-font-line-height: var(--wds-font-line-height-200);
1742
1749
  --wds-input-value-font-size-tiny: var(--wds-font-size-body-tiny);
1743
- --wds-input-value-font-size-small: var(--wds-font-size-body-small);
1750
+ --wds-input-value-font-size-small: var(--wds-font-size-body-tiny);
1744
1751
  --wds-input-value-font-size-medium: var(--wds-font-size-body-small);
1745
1752
  --wds-input-value-font-size-large: var(--wds-font-size-body-small);
1746
1753
  --wds-input-value-font-line-height-large: var(--wds-font-size-body-small);
@@ -1792,7 +1799,6 @@
1792
1799
  --wds-icon-button-color-fill-standard-tertiary: var(--wds-color-fill-light-secondary);
1793
1800
  --wds-icon-button-color-fill-standard-secondary-hover: var(--wds-color-fill-standard-tertiary-hover);
1794
1801
  --wds-icon-button-color-fill-standard-secondary-active: var(--wds-color-fill-standard-tertiary-active);
1795
- --wds-icon-button-color-fill-standard-secondary: var(--wds-color-fill-standard-tertiary);
1796
1802
  --wds-icon-button-color-fill-standard-primary-hover: var(--wds-color-fill-standard-primary-hover);
1797
1803
  --wds-icon-button-color-fill-standard-primary-active: var(--wds-color-fill-standard-primary-active);
1798
1804
  --wds-icon-button-color-fill-standard-primary: var(--wds-color-fill-standard-primary);
@@ -1826,7 +1832,7 @@
1826
1832
  --wds-icon-button-color-fill-dark-primary-hover: var(--wds-color-fill-dark-primary-hover);
1827
1833
  --wds-icon-button-color-fill-dark-primary-active: var(--wds-color-fill-dark-primary-active);
1828
1834
  --wds-icon-button-color-fill-dark-primary: var(--wds-color-fill-dark-primary);
1829
- --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-tertiary-hover);
1835
+ --wds-icon-button-color-border-standard-secondary-hover: var(--wds-color-border-standard-secondary-hover);
1830
1836
  --wds-icon-button-color-border-standard-secondary-active: var(--wds-color-border-standard-tertiary-active);
1831
1837
  --wds-icon-button-color-border-standard-secondary: var(--wds-color-border-standard-primary);
1832
1838
  --wds-icon-button-color-border-premium-secondary-active: var(--wds-color-border-premium-tertiary-active);
@@ -1869,6 +1875,7 @@
1869
1875
  --wds-custom-modal-header-subtitle-font-size: var(--wds-font-size-body-small);
1870
1876
  --wds-custom-modal-footnote-text-font-size: var(--wds-font-size-body-tiny);
1871
1877
  --wds-custom-modal-border-radius: var(--wds-border-radius-surface-modal);
1878
+ --wds-color-fill-surface-overlay-blur: var(--wds-color-fill-surface-overlay);
1872
1879
  --wds-color-fill-surface-modal-backdrop: var(--wds-color-fill-transparent-primary);
1873
1880
  --wds-close-button-standard-filled-text-hover: var(--wds-color-text-standard-primary);
1874
1881
  --wds-close-button-standard-filled-text-disabled: var(--wds-color-text-disabled);