@wix/design-system-tokens 1.225.0 → 1.225.2

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 (23) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/all.css +2 -0
  3. package/all.scss +2 -0
  4. package/all.st.css +4 -0
  5. package/component.st.css +4 -0
  6. package/odeditor/all.css +7 -5
  7. package/odeditor/all.scss +7 -5
  8. package/odeditor/all.st.css +13 -9
  9. package/odeditor/component.st.css +12 -8
  10. package/odeditor/semantic.st.css +1 -1
  11. package/odeditor-dark/all.css +2 -0
  12. package/odeditor-dark/all.scss +2 -0
  13. package/odeditor-dark/all.st.css +4 -0
  14. package/odeditor-dark/component.st.css +4 -0
  15. package/package.json +2 -2
  16. package/studio/all.css +2 -0
  17. package/studio/all.scss +2 -0
  18. package/studio/all.st.css +4 -0
  19. package/studio/component.st.css +4 -0
  20. package/wixel/all.css +2 -0
  21. package/wixel/all.scss +2 -0
  22. package/wixel/all.st.css +4 -0
  23. package/wixel/component.st.css +4 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,19 @@
1
+ ## 1.225.2
2
+
3
+ ### Patch Changes
4
+
5
+ - [#16892](https://github.com/wix-private/wix-design-systems/pull/16892) [`076b702`](https://github.com/wix-private/wix-design-systems/commit/076b702684d18c45495c147f63168c172bad83a5) - Harmony (odeditor) sidebar spacing: `--wds-sidebar-padding-end` changes from `6px` to `14px` and `--wds-sidebar-header-margin-bottom` from `12px` to `16px`.
6
+
7
+ ## 1.225.1
8
+
9
+ ### Patch Changes
10
+
11
+ - [#16858](https://github.com/wix-private/wix-design-systems/pull/16858) [`e09ab17`](https://github.com/wix-private/wix-design-systems/commit/e09ab17a6190c72a2dd302ad0ad8835a1235102f) - Harmony (odeditor): `--wds-color-text-placeholder` changed from `#767574` to `#525150` to meet AA contrast (darkens placeholder text across the input family), and `--wds-input-background-fill-disabled` changed from `#F8F6F6` to `#F0EFEF` so disabled inputs are distinguishable from active ones.
12
+
13
+ - [#16861](https://github.com/wix-private/wix-design-systems/pull/16861) [`e109bf4`](https://github.com/wix-private/wix-design-systems/commit/e109bf4f797422749547ef8d1007d7bfdca21402) - In the odeditor theme, Page.Section content gap is reduced from 4px to 2px
14
+
15
+ - [#16860](https://github.com/wix-private/wix-design-systems/pull/16860) [`e4afd60`](https://github.com/wix-private/wix-design-systems/commit/e4afd604d6b56483b826dfa97c044b67fa3f3032) - Add `--wds-trend-indicator-gap`: `2px` in Harmony (odeditor), `4px` in all other themes.
16
+
1
17
  ## 1.225.0
2
18
 
3
19
  ### Minor Changes
package/all.css CHANGED
@@ -277,6 +277,7 @@
277
277
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
278
278
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
279
279
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
280
+ --wds-trend-indicator-gap: 4px;
280
281
  --wds-top-banner-shadow: 0 0 0 transparent;
281
282
  --wds-toggle-switch-width-small: 28px;
282
283
  --wds-toggle-switch-width-medium: 34px;
@@ -2547,6 +2548,7 @@
2547
2548
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-small);
2548
2549
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-medium);
2549
2550
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2551
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2550
2552
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-tiny);
2551
2553
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-small);
2552
2554
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/all.scss CHANGED
@@ -2,6 +2,7 @@
2
2
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
3
3
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
4
4
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
5
+ --wds-trend-indicator-gap: 4px;
5
6
  --wds-top-banner-shadow: 0 0 0 transparent;
6
7
  --wds-toggle-switch-width-small: 28px;
7
8
  --wds-toggle-switch-width-medium: 34px;
@@ -2547,6 +2548,7 @@
2547
2548
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-small);
2548
2549
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-medium);
2549
2550
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2551
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2550
2552
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-tiny);
2551
2553
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-small);
2552
2554
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/all.st.css CHANGED
@@ -1155,6 +1155,7 @@
1155
1155
  @property st-global(--wds-form-field-label-gap-tiny);
1156
1156
  @property st-global(--wds-form-field-label-line-height-small);
1157
1157
  @property st-global(--wds-form-field-label-line-height-tiny);
1158
+ @property st-global(--wds-form-field-label-readonly);
1158
1159
  @property st-global(--wds-gallery-item-border);
1159
1160
  @property st-global(--wds-gallery-item-padding-left-medium);
1160
1161
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -2499,6 +2500,7 @@
2499
2500
  @property st-global(--wds-top-banner-padding-horizontal-start);
2500
2501
  @property st-global(--wds-top-banner-padding-vertical);
2501
2502
  @property st-global(--wds-top-banner-shadow);
2503
+ @property st-global(--wds-trend-indicator-gap);
2502
2504
  @property st-global(--wds-variable-input-padding-vertical-small);
2503
2505
  @property st-global(--wds-variable-input-padding-vertical-tiny);
2504
2506
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -3742,6 +3744,7 @@
3742
3744
  --wds-form-field-label-gap-tiny: 6px;
3743
3745
  --wds-form-field-label-line-height-small: 18px;
3744
3746
  --wds-form-field-label-line-height-tiny: 18px;
3747
+ --wds-form-field-label-readonly: #44485f;
3745
3748
  --wds-gallery-item-border: 8px;
3746
3749
  --wds-gallery-item-padding-left-medium: 18px;
3747
3750
  --wds-gallery-item-padding-left-small: 12px;
@@ -5086,6 +5089,7 @@
5086
5089
  --wds-top-banner-padding-horizontal-start: 12px;
5087
5090
  --wds-top-banner-padding-vertical: 9px;
5088
5091
  --wds-top-banner-shadow: 0 0 0 transparent;
5092
+ --wds-trend-indicator-gap: 4px;
5089
5093
  --wds-variable-input-padding-vertical-small: 6px;
5090
5094
  --wds-variable-input-padding-vertical-tiny: 3px;
5091
5095
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/component.st.css CHANGED
@@ -587,6 +587,7 @@
587
587
  @property st-global(--wds-form-field-label-gap-tiny);
