@wix/design-system-tokens 1.240.0 → 1.242.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## 1.242.0
2
+
3
+ ### Minor Changes
4
+
5
+ - [#17751](https://github.com/wix-private/wix-design-systems/pull/17751) [`fa43bf7`](https://github.com/wix-private/wix-design-systems/commit/fa43bf76227707d8539fec41ced754c2af126387) - Add a motion duration scale to all themes: sixteen steps from `--wds-motion-duration-100` (`50ms`) to `--wds-motion-duration-1600` (`800ms`), following the same step naming as the spacing scale, for timing transitions and animations consistently.
6
+
7
+ ## 1.241.0
8
+
9
+ ### Minor Changes
10
+
11
+ - [#17688](https://github.com/wix-private/wix-design-systems/pull/17688) [`3c1a4d9`](https://github.com/wix-private/wix-design-systems/commit/3c1a4d9adfaa72e3005825e25b83c8d36664a0d0) - Add the BM Dark (bm-dark) theme, Business Manager's dark mode: BM Light (bm-light)'s sizes, spacing and shapes with Studio 2.0 (odeditor-dark)'s dark colours across the foundation, semantic and component layers. Import it from `@wix/design-system-tokens/bm-dark/all.css` (or `all.scss` / `all.st.css`).
12
+
13
+ - [#17688](https://github.com/wix-private/wix-design-systems/pull/17688) [`3c1a4d9`](https://github.com/wix-private/wix-design-systems/commit/3c1a4d9adfaa72e3005825e25b83c8d36664a0d0) - Add the BM Light (bm-light) theme, Business Manager's own light theme, which starts as a copy of Harmony (odeditor)'s foundation, semantic and component tokens and changes independently of it from now on. Import it from `@wix/design-system-tokens/bm-light/all.css` (or `all.scss` / `all.st.css`).
14
+
15
+ - [#17739](https://github.com/wix-private/wix-design-systems/pull/17739) [`b01a72b`](https://github.com/wix-private/wix-design-systems/commit/b01a72bb022d1a4e108e6284341153c6c253b941) - **Visual breaking change:** Harmony (odeditor) sidebar tokens: smaller header, footer and collapsed-rail paddings, a 54px collapsed width, level-2 group bottom spacing, no footer fade, and a darker outer border, from `#EEEEEE` to `#D9D9D9`.
16
+
17
+ - [#17787](https://github.com/wix-private/wix-design-systems/pull/17787) [`f53806b`](https://github.com/wix-private/wix-design-systems/commit/f53806bf56e7e6de011e5e41b733a8f09b785544) - Add a motion easing scale to all themes: ten shared easing curves, from linear to overshoot, for timing transitions and animations consistently.
18
+
19
+ - [#17607](https://github.com/wix-private/wix-design-systems/pull/17607) [`9d2d781`](https://github.com/wix-private/wix-design-systems/commit/9d2d7811e0692db88ef28e082243722c031a44a3) - **Visual breaking change:** In Harmony (odeditor), Notification text, icons, links and the close button are darker, and the premium Notification fill is purple instead of iris.
20
+
1
21
  ## 1.240.0
2
22
 
3
23
  ### Minor Changes
package/all.css CHANGED
@@ -58,6 +58,32 @@
58
58
  --wds-shadow-blur-35: 2px;
59
59
  --wds-shadow-blur-25: 1px;
60
60
  --wds-shadow-blur-0: 0px;
61
+ --wds-motion-easing-1000: cubic-bezier(0.4, 0, 1, 1);
62
+ --wds-motion-easing-900: cubic-bezier(0.26, 0, 0.67, 1);
63
+ --wds-motion-easing-800: cubic-bezier(0.18, 0.89, 0.32, 1.28);
64
+ --wds-motion-easing-700: cubic-bezier(0.25, 1, 0.5, 1);
65
+ --wds-motion-easing-600: cubic-bezier(0, 0, 0.2, 1);
66
+ --wds-motion-easing-500: cubic-bezier(0, 0, 0.58, 1);
67
+ --wds-motion-easing-400: cubic-bezier(0.76, 0, 0.24, 1);
68
+ --wds-motion-easing-300: cubic-bezier(0.4, 0, 0.2, 1);
69
+ --wds-motion-easing-200: cubic-bezier(0.42, 0, 0.58, 1);
70
+ --wds-motion-easing-100: linear;
71
+ --wds-motion-duration-1600: 800ms;
72
+ --wds-motion-duration-1500: 750ms;
73
+ --wds-motion-duration-1400: 700ms;
74
+ --wds-motion-duration-1300: 650ms;
75
+ --wds-motion-duration-1200: 600ms;
76
+ --wds-motion-duration-1100: 550ms;
77
+ --wds-motion-duration-1000: 500ms;
78
+ --wds-motion-duration-900: 450ms;
79
+ --wds-motion-duration-800: 400ms;
80
+ --wds-motion-duration-700: 350ms;
81
+ --wds-motion-duration-600: 300ms;
82
+ --wds-motion-duration-500: 250ms;
83
+ --wds-motion-duration-400: 200ms;
84
+ --wds-motion-duration-300: 150ms;
85
+ --wds-motion-duration-200: 100ms;
86
+ --wds-motion-duration-100: 50ms;
61
87
  --wds-font-weight-semi-bold: 600;
62
88
  --wds-font-weight-regular: 400;
63
89
  --wds-font-weight-medium: 500;
package/all.scss CHANGED
@@ -135,6 +135,32 @@
135
135
  --wds-page-header-breadcrumbs-offset-medium: -9px;
136
136
  --wds-page-header-breadcrumbs-offset-large: -15px;
137
137
  --wds-page-header-back-button-gap: 8px;
138
+ --wds-motion-easing-1000: cubic-bezier(0.4, 0, 1, 1);
139
+ --wds-motion-easing-900: cubic-bezier(0.26, 0, 0.67, 1);
140
+ --wds-motion-easing-800: cubic-bezier(0.18, 0.89, 0.32, 1.28);
141
+ --wds-motion-easing-700: cubic-bezier(0.25, 1, 0.5, 1);
142
+ --wds-motion-easing-600: cubic-bezier(0, 0, 0.2, 1);
143
+ --wds-motion-easing-500: cubic-bezier(0, 0, 0.58, 1);
144
+ --wds-motion-easing-400: cubic-bezier(0.76, 0, 0.24, 1);
145
+ --wds-motion-easing-300: cubic-bezier(0.4, 0, 0.2, 1);
146
+ --wds-motion-easing-200: cubic-bezier(0.42, 0, 0.58, 1);
147
+ --wds-motion-easing-100: linear;
148
+ --wds-motion-duration-1600: 800ms;
149
+ --wds-motion-duration-1500: 750ms;
150
+ --wds-motion-duration-1400: 700ms;
151
+ --wds-motion-duration-1300: 650ms;
152
+ --wds-motion-duration-1200: 600ms;
153
+ --wds-motion-duration-1100: 550ms;
154
+ --wds-motion-duration-1000: 500ms;
155
+ --wds-motion-duration-900: 450ms;
156
+ --wds-motion-duration-800: 400ms;
157
+ --wds-motion-duration-700: 350ms;
158
+ --wds-motion-duration-600: 300ms;
159
+ --wds-motion-duration-500: 250ms;
160
+ --wds-motion-duration-400: 200ms;
161
+ --wds-motion-duration-300: 150ms;
162
+ --wds-motion-duration-200: 100ms;
163
+ --wds-motion-duration-100: 50ms;
138
164
  --wds-message-modal-close-button-fill: transparent;
139
165
  --wds-marketing-page-overline-divider-margin-top: 17px;
140
166
  --wds-marketing-page-overline-divider-display: block;
package/all.st.css CHANGED
@@ -1749,6 +1749,32 @@
1749
1749
  @property st-global(--wds-mobile-modal-content-padding-vertical);
1750
1750
  @property st-global(--wds-mobile-modal-footer-padding-horizontal);
1751
1751
  @property st-global(--wds-mobile-modal-footer-padding-vertical);
1752
+ @property st-global(--wds-motion-duration-100);
1753
+ @property st-global(--wds-motion-duration-200);
1754
+ @property st-global(--wds-motion-duration-300);
1755
+ @property st-global(--wds-motion-duration-400);
1756
+ @property st-global(--wds-motion-duration-500);
1757
+ @property st-global(--wds-motion-duration-600);
1758
+ @property st-global(--wds-motion-duration-700);
1759
+ @property st-global(--wds-motion-duration-800);
1760
+ @property st-global(--wds-motion-duration-900);
1761
+ @property st-global(--wds-motion-duration-1000);
1762
+ @property st-global(--wds-motion-duration-1100);
1763
+ @property st-global(--wds-motion-duration-1200);
1764
+ @property st-global(--wds-motion-duration-1300);
1765
+ @property st-global(--wds-motion-duration-1400);
1766
+ @property st-global(--wds-motion-duration-1500);
1767
+ @property st-global(--wds-motion-duration-1600);
1768
+ @property st-global(--wds-motion-easing-100);
1769
+ @property st-global(--wds-motion-easing-200);
1770
+ @property st-global(--wds-motion-easing-300);
1771
+ @property st-global(--wds-motion-easing-400);
1772
+ @property st-global(--wds-motion-easing-500);
1773
+ @property st-global(--wds-motion-easing-600);
1774
+ @property st-global(--wds-motion-easing-700);
1775
+ @property st-global(--wds-motion-easing-800);
1776
+ @property st-global(--wds-motion-easing-900);
1777
+ @property st-global(--wds-motion-easing-1000);
1752
1778
  @property st-global(--wds-multiselect-icon-fill);
1753
1779
  @property st-global(--wds-nestable-list-fill);
1754
1780
  @property st-global(--wds-nestable-list-paddings);
@@ -4530,6 +4556,32 @@
4530
4556
  --wds-mobile-modal-content-padding-vertical: 24px;
4531
4557
  --wds-mobile-modal-footer-padding-horizontal: 24px;
4532
4558
  --wds-mobile-modal-footer-padding-vertical: 24px;
4559
+ --wds-motion-duration-100: 50ms;
4560
+ --wds-motion-duration-200: 100ms;
4561
+ --wds-motion-duration-300: 150ms;
4562
+ --wds-motion-duration-400: 200ms;
4563
+ --wds-motion-duration-500: 250ms;
4564
+ --wds-motion-duration-600: 300ms;
4565
+ --wds-motion-duration-700: 350ms;
4566
+ --wds-motion-duration-800: 400ms;
4567
+ --wds-motion-duration-900: 450ms;
4568
+ --wds-motion-duration-1000: 500ms;
4569
+ --wds-motion-duration-1100: 550ms;
4570
+ --wds-motion-duration-1200: 600ms;
4571
+ --wds-motion-duration-1300: 650ms;
4572
+ --wds-motion-duration-1400: 700ms;
4573
+ --wds-motion-duration-1500: 750ms;
4574
+ --wds-motion-duration-1600: 800ms;
4575
+ --wds-motion-easing-100: linear;
4576
+ --wds-motion-easing-200: cubic-bezier(0.42, 0, 0.58, 1);
4577
+ --wds-motion-easing-300: cubic-bezier(0.4, 0, 0.2, 1);
4578
+ --wds-motion-easing-400: cubic-bezier(0.76, 0, 0.24, 1);
4579
+ --wds-motion-easing-500: cubic-bezier(0, 0, 0.58, 1);
4580
+ --wds-motion-easing-600: cubic-bezier(0, 0, 0.2, 1);
4581
+ --wds-motion-easing-700: cubic-bezier(0.25, 1, 0.5, 1);
4582
+ --wds-motion-easing-800: cubic-bezier(0.18, 0.89, 0.32, 1.28);
4583
+ --wds-motion-easing-900: cubic-bezier(0.26, 0, 0.67, 1);
4584
+ --wds-motion-easing-1000: cubic-bezier(0.4, 0, 1, 1);
4533
4585
  --wds-multiselect-icon-fill: #116dff;
4534
4586
  --wds-nestable-list-fill: #ffffff;
4535
4587
  --wds-nestable-list-paddings: 0px;