@wix/design-system-tokens 1.233.0 → 1.234.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 (14) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/odeditor/all.css +6 -6
  3. package/odeditor/all.scss +6 -6
  4. package/odeditor/all.st.css +6 -6
  5. package/odeditor/component.st.css +6 -6
  6. package/odeditor-dark/all.css +1 -1
  7. package/odeditor-dark/all.scss +1 -1
  8. package/odeditor-dark/all.st.css +1 -1
  9. package/odeditor-dark/component.st.css +1 -1
  10. package/package.json +2 -2
  11. package/studio2-light/all.css +1 -1
  12. package/studio2-light/all.scss +1 -1
  13. package/studio2-light/all.st.css +1 -1
  14. package/studio2-light/component.st.css +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,13 @@
1
+ ## 1.234.0
2
+
3
+ ### Minor Changes
4
+
5
+ - [#17165](https://github.com/wix-private/wix-design-systems/pull/17165) [`e63cad2`](https://github.com/wix-private/wix-design-systems/commit/e63cad257158e0cf656ef471e4771efd733f33a8) - **Visual breaking change:** `--wds-loader-stroke-width-tiny` is now `3px` instead of `2px` in Harmony (odeditor), Studio 2.0 (odeditor-dark) and Studio 2.0 Light (studio2-light), matching the other themes.
6
+
7
+ ### Patch Changes
8
+
9
+ - [#17298](https://github.com/wix-private/wix-design-systems/pull/17298) [`81c1e2a`](https://github.com/wix-private/wix-design-systems/commit/81c1e2a1bd91ddef3dce7885e3127699e7a2022f) - Page.Header tokens in Harmony (odeditor) move to the updated BM spec: `--wds-page-header-padding-vertical` from `space.600` (24px) to `space.800` (32px), `--wds-page-header-padding-vertical-small` from `space.475` (18px) to `space.600` (24px), `--wds-page-header-subtitle-gap` from `space.100` (4px) to `space.150` (6px), and the subtitle font size and line height from `font.size.200` / `font.line-height.200` (12px/16px) to `font.size.body.small` / `font.line-height.body.small` (14px/18px). Other themes are unchanged.
10
+
1
11
  ## 1.233.0
2
12
 
3
13
  ### Minor Changes
package/odeditor/all.css CHANGED
@@ -413,7 +413,7 @@
413
413
  --wds-marketing-layout-badge-side: auto;
414
414
  --wds-marketing-layout-badge-position: static;
415
415
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
416
- --wds-loader-stroke-width-tiny: 2px;
416
+ --wds-loader-stroke-width-tiny: 3px;
417
417
  --wds-loader-stroke-width-small: 2px;
418
418
  --wds-loader-stroke-width-medium: 2px;
419
419
  --wds-loader-stroke-width-large: 2px;
@@ -1442,10 +1442,9 @@
1442
1442
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-heading-3);
1443
1443
  --wds-page-header-title-actions-gap: var(--wds-space-1000);
1444
1444
  --wds-page-header-subtitle-padding-start: var(--wds-space-0);
1445
- --wds-page-header-subtitle-gap: var(--wds-space-100);
1446
- --wds-page-header-subtitle-font-size: var(--wds-font-size-200);
1447
- --wds-page-header-padding-vertical-small: var(--wds-space-475);
1448
- --wds-page-header-padding-vertical: var(--wds-space-600);
1445
+ --wds-page-header-subtitle-gap: var(--wds-space-150);
1446
+ --wds-page-header-padding-vertical-small: var(--wds-space-600);
1447
+ --wds-page-header-padding-vertical: var(--wds-space-800);
1449
1448
  --wds-page-header-padding-horizontal-small: var(--wds-space-600);
1450
1449
  --wds-page-header-padding-horizontal: var(--wds-space-1200);
1451
1450
  --wds-page-header-padding-bottom-with-tail: var(--wds-space-300);
@@ -2337,7 +2336,7 @@
2337
2336
  --wds-page-header-title-minimised-font-size: var(--wds-font-size-heading-3);
2338
2337
  --wds-page-header-title-font-weight: var(--wds-font-weight-heading-2);
2339
2338
  --wds-page-header-title-font-size: var(--wds-font-size-heading-2);
2340
- --wds-page-header-subtitle-line-height: var(--wds-font-line-height-200);
2339
+ --wds-page-header-subtitle-font-size: var(--wds-font-size-body-small);
2341
2340
  --wds-number-input-spacing: var(--wds-form-field-label-gap-tiny);
2342
2341
  --wds-number-input-icon-fill: var(--wds-color-text-standard-secondary);
2343
2342
  --wds-notification-content-color: var(--wds-color-text-standard-secondary);
@@ -2727,6 +2726,7 @@
2727
2726
  --wds-page-section-subtitle-line-height: var(--wds-font-line-height-body-tiny);
2728
2727
  --wds-page-header-title-minimised-line-height: var(--wds-font-line-height-heading-3);
2729
2728
  --wds-page-header-title-line-height: var(--wds-font-line-height-heading-2);
2729
+ --wds-page-header-subtitle-line-height: var(--wds-font-line-height-body-small);
2730
2730
  --wds-message-modal-text-font-line-height: var(--wds-font-line-height-body-small);
2731
2731
  --wds-marketing-page-content-line-height: var(--wds-font-line-height-body-small);
2732
2732
  --wds-marketing-layout-description-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/odeditor/all.scss CHANGED
@@ -182,7 +182,7 @@
182
182
  --wds-marketing-layout-badge-side: auto;
183
183
  --wds-marketing-layout-badge-position: static;
184
184
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
185
- --wds-loader-stroke-width-tiny: 2px;
185
+ --wds-loader-stroke-width-tiny: 3px;
186
186
  --wds-loader-stroke-width-small: 2px;
187
187
  --wds-loader-stroke-width-medium: 2px;
188
188
  --wds-loader-stroke-width-large: 2px;
@@ -1110,10 +1110,9 @@
1110
1110
  --wds-page-header-title-minimised-font-weight: var(--wds-font-weight-heading-3);
1111
1111
  --wds-page-header-title-actions-gap: var(--wds-space-1000);
1112
1112
  --wds-page-header-subtitle-padding-start: var(--wds-space-0);
1113
- --wds-page-header-subtitle-gap: var(--wds-space-100);
1114
- --wds-page-header-subtitle-font-size: var(--wds-font-size-200);
1115
- --wds-page-header-padding-vertical-small: var(--wds-space-475);
1116
- --wds-page-header-padding-vertical: var(--wds-space-600);
1113
+ --wds-page-header-subtitle-gap: var(--wds-space-150);
1114
+ --wds-page-header-padding-vertical-small: var(--wds-space-600);
1115
+ --wds-page-header-padding-vertical: var(--wds-space-800);
1117
1116
  --wds-page-header-padding-horizontal-small: var(--wds-space-600);
1118
1117
  --wds-page-header-padding-horizontal: var(--wds-space-1200);
1119
1118
  --wds-page-header-padding-bottom-with-tail: var(--wds-space-300);
@@ -2306,7 +2305,7 @@
2306
2305
  --wds-page-header-title-minimised-font-size: var(--wds-font-size-heading-3);
2307
2306
  --wds-page-header-title-font-weight: var(--wds-font-weight-heading-2);
2308
2307
  --wds-page-header-title-font-size: var(--wds-font-size-heading-2);
2309
- --wds-page-header-subtitle-line-height: var(--wds-font-line-height-200);
2308
+ --wds-page-header-subtitle-font-size: var(--wds-font-size-body-small);
2310
2309
  --wds-number-input-spacing: var(--wds-form-field-label-gap-tiny);
2311
2310
  --wds-number-input-icon-fill: var(--wds-color-text-standard-secondary);
2312
2311
  --wds-notification-content-color: var(--wds-color-text-standard-secondary);
@@ -2727,6 +2726,7 @@
2727
2726
  --wds-page-section-subtitle-line-height: var(--wds-font-line-height-body-tiny);
2728
2727
  --wds-page-header-title-minimised-line-height: var(--wds-font-line-height-heading-3);
2729
2728
  --wds-page-header-title-line-height: var(--wds-font-line-height-heading-2);
2729
+ --wds-page-header-subtitle-line-height: var(--wds-font-line-height-body-small);
2730
2730
  --wds-message-modal-text-font-line-height: var(--wds-font-line-height-body-small);
2731
2731
  --wds-marketing-page-content-line-height: var(--wds-font-line-height-body-small);
2732
2732
  --wds-marketing-layout-description-line-height-tiny: var(--wds-font-line-height-body-tiny);
package/odeditor/all.st.css CHANGED
@@ -4360,7 +4360,7 @@
4360
4360
  --wds-loader-stroke-width-large: 2px;
4361
4361
  --wds-loader-stroke-width-medium: 2px;
4362
4362
  --wds-loader-stroke-width-small: 2px;
4363
- --wds-loader-stroke-width-tiny: 2px;
4363
+ --wds-loader-stroke-width-tiny: 3px;
4364
4364
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
4365
4365
  --wds-marketing-layout-actions-gap-medium: 24px;
4366
4366
  --wds-marketing-layout-actions-gap-small: 24px;
@@ -4532,11 +4532,11 @@
4532
4532
  --wds-page-header-padding-bottom-with-tail: 12px;
4533
4533
  --wds-page-header-padding-horizontal: 48px;
4534
4534
  --wds-page-header-padding-horizontal-small: 24px;
4535
- --wds-page-header-padding-vertical: 24px;
4536
- --wds-page-header-padding-vertical-small: 18px;
4537
- --wds-page-header-subtitle-font-size: 12px;
4538
- --wds-page-header-subtitle-gap: 4px;
4539
- --wds-page-header-subtitle-line-height: 16px;
4535
+ --wds-page-header-padding-vertical: 32px;
4536
+ --wds-page-header-padding-vertical-small: 24px;
4537
+ --wds-page-header-subtitle-font-size: 14px;
4538
+ --wds-page-header-subtitle-gap: 6px;
4539
+ --wds-page-header-subtitle-line-height: 18px;
4540
4540
  --wds-page-header-subtitle-padding-start: 0px;
4541
4541
  --wds-page-header-title-actions-gap: 40px;
4542
4542
  --wds-page-header-title-font-size: 24px;
package/odeditor/component.st.css CHANGED
@@ -3015,7 +3015,7 @@
3015
3015
  --wds-loader-stroke-width-large: 2px;
3016
3016
  --wds-loader-stroke-width-medium: 2px;
3017
3017
  --wds-loader-stroke-width-small: 2px;
3018
- --wds-loader-stroke-width-tiny: 2px;
3018
+ --wds-loader-stroke-width-tiny: 3px;
3019
3019
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
3020
3020
  --wds-marketing-layout-actions-gap-medium: 24px;
3021
3021
  --wds-marketing-layout-actions-gap-small: 24px;
@@ -3185,11 +3185,11 @@
3185
3185
  --wds-page-header-padding-bottom-with-tail: 12px;
3186
3186
  --wds-page-header-padding-horizontal: 48px;
3187
3187
  --wds-page-header-padding-horizontal-small: 24px;
3188
- --wds-page-header-padding-vertical: 24px;
3189
- --wds-page-header-padding-vertical-small: 18px;
3190
- --wds-page-header-subtitle-font-size: 12px;
3191
- --wds-page-header-subtitle-gap: 4px;
3192
- --wds-page-header-subtitle-line-height: 16px;
3188
+ --wds-page-header-padding-vertical: 32px;
3189
+ --wds-page-header-padding-vertical-small: 24px;
3190
+ --wds-page-header-subtitle-font-size: 14px;
3191
+ --wds-page-header-subtitle-gap: 6px;
3192
+ --wds-page-header-subtitle-line-height: 18px;
3193
3193
  --wds-page-header-subtitle-padding-start: 0px;
3194
3194
  --wds-page-header-title-actions-gap: 40px;
3195
3195
  --wds-page-header-title-font-size: 24px;
package/odeditor-dark/all.css CHANGED
@@ -435,7 +435,7 @@
435
435
  --wds-marketing-layout-badge-side: auto;
436
436
  --wds-marketing-layout-badge-position: static;
437
437
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
438
- --wds-loader-stroke-width-tiny: 2px;
438
+ --wds-loader-stroke-width-tiny: 3px;
439
439
  --wds-loader-stroke-width-small: 2px;
440
440
  --wds-loader-stroke-width-medium: 2px;
441
441
  --wds-loader-stroke-width-large: 2px;
package/odeditor-dark/all.scss CHANGED
@@ -203,7 +203,7 @@
203
203
  --wds-marketing-layout-badge-side: auto;
204
204
  --wds-marketing-layout-badge-position: static;
205
205
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
206
- --wds-loader-stroke-width-tiny: 2px;
206
+ --wds-loader-stroke-width-tiny: 3px;
207
207
  --wds-loader-stroke-width-small: 2px;
208
208
  --wds-loader-stroke-width-medium: 2px;
209
209
  --wds-loader-stroke-width-large: 2px;
package/odeditor-dark/all.st.css CHANGED
@@ -4366,7 +4366,7 @@
4366
4366
  --wds-loader-stroke-width-large: 2px;
4367
4367
  --wds-loader-stroke-width-medium: 2px;
4368
4368
  --wds-loader-stroke-width-small: 2px;
4369
- --wds-loader-stroke-width-tiny: 2px;
4369
+ --wds-loader-stroke-width-tiny: 3px;
4370
4370
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
4371
4371
  --wds-marketing-layout-actions-gap-medium: 24px;
4372
4372
  --wds-marketing-layout-actions-gap-small: 24px;
package/odeditor-dark/component.st.css CHANGED
@@ -3019,7 +3019,7 @@
3019
3019
  --wds-loader-stroke-width-large: 2px;
3020
3020
  --wds-loader-stroke-width-medium: 2px;
3021
3021
  --wds-loader-stroke-width-small: 2px;
3022
- --wds-loader-stroke-width-tiny: 2px;
3022
+ --wds-loader-stroke-width-tiny: 3px;
3023
3023
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
3024
3024
  --wds-marketing-layout-actions-gap-medium: 24px;
3025
3025
  --wds-marketing-layout-actions-gap-small: 24px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.233.0",
3
+ "version": "1.234.0",
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": "c9835caac33195425395abd502c6c47598ed5a9403cd305ffb3945b9"
39
+ "falconPackageHash": "e5be47b461afdd11f6ac8f03bc375a1c7c489148ee1083e76ca61ae7"
40
40
  }