588
588
  @property st-global(--wds-form-field-label-line-height-small);
589
589
  @property st-global(--wds-form-field-label-line-height-tiny);
590
+ @property st-global(--wds-form-field-label-readonly);
590
591
  @property st-global(--wds-gallery-item-border);
591
592
  @property st-global(--wds-gallery-item-padding-left-medium);
592
593
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -1764,6 +1765,7 @@
1764
1765
  @property st-global(--wds-top-banner-padding-horizontal-start);
1765
1766
  @property st-global(--wds-top-banner-padding-vertical);
1766
1767
  @property st-global(--wds-top-banner-shadow);
1768
+ @property st-global(--wds-trend-indicator-gap);
1767
1769
  @property st-global(--wds-variable-input-padding-vertical-small);
1768
1770
  @property st-global(--wds-variable-input-padding-vertical-tiny);
1769
1771
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -2437,6 +2439,7 @@
2437
2439
  --wds-form-field-label-gap-tiny: 6px;
2438
2440
  --wds-form-field-label-line-height-small: 18px;
2439
2441
  --wds-form-field-label-line-height-tiny: 18px;
2442
+ --wds-form-field-label-readonly: #44485f;
2440
2443
  --wds-gallery-item-border: 8px;
2441
2444
  --wds-gallery-item-padding-left-medium: 18px;
2442
2445
  --wds-gallery-item-padding-left-small: 12px;
@@ -3614,6 +3617,7 @@
3614
3617
  --wds-top-banner-padding-horizontal-start: 12px;
3615
3618
  --wds-top-banner-padding-vertical: 9px;
3616
3619
  --wds-top-banner-shadow: 0 0 0 transparent;
3620
+ --wds-trend-indicator-gap: 4px;
3617
3621
  --wds-variable-input-padding-vertical-small: 6px;
3618
3622
  --wds-variable-input-padding-vertical-tiny: 3px;
3619
3623
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/odeditor/all.css CHANGED
@@ -310,6 +310,7 @@
310
310
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
311
311
  --wds-variable-input-padding-vertical-tiny: 2px;
312
312
  --wds-variable-input-padding-vertical-small: 5px;
313
+ --wds-trend-indicator-gap: 2px;
313
314
  --wds-top-banner-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
314
315
  --wds-toggle-switch-width-small: 24px;
315
316
  --wds-toggle-switch-width-medium: 26px;
@@ -658,7 +659,7 @@
658
659
  --wds-color-text-primary: var(--wds-color-blue-100);
659
660
  --wds-color-text-premium: var(--wds-color-blue-100);
660
661
  --wds-color-text-placeholder-light: var(--wds-color-black-400);
661
- --wds-color-text-placeholder: var(--wds-color-black-400);
662
+ --wds-color-text-placeholder: var(--wds-color-black-300);
662
663
  --wds-color-text-highlight: var(--wds-color-blue-400);
663
664
  --wds-color-text-disabled-light: var(--wds-color-white-transparent-70);
664
665
  --wds-color-text-disabled: var(--wds-color-black-500);
@@ -1179,7 +1180,7 @@
1179
1180
  --wds-sidebar-scrollbar-fill-light-default: var(--wds-color-black-550);
1180
1181
  --wds-sidebar-padding-top: var(--wds-space-600);
1181
1182
  --wds-sidebar-padding-start: var(--wds-space-300);
1182
- --wds-sidebar-padding-end: var(--wds-space-150);
1183
+ --wds-sidebar-padding-end: var(--wds-space-350);
1183
1184
  --wds-sidebar-padding-bottom: var(--wds-space-600);
1184
1185
  --wds-sidebar-navigation-arrow-fill-neutral: var(--wds-color-white);
1185
1186
  --wds-sidebar-minimized-padding-inline: var(--wds-space-400);
@@ -1231,7 +1232,7 @@
1231
1232
  --wds-sidebar-item-context-menu-padding-inline: var(--wds-space-200);
1232
1233
  --wds-sidebar-item-content-gap: var(--wds-space-200);
1233
1234
  --wds-sidebar-item-border-radius: var(--wds-border-radius-400);
1234
- --wds-sidebar-header-margin-bottom: var(--wds-space-300);
1235
+ --wds-sidebar-header-margin-bottom: var(--wds-space-400);
1235
1236
  --wds-sidebar-footer-fade-height: var(--wds-space-1500);
1236
1237
  --wds-sidebar-fill-neutral: var(--wds-color-fill-surface-stage);
1237
1238
  --wds-sidebar-fill-light: var(--wds-color-fill-surface-stage);
@@ -1390,7 +1391,7 @@
1390
1391
  --wds-page-section-padding-top: var(--wds-space-400);
1391
1392
  --wds-page-section-padding-bottom-with-divider: var(--wds-space-200);
1392
1393
  --wds-page-section-padding-bottom: var(--wds-space-100);
1393
- --wds-page-section-gap: var(--wds-space-100);
1394
+ --wds-page-section-gap: var(--wds-space-50);
1394
1395
  --wds-page-header-title-padding-start: var(--wds-space-200);
1395
1396
  --wds-page-header-title-minimised-letter-spacing: var(--wds-font-letter-spacing-heading-3);
1396
1397
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-heading-3);
@@ -1606,7 +1607,7 @@
1606
1607
  --wds-input-border-color: var(--wds-color-black-100-transparent-0);
1607
1608
  --wds-input-background-fill-readonly: var(--wds-color-white);
1608
1609
  --wds-input-background-fill-hover: var(--wds-color-black-750);
1609
- --wds-input-background-fill-disabled: var(--wds-color-black-750);
1610
+ --wds-input-background-fill-disabled: var(--wds-color-black-700);
1610
1611
  --wds-input-background-fill-default: var(--wds-color-black-750);
1611
1612
  --wds-input-background-fill: var(--wds-color-black-750);
1612
1613
  --wds-image-border-radius-none: var(--wds-border-radius-0);
@@ -2333,6 +2334,7 @@
2333
2334
  --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-secondary-hover);
2334
2335
  --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-secondary-active);
2335
2336
  --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
2337
+ --wds-form-field-label-readonly: var(--wds-color-text-disabled);
2336
2338
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-extra-tiny);
2337
2339
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-tiny);
2338
2340
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
package/odeditor/all.scss CHANGED
@@ -4,6 +4,7 @@
4
4
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
5
5
  --wds-variable-input-padding-vertical-tiny: 2px;
6
6
  --wds-variable-input-padding-vertical-small: 5px;
7
+ --wds-trend-indicator-gap: 2px;
7
8
  --wds-top-banner-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
8
9
  --wds-toggle-switch-width-small: 24px;
9
10
  --wds-toggle-switch-width-medium: 26px;
@@ -772,7 +773,7 @@
772
773
  --wds-sidebar-scrollbar-fill-light-default: var(--wds-color-black-550);
773
774
  --wds-sidebar-padding-top: var(--wds-space-600);
774
775
  --wds-sidebar-padding-start: var(--wds-space-300);
775
- --wds-sidebar-padding-end: var(--wds-space-150);
776
+ --wds-sidebar-padding-end: var(--wds-space-350);
776
777
  --wds-sidebar-padding-bottom: var(--wds-space-600);
777
778
  --wds-sidebar-navigation-arrow-fill-neutral: var(--wds-color-white);
778
779
  --wds-sidebar-minimized-padding-inline: var(--wds-space-400);
@@ -824,7 +825,7 @@
824
825
  --wds-sidebar-item-context-menu-padding-inline: var(--wds-space-200);
825
826
  --wds-sidebar-item-content-gap: var(--wds-space-200);
826
827
  --wds-sidebar-item-border-radius: var(--wds-border-radius-400);
827
- --wds-sidebar-header-margin-bottom: var(--wds-space-300);
828
+ --wds-sidebar-header-margin-bottom: var(--wds-space-400);
828
829
  --wds-sidebar-footer-fade-height: var(--wds-space-1500);
829
830
  --wds-sidebar-fill-neutral: var(--wds-color-fill-surface-stage);
830
831
  --wds-sidebar-fill-light: var(--wds-color-fill-surface-stage);
@@ -1052,7 +1053,7 @@
1052
1053
  --wds-page-section-padding-top: var(--wds-space-400);
1053
1054
  --wds-page-section-padding-bottom-with-divider: var(--wds-space-200);
1054
1055
  --wds-page-section-padding-bottom: var(--wds-space-100);
1055
- --wds-page-section-gap: var(--wds-space-100);
1056
+ --wds-page-section-gap: var(--wds-space-50);
1056
1057
  --wds-page-header-title-padding-start: var(--wds-space-200);
1057
1058
  --wds-page-header-title-minimised-letter-spacing: var(--wds-font-letter-spacing-heading-3);
1058
1059
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-heading-3);
@@ -1260,7 +1261,7 @@
1260
1261
  --wds-input-border-color: var(--wds-color-black-100-transparent-0);
1261
1262
  --wds-input-background-fill-readonly: var(--wds-color-white);
1262
1263
  --wds-input-background-fill-hover: var(--wds-color-black-750);
1263
- --wds-input-background-fill-disabled: var(--wds-color-black-750);
1264
+ --wds-input-background-fill-disabled: var(--wds-color-black-700);
1264
1265
  --wds-input-background-fill-default: var(--wds-color-black-750);
1265
1266
  --wds-input-background-fill: var(--wds-color-black-750);
1266
1267
  --wds-input-area-padding-vertical-small: var(--wds-space-200);
@@ -1414,7 +1415,7 @@
1414
1415
  --wds-color-text-primary: var(--wds-color-blue-100);
1415
1416
  --wds-color-text-premium: var(--wds-color-blue-100);
1416
1417
  --wds-color-text-placeholder-light: var(--wds-color-black-400);
1417
- --wds-color-text-placeholder: var(--wds-color-black-400);
1418
+ --wds-color-text-placeholder: var(--wds-color-black-300);
1418
1419
  --wds-color-text-highlight: var(--wds-color-blue-400);
1419
1420
  --wds-color-text-disabled-light: var(--wds-color-white-transparent-70);
1420
1421
  --wds-color-text-disabled: var(--wds-color-black-500);
@@ -2321,6 +2322,7 @@
2321
2322
  --wds-icon-button-color-border-dark-secondary-hover: var(--wds-color-border-dark-secondary-hover);
2322
2323
  --wds-icon-button-color-border-dark-secondary-active: var(--wds-color-border-dark-secondary-active);
2323
2324
  --wds-icon-button-color-border-dark-secondary: var(--wds-color-border-dark-primary);
2325
+ --wds-form-field-label-readonly: var(--wds-color-text-disabled);
2324
2326
  --wds-form-field-label-font-size-tiny: var(--wds-font-size-body-extra-tiny);
2325
2327
  --wds-form-field-label-font-size-small: var(--wds-font-size-body-tiny);
2326
2328
  --wds-form-field-label-fill: var(--wds-color-text-standard-secondary);
package/odeditor/all.st.css CHANGED
@@ -1140,6 +1140,7 @@
1140
1140
  @property st-global(--wds-form-field-label-gap-tiny);
1141
1141
  @property st-global(--wds-form-field-label-line-height-small);
1142
1142
  @property st-global(--wds-form-field-label-line-height-tiny);
1143
+ @property st-global(--wds-form-field-label-readonly);
1143
1144
  @property st-global(--wds-google-preview-favicon-background-fill);
1144
1145
  @property st-global(--wds-google-preview-favicon-border-fill);
1145
1146
  @property st-global(--wds-google-preview-site-name-fill);
@@ -2487,6 +2488,7 @@
2487
2488
  @property st-global(--wds-top-banner-padding-horizontal-start);
2488
2489
  @property st-global(--wds-top-banner-padding-vertical);
2489
2490
  @property st-global(--wds-top-banner-shadow);
2491
+ @property st-global(--wds-trend-indicator-gap);
2490
2492
  @property st-global(--wds-variable-input-padding-vertical-small);
2491
2493
  @property st-global(--wds-variable-input-padding-vertical-tiny);
2492
2494
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -3510,7 +3512,7 @@
3510
3512
  --wds-color-text-disabled: #a8a6a5;
3511
3513
  --wds-color-text-disabled-light: rgba(255, 255, 255, .7);
3512
3514
  --wds-color-text-highlight: #d5dfff;
3513
- --wds-color-text-placeholder: #767574;
3515
+ --wds-color-text-placeholder: #525150;
3514
3516
  --wds-color-text-placeholder-light: #767574;
3515
3517
  --wds-color-text-premium: #2f5dff;