package/studio2-light/all.css CHANGED
@@ -430,7 +430,7 @@
430
430
  --wds-marketing-layout-badge-side: auto;
431
431
  --wds-marketing-layout-badge-position: static;
432
432
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
433
- --wds-loader-stroke-width-tiny: 2px;
433
+ --wds-loader-stroke-width-tiny: 3px;
434
434
  --wds-loader-stroke-width-small: 2px;
435
435
  --wds-loader-stroke-width-medium: 2px;
436
436
  --wds-loader-stroke-width-large: 2px;
package/studio2-light/all.scss CHANGED
@@ -199,7 +199,7 @@
199
199
  --wds-marketing-layout-badge-side: auto;
200
200
  --wds-marketing-layout-badge-position: static;
201
201
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
202
- --wds-loader-stroke-width-tiny: 2px;
202
+ --wds-loader-stroke-width-tiny: 3px;
203
203
  --wds-loader-stroke-width-small: 2px;
204
204
  --wds-loader-stroke-width-medium: 2px;
205
205
  --wds-loader-stroke-width-large: 2px;
package/studio2-light/all.st.css CHANGED
@@ -4360,7 +4360,7 @@
4360
4360
  --wds-loader-stroke-width-large: 2px;
4361
4361
  --wds-loader-stroke-width-medium: 2px;
4362
4362
  --wds-loader-stroke-width-small: 2px;
4363
- --wds-loader-stroke-width-tiny: 2px;
4363
+ --wds-loader-stroke-width-tiny: 3px;
4364
4364
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
4365
4365
  --wds-marketing-layout-actions-gap-medium: 24px;
4366
4366
  --wds-marketing-layout-actions-gap-small: 24px;
package/studio2-light/component.st.css CHANGED
@@ -3015,7 +3015,7 @@
3015
3015
  --wds-loader-stroke-width-large: 2px;
3016
3016
  --wds-loader-stroke-width-medium: 2px;
3017
3017
  --wds-loader-stroke-width-small: 2px;
3018
- --wds-loader-stroke-width-tiny: 2px;
3018
+ --wds-loader-stroke-width-tiny: 3px;
3019
3019
  --wds-marketing-layout-actions-alignment-inverted: flex-end;
3020
3020
  --wds-marketing-layout-actions-gap-medium: 24px;
3021
3021
  --wds-marketing-layout-actions-gap-small: 24px;