3516
3518
  --wds-color-text-primary: #2f5dff;
@@ -3704,6 +3706,7 @@
3704
3706
  --wds-form-field-label-gap-tiny: 6px;
3705
3707
  --wds-form-field-label-line-height-small: 16px;
3706
3708
  --wds-form-field-label-line-height-tiny: 12px;
3709
+ --wds-form-field-label-readonly: #a8a6a5;
3707
3710
  --wds-google-preview-favicon-background-fill: #F1F3F4;
3708
3711
  --wds-google-preview-favicon-border-fill: #E6E6E6;
3709
3712
  --wds-google-preview-site-name-fill: #202124;
@@ -3838,7 +3841,7 @@
3838
3841
  --wds-illustration-color-opacity-100: #F8F6F600;
3839
3842
  --wds-image-border-radius-default: 8px;
3840
3843
  --wds-image-border-radius-none: 0px;
3841
- --wds-info-icon-fill: #767574;
3844
+ --wds-info-icon-fill: #525150;
3842
3845
  --wds-info-icon-fill-hover: #2f5dff;
3843
3846
  --wds-inner-shadow-blur-input: 3px;
3844
3847
  --wds-inner-shadow-blur-primary: 2px;
@@ -3863,7 +3866,7 @@
3863
3866
  --wds-input-area-padding-vertical-small: 8px;
3864
3867
  --wds-input-background-fill: #f8f6f6;
3865
3868
  --wds-input-background-fill-default: #f8f6f6;
3866
- --wds-input-background-fill-disabled: #f8f6f6;
3869
+ --wds-input-background-fill-disabled: #f0efef;
3867
3870
  --wds-input-background-fill-hover: #f8f6f6;
3868
3871
  --wds-input-background-fill-on-stage: #f0efef;
3869
3872
  --wds-input-background-fill-readonly: #ffffff;
@@ -3968,7 +3971,7 @@
3968
3971
  --wds-list-item-section-padding-horizontal: 12px;
3969
3972
  --wds-list-item-section-padding-top: 8px;
3970
3973
  --wds-list-item-section-padding-vertical-neutral: 8px;
3971
- --wds-list-item-section-title-label-fill: #767574;
3974
+ --wds-list-item-section-title-label-fill: #525150;
3972
3975
  --wds-list-item-section-title-label-fill-neutral: #a8a6a5;
3973
3976
  --wds-list-item-select-active-fill: #e8e7e7;
3974
3977
  --wds-list-item-select-active-fill-active: #e8e7e7;
@@ -4011,7 +4014,7 @@
4011
4014
  --wds-list-item-select-padding-vertical-small: 8px;
4012
4015
  --wds-list-item-select-padding-vertical-small-screen-small: 8px;
4013
4016
  --wds-list-item-select-prefix-subtitle-margin: 0px;
4014
- --wds-list-item-select-subtitle: #767574;
4017
+ --wds-list-item-select-subtitle: #525150;
4015
4018
  --wds-list-item-select-subtitle-disabled: #a8a6a5;
4016
4019
  --wds-list-item-select-subtitle-font-line-height-medium: 16px;
4017
4020
  --wds-list-item-select-subtitle-font-size-medium: 12px;
@@ -4207,7 +4210,7 @@
4207
4210
  --wds-page-header-title-minimised-line-height: 24px;
4208
4211
  --wds-page-header-title-padding-start: 8px;
4209
4212
  --wds-page-section-divider-display: none;
4210
- --wds-page-section-gap: 4px;
4213
+ --wds-page-section-gap: 2px;
4211
4214
  --wds-page-section-padding-bottom: 4px;
4212
4215
  --wds-page-section-padding-bottom-with-divider: 8px;
4213
4216
  --wds-page-section-padding-top: 16px;
@@ -4284,7 +4287,7 @@
4284
4287
  --wds-section-header-fill-neutral: #ffffff;
4285
4288
  --wds-section-header-fill-standard: #ffffff;
4286
4289
  --wds-section-header-font-weight: 600;
4287
- --wds-section-header-label-fill-neutral: #767574;
4290
+ --wds-section-header-label-fill-neutral: #525150;
4288
4291
  --wds-section-header-label-font-size-medium: 14px;
4289
4292
  --wds-section-header-label-font-size-small: 12px;
4290
4293
  --wds-section-header-padding-vertical-medium: 12px;
@@ -4557,7 +4560,7 @@
4557
4560
  --wds-sidebar-fill-light: #F7F7F7;
4558
4561
  --wds-sidebar-fill-neutral: #F7F7F7;
4559
4562
  --wds-sidebar-footer-fade-height: 60px;
4560
- --wds-sidebar-header-margin-bottom: 12px;
4563
+ --wds-sidebar-header-margin-bottom: 16px;
4561
4564
  --wds-sidebar-header-text-dark-default: #ffffff;
4562
4565
  --wds-sidebar-item-border-radius: 8px;
4563
4566
  --wds-sidebar-item-content-gap: 8px;
@@ -4635,7 +4638,7 @@
4635
4638
  --wds-sidebar-minimized-width: 62px;
4636
4639
  --wds-sidebar-navigation-arrow-fill-neutral: #ffffff;
4637
4640
  --wds-sidebar-padding-bottom: 24px;
4638
- --wds-sidebar-padding-end: 6px;
4641
+ --wds-sidebar-padding-end: 14px;
4639
4642
  --wds-sidebar-padding-start: 12px;
4640
4643
  --wds-sidebar-padding-top: 24px;
4641
4644
  --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
@@ -5051,6 +5054,7 @@
5051
5054
  --wds-top-banner-padding-horizontal-start: 30px;
5052
5055
  --wds-top-banner-padding-vertical: 0px;
5053
5056
  --wds-top-banner-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
5057
+ --wds-trend-indicator-gap: 2px;
5054
5058
  --wds-variable-input-padding-vertical-small: 5px;
5055
5059
  --wds-variable-input-padding-vertical-tiny: 2px;
5056
5060
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/odeditor/component.st.css CHANGED
@@ -575,6 +575,7 @@
575
575
  @property st-global(--wds-form-field-label-gap-tiny);
576
576
  @property st-global(--wds-form-field-label-line-height-small);
577
577
  @property st-global(--wds-form-field-label-line-height-tiny);
578
+ @property st-global(--wds-form-field-label-readonly);
578
579
  @property st-global(--wds-google-preview-favicon-background-fill);
579
580
  @property st-global(--wds-google-preview-favicon-border-fill);
580
581
  @property st-global(--wds-google-preview-site-name-fill);
@@ -1741,6 +1742,7 @@
1741
1742
  @property st-global(--wds-top-banner-padding-horizontal-start);
1742
1743
  @property st-global(--wds-top-banner-padding-vertical);
1743
1744
  @property st-global(--wds-top-banner-shadow);
1745
+ @property st-global(--wds-trend-indicator-gap);
1744
1746
  @property st-global(--wds-variable-input-padding-vertical-small);
1745
1747
  @property st-global(--wds-variable-input-padding-vertical-tiny);
1746
1748
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -2391,6 +2393,7 @@
2391
2393
  --wds-form-field-label-gap-tiny: 6px;
2392
2394
  --wds-form-field-label-line-height-small: 16px;
2393
2395
  --wds-form-field-label-line-height-tiny: 12px;
2396
+ --wds-form-field-label-readonly: #a8a6a5;
2394
2397
  --wds-google-preview-favicon-background-fill: #F1F3F4;
2395
2398
  --wds-google-preview-favicon-border-fill: #E6E6E6;
2396
2399
  --wds-google-preview-site-name-fill: #202124;
@@ -2513,7 +2516,7 @@
2513
2516
  --wds-icon-button-color-text-standard-tertiary-hover: #0f2ccf;
2514
2517
  --wds-image-border-radius-default: 8px;
2515
2518
  --wds-image-border-radius-none: 0px;
2516
- --wds-info-icon-fill: #767574;
2519
+ --wds-info-icon-fill: #525150;
2517
2520
  --wds-info-icon-fill-hover: #2f5dff;
2518
2521
  --wds-input-area-border-radius-default-medium: 8px;
2519
2522
  --wds-input-area-border-radius-default-small: 8px;
@@ -2525,7 +2528,7 @@
2525
2528
  --wds-input-area-padding-vertical-small: 8px;
2526
2529
  --wds-input-background-fill: #f8f6f6;
2527
2530
  --wds-input-background-fill-default: #f8f6f6;
2528
- --wds-input-background-fill-disabled: #f8f6f6;
2531
+ --wds-input-background-fill-disabled: #f0efef;
2529
2532
  --wds-input-background-fill-hover: #f8f6f6;
2530
2533
  --wds-input-background-fill-on-stage: #f0efef;
2531
2534
  --wds-input-background-fill-readonly: #ffffff;
@@ -2629,7 +2632,7 @@
2629
2632
  --wds-list-item-section-padding-horizontal: 12px;
2630
2633
  --wds-list-item-section-padding-top: 8px;
2631
2634
  --wds-list-item-section-padding-vertical-neutral: 8px;
2632
- --wds-list-item-section-title-label-fill: #767574;
2635
+ --wds-list-item-section-title-label-fill: #525150;
2633
2636
  --wds-list-item-section-title-label-fill-neutral: #a8a6a5;
2634
2637
  --wds-list-item-select-active-fill: #e8e7e7;
2635
2638
  --wds-list-item-select-active-fill-active: #e8e7e7;
@@ -2672,7 +2675,7 @@
2672
2675
  --wds-list-item-select-padding-vertical-small: 8px;
2673
2676
  --wds-list-item-select-padding-vertical-small-screen-small: 8px;
2674
2677
  --wds-list-item-select-prefix-subtitle-margin: 0px;
2675
- --wds-list-item-select-subtitle: #767574;
2678
+ --wds-list-item-select-subtitle: #525150;
2676
2679
  --wds-list-item-select-subtitle-disabled: #a8a6a5;
2677
2680
  --wds-list-item-select-subtitle-font-line-height-medium: 16px;
2678
2681
  --wds-list-item-select-subtitle-font-size-medium: 12px;
@@ -2868,7 +2871,7 @@
2868
2871
  --wds-page-header-title-minimised-line-height: 24px;
2869
2872
  --wds-page-header-title-padding-start: 8px;
2870
2873
  --wds-page-section-divider-display: none;
2871
- --wds-page-section-gap: 4px;
2874
+ --wds-page-section-gap: 2px;
2872
2875
  --wds-page-section-padding-bottom: 4px;
2873
2876
  --wds-page-section-padding-bottom-with-divider: 8px;
2874
2877
  --wds-page-section-padding-top: 16px;
@@ -2945,7 +2948,7 @@
2945
2948
  --wds-section-header-fill-neutral: #ffffff;
2946
2949
  --wds-section-header-fill-standard: #ffffff;
2947
2950
  --wds-section-header-font-weight: 600;
2948
- --wds-section-header-label-fill-neutral: #767574;
2951
+ --wds-section-header-label-fill-neutral: #525150;
2949
2952
  --wds-section-header-label-font-size-medium: 14px;
2950
2953
  --wds-section-header-label-font-size-small: 12px;
2951
2954
  --wds-section-header-padding-vertical-medium: 12px;
@@ -3109,7 +3112,7 @@
3109
3112
  --wds-sidebar-fill-light: #F7F7F7;
3110
3113
  --wds-sidebar-fill-neutral: #F7F7F7;
3111
3114
  --wds-sidebar-footer-fade-height: 60px;
3112
- --wds-sidebar-header-margin-bottom: 12px;
3115
+ --wds-sidebar-header-margin-bottom: 16px;
3113
3116
  --wds-sidebar-header-text-dark-default: #ffffff;
3114
3117
  --wds-sidebar-item-border-radius: 8px;
3115
3118
  --wds-sidebar-item-content-gap: 8px;
@@ -3187,7 +3190,7 @@
3187
3190
  --wds-sidebar-minimized-width: 62px;
3188
3191
  --wds-sidebar-navigation-arrow-fill-neutral: #ffffff;
3189
3192
  --wds-sidebar-padding-bottom: 24px;
3190
- --wds-sidebar-padding-end: 6px;
3193
+ --wds-sidebar-padding-end: 14px;
3191
3194
  --wds-sidebar-padding-start: 12px;
3192
3195
  --wds-sidebar-padding-top: 24px;
3193
3196
  --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
@@ -3557,6 +3560,7 @@
3557
3560
  --wds-top-banner-padding-horizontal-start: 30px;
3558
3561
  --wds-top-banner-padding-vertical: 0px;
3559
3562
  --wds-top-banner-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
3563
+ --wds-trend-indicator-gap: 2px;
3560
3564
  --wds-variable-input-padding-vertical-small: 5px;
3561
3565
  --wds-variable-input-padding-vertical-tiny: 2px;
3562
3566
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/odeditor/semantic.st.css CHANGED
@@ -861,7 +861,7 @@
861
861
  --wds-color-text-disabled: #a8a6a5;
862
862
  --wds-color-text-disabled-light: rgba(255, 255, 255, .7);
863
863
  --wds-color-text-highlight: #d5dfff;
864
- --wds-color-text-placeholder: #767574;
864
+ --wds-color-text-placeholder: #525150;
865
865
  --wds-color-text-placeholder-light: #767574;
866
866
  --wds-color-text-premium: #2f5dff;
867
867
  --wds-color-text-primary: #2f5dff;
package/odeditor-dark/all.css CHANGED
@@ -313,6 +313,7 @@
313
313
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
314
314
  --wds-variable-input-padding-vertical-tiny: 2px;
315
315
  --wds-variable-input-padding-vertical-small: 5px;
316
+ --wds-trend-indicator-gap: 4px;
316
317
  --wds-top-banner-shadow: 0 0 0 transparent;
317
318
  --wds-tooltip-background-fill: #000000;
318
319
  --wds-toggle-switch-width-small: 24px;
@@ -2533,6 +2534,7 @@
2533
2534
  --wds-input-value-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
2534
2535
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-small);
2535
2536
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-small);
2537
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2536
2538
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2537
2539
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2538
2540
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
package/odeditor-dark/all.scss CHANGED
@@ -4,6 +4,7 @@
4
4
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
5
5
  --wds-variable-input-padding-vertical-tiny: 2px;
6
6
  --wds-variable-input-padding-vertical-small: 5px;
7
+ --wds-trend-indicator-gap: 4px;
7
8
  --wds-top-banner-shadow: 0 0 0 transparent;
8
9
  --wds-tooltip-background-fill: #000000;
9
10
  --wds-toggle-switch-width-small: 24px;
@@ -2533,6 +2534,7 @@
2533
2534
  --wds-input-value-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
2534
2535
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-small);
2535
2536
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-small);
2537
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2536
2538
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2537
2539
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2538
2540
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
package/odeditor-dark/all.st.css CHANGED
@@ -1142,6 +1142,7 @@
1142
1142
  @property st-global(--wds-form-field-label-gap-tiny);
1143
1143
  @property st-global(--wds-form-field-label-line-height-small);
1144
1144
  @property st-global(--wds-form-field-label-line-height-tiny);
1145
+ @property st-global(--wds-form-field-label-readonly);
1145
1146
  @property st-global(--wds-google-preview-favicon-background-fill);
1146
1147
  @property st-global(--wds-google-preview-favicon-border-fill);
1147
1148
  @property st-global(--wds-google-preview-site-name-fill);
@@ -2487,6 +2488,7 @@
2487
2488
  @property st-global(--wds-top-banner-padding-horizontal-start);
2488
2489
  @property st-global(--wds-top-banner-padding-vertical);
2489
2490
  @property st-global(--wds-top-banner-shadow);
2491
+ @property st-global(--wds-trend-indicator-gap);
2490
2492
  @property st-global(--wds-variable-input-padding-vertical-small);
2491
2493
  @property st-global(--wds-variable-input-padding-vertical-tiny);
2492
2494
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -3706,6 +3708,7 @@
3706
3708
  --wds-form-field-label-gap-tiny: 6px;
3707
3709
  --wds-form-field-label-line-height-small: 16px;
3708
3710
  --wds-form-field-label-line-height-tiny: 12px;
3711
+ --wds-form-field-label-readonly: #D4D3D2;
3709
3712
  --wds-google-preview-favicon-background-fill: #e4eefe;
3710
3713
  --wds-google-preview-favicon-border-fill: #E6E6E6;
3711
3714
  --wds-google-preview-site-name-fill: #bfbfbf;
@@ -5051,6 +5054,7 @@
5051
5054
  --wds-top-banner-padding-horizontal-start: 8px;
5052
5055
  --wds-top-banner-padding-vertical: 6px;
5053
5056
  --wds-top-banner-shadow: 0 0 0 transparent;
5057
+ --wds-trend-indicator-gap: 4px;
5054
5058
  --wds-variable-input-padding-vertical-small: 5px;
5055
5059
  --wds-variable-input-padding-vertical-tiny: 2px;
5056
5060
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/odeditor-dark/component.st.css CHANGED
@@ -576,6 +576,7 @@
576
576
  @property st-global(--wds-form-field-label-gap-tiny);
577
577
  @property st-global(--wds-form-field-label-line-height-small);
578
578
  @property st-global(--wds-form-field-label-line-height-tiny);
579
+ @property st-global(--wds-form-field-label-readonly);
579
580
  @property st-global(--wds-google-preview-favicon-background-fill);
580
581
  @property st-global(--wds-google-preview-favicon-border-fill);
581
582
  @property st-global(--wds-google-preview-site-name-fill);
@@ -1740,6 +1741,7 @@
1740
1741
  @property st-global(--wds-top-banner-padding-horizontal-start);
1741
1742
  @property st-global(--wds-top-banner-padding-vertical);
1742
1743
  @property st-global(--wds-top-banner-shadow);
1744
+ @property st-global(--wds-trend-indicator-gap);
1743
1745
  @property st-global(--wds-variable-input-padding-vertical-small);
1744
1746
  @property st-global(--wds-variable-input-padding-vertical-tiny);
1745
1747
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -2391,6 +2393,7 @@
2391
2393
  --wds-form-field-label-gap-tiny: 6px;
2392
2394
  --wds-form-field-label-line-height-small: 16px;
2393
2395
  --wds-form-field-label-line-height-tiny: 12px;
2396
+ --wds-form-field-label-readonly: #D4D3D2;
2394
2397
  --wds-google-preview-favicon-background-fill: #e4eefe;
2395
2398
  --wds-google-preview-favicon-border-fill: #E6E6E6;
2396
2399
  --wds-google-preview-site-name-fill: #bfbfbf;
@@ -3555,6 +3558,7 @@
3555
3558
  --wds-top-banner-padding-horizontal-start: 8px;
3556
3559
  --wds-top-banner-padding-vertical: 6px;
3557
3560
  --wds-top-banner-shadow: 0 0 0 transparent;
3561
+ --wds-trend-indicator-gap: 4px;
3558
3562
  --wds-variable-input-padding-vertical-small: 5px;
3559
3563
  --wds-variable-input-padding-vertical-tiny: 2px;
3560
3564
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.225.0",
3
+ "version": "1.225.2",
4
4
  "scripts": {
5
5
  "build": "cp -r tokens/* .",
6
6
  "figma-to-dictionary": "ts-node src/scripts/figma-to-dictionary.ts",
@@ -36,5 +36,5 @@
36
36
  "author": "augustinasv@wix.com",
37
37
  "description": "Design system tokens",
38
38
  "packageManager": "yarn@3.5.0",
39
- "falconPackageHash": "2b3f806c5f764e8278aea0d9e58bd6a991dbd681bf38492af883d747"
39
+ "falconPackageHash": "e1491444146d14072bd1eb31bb3effaae28deea0eb7446d985a845ff"
40
40
  }
package/studio/all.css CHANGED
@@ -317,6 +317,7 @@
317
317
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
318
318
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
319
319
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 10px;
320
+ --wds-trend-indicator-gap: 4px;
320
321
  --wds-top-banner-shadow: 0 0 0 transparent;
321
322
  --wds-toggle-switch-width-small: 24px;
322
323
  --wds-toggle-switch-width-medium: 28px;
@@ -2541,6 +2542,7 @@
2541
2542
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-tiny);
2542
2543
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-small);
2543
2544
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2545
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2544
2546
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2545
2547
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2546
2548
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
package/studio/all.scss CHANGED
@@ -2,6 +2,7 @@
2
2
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
3
3
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
4
4
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 10px;
5
+ --wds-trend-indicator-gap: 4px;
5
6
  --wds-top-banner-shadow: 0 0 0 transparent;
6
7
  --wds-toggle-switch-width-small: 24px;
7
8
  --wds-toggle-switch-width-medium: 28px;
@@ -2541,6 +2542,7 @@
2541
2542
  --wds-input-value-font-line-height-small: var(--wds-font-line-height-body-tiny);
2542
2543
  --wds-input-value-font-line-height-medium: var(--wds-font-line-height-body-small);
2543
2544
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2545
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2544
2546
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2545
2547
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2546
2548
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
package/studio/all.st.css CHANGED
@@ -1143,6 +1143,7 @@
1143
1143
  @property st-global(--wds-form-field-label-gap-tiny);
1144
1144
  @property st-global(--wds-form-field-label-line-height-small);
1145
1145
  @property st-global(--wds-form-field-label-line-height-tiny);
1146
+ @property st-global(--wds-form-field-label-readonly);
1146
1147
  @property st-global(--wds-gallery-item-border);
1147
1148
  @property st-global(--wds-gallery-item-padding-left-medium);
1148
1149
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -2484,6 +2485,7 @@
2484
2485
  @property st-global(--wds-top-banner-padding-horizontal-start);
2485
2486
  @property st-global(--wds-top-banner-padding-vertical);
2486
2487
  @property st-global(--wds-top-banner-shadow);
2488
+ @property st-global(--wds-trend-indicator-gap);
2487
2489
  @property st-global(--wds-variable-input-padding-vertical-small);
2488
2490
  @property st-global(--wds-variable-input-padding-vertical-tiny);
2489
2491
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -3715,6 +3717,7 @@
3715
3717
  --wds-form-field-label-gap-tiny: 6px;
3716
3718
  --wds-form-field-label-line-height-small: 16px;
3717
3719
  --wds-form-field-label-line-height-tiny: 16px;
3720
+ --wds-form-field-label-readonly: #131720;
3718
3721
  --wds-gallery-item-border: 4px;
3719
3722
  --wds-gallery-item-padding-left-medium: 18px;
3720
3723
  --wds-gallery-item-padding-left-small: 12px;
@@ -5056,6 +5059,7 @@
5056
5059
  --wds-top-banner-padding-horizontal-start: 8px;
5057
5060
  --wds-top-banner-padding-vertical: 6px;
5058
5061
  --wds-top-banner-shadow: 0 0 0 transparent;
5062
+ --wds-trend-indicator-gap: 4px;
5059
5063
  --wds-variable-input-padding-vertical-small: 4px;
5060
5064
  --wds-variable-input-padding-vertical-tiny: 2px;
5061
5065
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/studio/component.st.css CHANGED
@@ -579,6 +579,7 @@
579
579
  @property st-global(--wds-form-field-label-gap-tiny);
580
580
  @property st-global(--wds-form-field-label-line-height-small);
581
581
  @property st-global(--wds-form-field-label-line-height-tiny);
582
+ @property st-global(--wds-form-field-label-readonly);
582
583
  @property st-global(--wds-gallery-item-border);
583
584
  @property st-global(--wds-gallery-item-padding-left-medium);
584
585
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -1741,6 +1742,7 @@
1741
1742
  @property st-global(--wds-top-banner-padding-horizontal-start);
1742
1743
  @property st-global(--wds-top-banner-padding-vertical);
1743
1744
  @property st-global(--wds-top-banner-shadow);
1745
+ @property st-global(--wds-trend-indicator-gap);
1744
1746
  @property st-global(--wds-variable-input-padding-vertical-small);
1745
1747
  @property st-global(--wds-variable-input-padding-vertical-tiny);
1746
1748
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -2406,6 +2408,7 @@
2406
2408
  --wds-form-field-label-gap-tiny: 6px;
2407
2409
  --wds-form-field-label-line-height-small: 16px;
2408
2410
  --wds-form-field-label-line-height-tiny: 16px;
2411
+ --wds-form-field-label-readonly: #131720;
2409
2412
  --wds-gallery-item-border: 4px;
2410
2413
  --wds-gallery-item-padding-left-medium: 18px;
2411
2414
  --wds-gallery-item-padding-left-small: 12px;
@@ -3568,6 +3571,7 @@
3568
3571
  --wds-top-banner-padding-horizontal-start: 8px;
3569
3572
  --wds-top-banner-padding-vertical: 6px;
3570
3573
  --wds-top-banner-shadow: 0 0 0 transparent;
3574
+ --wds-trend-indicator-gap: 4px;
3571
3575
  --wds-variable-input-padding-vertical-small: 4px;
3572
3576
  --wds-variable-input-padding-vertical-tiny: 2px;
3573
3577
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/wixel/all.css CHANGED
@@ -304,6 +304,7 @@
304
304
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
305
305
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
306
306
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
307
+ --wds-trend-indicator-gap: 4px;
307
308
  --wds-top-banner-shadow: 0 0 0 transparent;
308
309
  --wds-toggle-switch-width-small: 24px;
309
310
  --wds-toggle-switch-width-medium: 32px;
@@ -2472,6 +2473,7 @@
2472
2473
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2473
2474
  --wds-input-border-color-hover: var(--wds-input-background-fill-hover);
2474
2475
  --wds-input-border-color: var(--wds-input-background-fill-default);
2476
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2475
2477
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2476
2478
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2477
2479
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/wixel/all.scss CHANGED
@@ -2,6 +2,7 @@
2
2
  --wds-vertical-tabs-item-padding-horizontal-tiny-offset: 20px;
3
3
  --wds-vertical-tabs-item-padding-horizontal-small-offset: 20px;
4
4
  --wds-vertical-tabs-item-padding-horizontal-medium-offset: 24px;
5
+ --wds-trend-indicator-gap: 4px;
5
6
  --wds-top-banner-shadow: 0 0 0 transparent;
6
7
  --wds-toggle-switch-width-small: 24px;
7
8
  --wds-toggle-switch-width-medium: 32px;
@@ -2472,6 +2473,7 @@
2472
2473
  --wds-input-value-font-line-height-large: var(--wds-font-line-height-body-medium);
2473
2474
  --wds-input-border-color-hover: var(--wds-input-background-fill-hover);
2474
2475
  --wds-input-border-color: var(--wds-input-background-fill-default);
2476
+ --wds-form-field-label-readonly: var(--wds-form-field-label-fill);
2475
2477
  --wds-form-field-label-line-height-tiny: var(--wds-font-line-height-body-extra-tiny);
2476
2478
  --wds-form-field-label-line-height-small: var(--wds-font-line-height-body-tiny);
2477
2479
  --wds-field-set-label-font-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/wixel/all.st.css CHANGED
@@ -1124,6 +1124,7 @@
1124
1124
  @property st-global(--wds-form-field-label-gap-tiny);
1125
1125
  @property st-global(--wds-form-field-label-line-height-small);
1126
1126
  @property st-global(--wds-form-field-label-line-height-tiny);
1127
+ @property st-global(--wds-form-field-label-readonly);
1127
1128
  @property st-global(--wds-gallery-item-border);
1128
1129
  @property st-global(--wds-gallery-item-padding-left-medium);
1129
1130
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -2420,6 +2421,7 @@
2420
2421
  @property st-global(--wds-top-banner-padding-horizontal-start);
2421
2422
  @property st-global(--wds-top-banner-padding-vertical);
2422
2423
  @property st-global(--wds-top-banner-shadow);
2424
+ @property st-global(--wds-trend-indicator-gap);
2423
2425
  @property st-global(--wds-variable-input-padding-vertical-small);
2424
2426
  @property st-global(--wds-variable-input-padding-vertical-tiny);
2425
2427
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -3632,6 +3634,7 @@
3632
3634
  --wds-form-field-label-gap-tiny: 6px;
3633
3635
  --wds-form-field-label-line-height-small: 16px;
3634
3636
  --wds-form-field-label-line-height-tiny: 14px;
3637
+ --wds-form-field-label-readonly: #000624;
3635
3638
  --wds-gallery-item-border: 4px;
3636
3639
  --wds-gallery-item-padding-left-medium: 18px;
3637
3640
  --wds-gallery-item-padding-left-small: 12px;
@@ -4928,6 +4931,7 @@
4928
4931
  --wds-top-banner-padding-horizontal-start: 8px;
4929
4932
  --wds-top-banner-padding-vertical: 6px;
4930
4933
  --wds-top-banner-shadow: 0 0 0 transparent;
4934
+ --wds-trend-indicator-gap: 4px;
4931
4935
  --wds-variable-input-padding-vertical-small: 4px;
4932
4936
  --wds-variable-input-padding-vertical-tiny: 4px;
4933
4937
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;
package/wixel/component.st.css CHANGED
@@ -562,6 +562,7 @@
562
562
  @property st-global(--wds-form-field-label-gap-tiny);
563
563
  @property st-global(--wds-form-field-label-line-height-small);
564
564
  @property st-global(--wds-form-field-label-line-height-tiny);
565
+ @property st-global(--wds-form-field-label-readonly);
565
566
  @property st-global(--wds-gallery-item-border);
566
567
  @property st-global(--wds-gallery-item-padding-left-medium);
567
568
  @property st-global(--wds-gallery-item-padding-left-small);
@@ -1707,6 +1708,7 @@
1707
1708
  @property st-global(--wds-top-banner-padding-horizontal-start);
1708
1709
  @property st-global(--wds-top-banner-padding-vertical);
1709
1710
  @property st-global(--wds-top-banner-shadow);
1711
+ @property st-global(--wds-trend-indicator-gap);
1710
1712
  @property st-global(--wds-variable-input-padding-vertical-small);
1711
1713
  @property st-global(--wds-variable-input-padding-vertical-tiny);
1712
1714
  @property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
@@ -2355,6 +2357,7 @@
2355
2357
  --wds-form-field-label-gap-tiny: 6px;
2356
2358
  --wds-form-field-label-line-height-small: 16px;
2357
2359
  --wds-form-field-label-line-height-tiny: 14px;
2360
+ --wds-form-field-label-readonly: #000624;
2358
2361
  --wds-gallery-item-border: 4px;
2359
2362
  --wds-gallery-item-padding-left-medium: 18px;
2360
2363
  --wds-gallery-item-padding-left-small: 12px;
@@ -3500,6 +3503,7 @@
3500
3503
  --wds-top-banner-padding-horizontal-start: 8px;
3501
3504
  --wds-top-banner-padding-vertical: 6px;
3502
3505
  --wds-top-banner-shadow: 0 0 0 transparent;
3506
+ --wds-trend-indicator-gap: 4px;
3503
3507
  --wds-variable-input-padding-vertical-small: 4px;
3504
3508
  --wds-variable-input-padding-vertical-tiny: 4px;
3505
3509
  --wds-vertical-tabs-action-padding-horizontal-medium: 24px;