@wix/design-system-tokens 1.57.1 → 1.58.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 (11) hide show
  1. package/all.css +2 -0
  2. package/all.st.css +28 -24
  3. package/component.st.css +4 -0
  4. package/foundation.st.css +16 -16
  5. package/package.json +2 -2
  6. package/semantic.st.css +8 -8
  7. package/studio/all.css +2 -0
  8. package/studio/all.st.css +28 -24
  9. package/studio/component.st.css +4 -0
  10. package/studio/foundation.st.css +16 -16
  11. package/studio/semantic.st.css +8 -8
package/all.css CHANGED
@@ -377,6 +377,8 @@
377
377
  --wds-section-helper-fullwidth-vertical-padding-small: 9px;
378
378
  --wds-section-helper-horizontal-margin: 6px;
379
379
  --wds-section-helper-prefix-offset-margin: 6px;
380
+ --wds-section-helper-text-font-line-height: 18px;
381
+ --wds-section-helper-text-font-size: 14px;
380
382
  --wds-segmented-toggle-border-radius-medium: 6px;
381
383
  --wds-segmented-toggle-border-radius-small: 6px;
382
384
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 6px;
package/all.st.css CHANGED
@@ -328,10 +328,6 @@
328
328
  @property st-global(--wds-color-fill-social-instagram-active);
329
329
  @property st-global(--wds-color-fill-social-instagram-disabled);
330
330
  @property st-global(--wds-color-fill-social-instagram-hover);
331
- @property st-global(--wds-color-fill-social-youtube);
332
- @property st-global(--wds-color-fill-social-youtube-active);
333
- @property st-global(--wds-color-fill-social-youtube-disabled);
334
- @property st-global(--wds-color-fill-social-youtube-hover);
335
331
  @property st-global(--wds-color-fill-social-linkedin);
336
332
  @property st-global(--wds-color-fill-social-linkedin-active);
337
333
  @property st-global(--wds-color-fill-social-linkedin-disabled);
@@ -348,6 +344,10 @@
348
344
  @property st-global(--wds-color-fill-social-xcorp-active);
349
345
  @property st-global(--wds-color-fill-social-xcorp-disabled);
350
346
  @property st-global(--wds-color-fill-social-xcorp-hover);
347
+ @property st-global(--wds-color-fill-social-youtube);
348
+ @property st-global(--wds-color-fill-social-youtube-active);
349
+ @property st-global(--wds-color-fill-social-youtube-disabled);
350
+ @property st-global(--wds-color-fill-social-youtube-hover);
351
351
  @property st-global(--wds-color-fill-standard-light-primary);
352
352
  @property st-global(--wds-color-fill-standard-light-primary-active);
353
353
  @property st-global(--wds-color-fill-standard-light-primary-disabled);
@@ -435,14 +435,6 @@
435
435
  @property st-global(--wds-color-green-400);
436
436
  @property st-global(--wds-color-green-500);
437
437
  @property st-global(--wds-color-green-600);
438
- @property st-global(--wds-color-yellow-0);
439
- @property st-global(--wds-color-yellow-50);
440
- @property st-global(--wds-color-yellow-100);
441
- @property st-global(--wds-color-yellow-200);
442
- @property st-global(--wds-color-yellow-300);
443
- @property st-global(--wds-color-yellow-400);
444
- @property st-global(--wds-color-yellow-500);
445
- @property st-global(--wds-color-yellow-600);
446
438
  @property st-global(--wds-color-iris-0);
447
439
  @property st-global(--wds-color-iris-50);
448
440
  @property st-global(--wds-color-iris-100);
@@ -502,6 +494,14 @@
502
494
  @property st-global(--wds-color-white-transparent-50);
503
495
  @property st-global(--wds-color-white-transparent-70);
504
496
  @property st-global(--wds-color-white-transparent-80);
497
+ @property st-global(--wds-color-yellow-0);
498
+ @property st-global(--wds-color-yellow-50);
499
+ @property st-global(--wds-color-yellow-100);
500
+ @property st-global(--wds-color-yellow-200);
501
+ @property st-global(--wds-color-yellow-300);
502
+ @property st-global(--wds-color-yellow-400);
503
+ @property st-global(--wds-color-yellow-500);
504
+ @property st-global(--wds-color-yellow-600);
505
505
  @property st-global(--wds-composer-sidebar-bottom-width);
506
506
  @property st-global(--wds-composer-sidebar-end-max-width);
507
507
  @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
@@ -822,6 +822,8 @@
822
822
  @property st-global(--wds-section-helper-fullwidth-vertical-padding-small);
823
823
  @property st-global(--wds-section-helper-horizontal-margin);
824
824
  @property st-global(--wds-section-helper-prefix-offset-margin);
825
+ @property st-global(--wds-section-helper-text-font-line-height);
826
+ @property st-global(--wds-section-helper-text-font-size);
825
827
  @property st-global(--wds-segmented-toggle-border-radius-medium);
826
828
  @property st-global(--wds-segmented-toggle-border-radius-small);
827
829
  @property st-global(--wds-segmented-toggle-icononly-padding-horizontal-medium);
@@ -1496,10 +1498,6 @@
1496
1498
  --wds-color-fill-social-instagram-active: #ff0175;
1497
1499
  --wds-color-fill-social-instagram-disabled: rgba(0, 6, 36, .3);
1498
1500
  --wds-color-fill-social-instagram-hover: rgba(255, 1, 117, .8);
1499
- --wds-color-fill-social-youtube: #ff0000;
1500
- --wds-color-fill-social-youtube-active: #ff0000;
1501
- --wds-color-fill-social-youtube-disabled: rgba(0, 6, 36, .3);
1502
- --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
1503
1501
  --wds-color-fill-social-linkedin: #0065c8;
1504
1502
  --wds-color-fill-social-linkedin-active: #0065c8;
1505
1503
  --wds-color-fill-social-linkedin-disabled: rgba(0, 6, 36, .3);
@@ -1516,6 +1514,10 @@
1516
1514
  --wds-color-fill-social-xcorp-active: #101419;
1517
1515
  --wds-color-fill-social-xcorp-disabled: rgba(0, 6, 36, .3);
1518
1516
  --wds-color-fill-social-xcorp-hover: rgba(16, 20, 25, .8);
1517
+ --wds-color-fill-social-youtube: #ff0000;
1518
+ --wds-color-fill-social-youtube-active: #ff0000;
1519
+ --wds-color-fill-social-youtube-disabled: rgba(0, 6, 36, .3);
1520
+ --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
1519
1521
  --wds-color-fill-standard-light-primary: #80b1ff;
1520
1522
  --wds-color-fill-standard-light-primary-active: #5999ff;
1521
1523
  --wds-color-fill-standard-light-primary-disabled: rgba(255, 255, 255, .3);
@@ -1603,14 +1605,6 @@
1603
1605
  --wds-color-green-400: #c8e8d6;
1604
1606
  --wds-color-green-500: #e1f4eb;
1605
1607
  --wds-color-green-600: #e9f6ee;
1606
- --wds-color-yellow-0: #d59900;
1607
- --wds-color-yellow-50: #e7a600;
1608
- --wds-color-yellow-100: #ffb700;
1609
- --wds-color-yellow-200: #ffc23d;
1610
- --wds-color-yellow-300: #ffd16e;
1611
- --wds-color-yellow-400: #ffe2a5;
1612
- --wds-color-yellow-500: #fff0d1;
1613
- --wds-color-yellow-600: #fff6e5;
1614
1608
  --wds-color-iris-0: #4d3dd0;
1615
1609
  --wds-color-iris-50: #5443e3;
1616
1610
  --wds-color-iris-100: #5a48f5;
@@ -1670,6 +1664,14 @@
1670
1664
  --wds-color-white-transparent-50: rgba(255, 255, 255, .5);
1671
1665
  --wds-color-white-transparent-70: rgba(255, 255, 255, .7);
1672
1666
  --wds-color-white-transparent-80: rgba(255, 255, 255, .8);
1667
+ --wds-color-yellow-0: #d59900;
1668
+ --wds-color-yellow-50: #e7a600;
1669
+ --wds-color-yellow-100: #ffb700;
1670
+ --wds-color-yellow-200: #ffc23d;
1671
+ --wds-color-yellow-300: #ffd16e;
1672
+ --wds-color-yellow-400: #ffe2a5;
1673
+ --wds-color-yellow-500: #fff0d1;
1674
+ --wds-color-yellow-600: #fff6e5;
1673
1675
  --wds-composer-sidebar-bottom-width: 90px;
1674
1676
  --wds-composer-sidebar-end-max-width: 240px;
1675
1677
  --wds-composer-sidebar-item-bottom-padding-horizontal-large: 6px;
@@ -1990,6 +1992,8 @@
1990
1992
  --wds-section-helper-fullwidth-vertical-padding-small: 9px;
1991
1993
  --wds-section-helper-horizontal-margin: 6px;
1992
1994
  --wds-section-helper-prefix-offset-margin: 6px;
1995
+ --wds-section-helper-text-font-line-height: 18px;
1996
+ --wds-section-helper-text-font-size: 14px;
1993
1997
  --wds-segmented-toggle-border-radius-medium: 6px;
1994
1998
  --wds-segmented-toggle-border-radius-small: 6px;
1995
1999
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 6px;
package/component.st.css CHANGED
@@ -376,6 +376,8 @@
376
376
  @property st-global(--wds-section-helper-fullwidth-vertical-padding-small);
377
377
  @property st-global(--wds-section-helper-horizontal-margin);
378
378
  @property st-global(--wds-section-helper-prefix-offset-margin);
379
+ @property st-global(--wds-section-helper-text-font-line-height);
380
+ @property st-global(--wds-section-helper-text-font-size);
379
381
  @property st-global(--wds-segmented-toggle-border-radius-medium);
380
382
  @property st-global(--wds-segmented-toggle-border-radius-small);
381
383
  @property st-global(--wds-segmented-toggle-icononly-padding-horizontal-medium);
@@ -1032,6 +1034,8 @@
1032
1034
  --wds-section-helper-fullwidth-vertical-padding-small: 9px;
1033
1035
  --wds-section-helper-horizontal-margin: 6px;
1034
1036
  --wds-section-helper-prefix-offset-margin: 6px;
1037
+ --wds-section-helper-text-font-line-height: 18px;
1038
+ --wds-section-helper-text-font-size: 14px;
1035
1039
  --wds-segmented-toggle-border-radius-medium: 6px;
1036
1040
  --wds-segmented-toggle-border-radius-small: 6px;
1037
1041
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 6px;
package/foundation.st.css CHANGED
@@ -52,14 +52,6 @@
52
52
  @property st-global(--wds-color-green-400);
53
53
  @property st-global(--wds-color-green-500);
54
54
  @property st-global(--wds-color-green-600);
55
- @property st-global(--wds-color-yellow-0);
56
- @property st-global(--wds-color-yellow-50);
57
- @property st-global(--wds-color-yellow-100);
58
- @property st-global(--wds-color-yellow-200);
59
- @property st-global(--wds-color-yellow-300);
60
- @property st-global(--wds-color-yellow-400);
61
- @property st-global(--wds-color-yellow-500);
62
- @property st-global(--wds-color-yellow-600);
63
55
  @property st-global(--wds-color-iris-0);
64
56
  @property st-global(--wds-color-iris-50);
65
57
  @property st-global(--wds-color-iris-100);
@@ -105,6 +97,14 @@
105
97
  @property st-global(--wds-color-white-transparent-50);
106
98
  @property st-global(--wds-color-white-transparent-70);
107
99
  @property st-global(--wds-color-white-transparent-80);
100
+ @property st-global(--wds-color-yellow-0);
101
+ @property st-global(--wds-color-yellow-50);
102
+ @property st-global(--wds-color-yellow-100);
103
+ @property st-global(--wds-color-yellow-200);
104
+ @property st-global(--wds-color-yellow-300);
105
+ @property st-global(--wds-color-yellow-400);
106
+ @property st-global(--wds-color-yellow-500);
107
+ @property st-global(--wds-color-yellow-600);
108
108
  @property st-global(--wds-font-family-default);
109
109
  @property st-global(--wds-font-letter-spacing-0);
110
110
  @property st-global(--wds-font-letter-spacing-100);
@@ -225,14 +225,6 @@
225
225
  --wds-color-green-400: #c8e8d6;
226
226
  --wds-color-green-500: #e1f4eb;
227
227
  --wds-color-green-600: #e9f6ee;
228
- --wds-color-yellow-0: #d59900;
229
- --wds-color-yellow-50: #e7a600;
230
- --wds-color-yellow-100: #ffb700;
231
- --wds-color-yellow-200: #ffc23d;
232
- --wds-color-yellow-300: #ffd16e;
233
- --wds-color-yellow-400: #ffe2a5;
234
- --wds-color-yellow-500: #fff0d1;
235
- --wds-color-yellow-600: #fff6e5;
236
228
  --wds-color-iris-0: #4d3dd0;
237
229
  --wds-color-iris-50: #5443e3;
238
230
  --wds-color-iris-100: #5a48f5;
@@ -278,6 +270,14 @@
278
270
  --wds-color-white-transparent-50: rgba(255, 255, 255, .5);
279
271
  --wds-color-white-transparent-70: rgba(255, 255, 255, .7);
280
272
  --wds-color-white-transparent-80: rgba(255, 255, 255, .8);
273
+ --wds-color-yellow-0: #d59900;
274
+ --wds-color-yellow-50: #e7a600;
275
+ --wds-color-yellow-100: #ffb700;
276
+ --wds-color-yellow-200: #ffc23d;
277
+ --wds-color-yellow-300: #ffd16e;
278
+ --wds-color-yellow-400: #ffe2a5;
279
+ --wds-color-yellow-500: #fff0d1;
280
+ --wds-color-yellow-600: #fff6e5;
281
281
  --wds-font-family-default: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
282
282
  --wds-font-letter-spacing-0: 0;
283
283
  --wds-font-letter-spacing-100: 1px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.57.1",
3
+ "version": "1.58.0",
4
4
  "packageManager": "yarn@3.5.0",
5
5
  "author": "augustinasv@wix.com",
6
6
  "license": "MIT",
@@ -33,5 +33,5 @@
33
33
  "groupId": "com.wixpress"
34
34
  }
35
35
  },
36
- "falconPackageHash": "eee2e83b3721189a8195d2e4347018d2b4c05977e299c7219e4fe887"
36
+ "falconPackageHash": "fc30f10249de7efd685ed3899cc67bea98bea30bd205d85c8320a429"
37
37
  }
package/semantic.st.css CHANGED
@@ -172,10 +172,6 @@
172
172
  @property st-global(--wds-color-fill-social-instagram-active);
173
173
  @property st-global(--wds-color-fill-social-instagram-disabled);
174
174
  @property st-global(--wds-color-fill-social-instagram-hover);
175
- @property st-global(--wds-color-fill-social-youtube);
176
- @property st-global(--wds-color-fill-social-youtube-active);
177
- @property st-global(--wds-color-fill-social-youtube-disabled);
178
- @property st-global(--wds-color-fill-social-youtube-hover);
179
175
  @property st-global(--wds-color-fill-social-linkedin);
180
176
  @property st-global(--wds-color-fill-social-linkedin-active);
181
177
  @property st-global(--wds-color-fill-social-linkedin-disabled);
@@ -192,6 +188,10 @@
192
188
  @property st-global(--wds-color-fill-social-xcorp-active);
193
189
  @property st-global(--wds-color-fill-social-xcorp-disabled);
194
190
  @property st-global(--wds-color-fill-social-xcorp-hover);
191
+ @property st-global(--wds-color-fill-social-youtube);
192
+ @property st-global(--wds-color-fill-social-youtube-active);
193
+ @property st-global(--wds-color-fill-social-youtube-disabled);
194
+ @property st-global(--wds-color-fill-social-youtube-hover);
195
195
  @property st-global(--wds-color-fill-standard-light-primary);
196
196
  @property st-global(--wds-color-fill-standard-light-primary-active);
197
197
  @property st-global(--wds-color-fill-standard-light-primary-disabled);
@@ -515,10 +515,6 @@
515
515
  --wds-color-fill-social-instagram-active: #ff0175;
516
516
  --wds-color-fill-social-instagram-disabled: rgba(0, 6, 36, .3);
517
517
  --wds-color-fill-social-instagram-hover: rgba(255, 1, 117, .8);
518
- --wds-color-fill-social-youtube: #ff0000;
519
- --wds-color-fill-social-youtube-active: #ff0000;
520
- --wds-color-fill-social-youtube-disabled: rgba(0, 6, 36, .3);
521
- --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
522
518
  --wds-color-fill-social-linkedin: #0065c8;
523
519
  --wds-color-fill-social-linkedin-active: #0065c8;
524
520
  --wds-color-fill-social-linkedin-disabled: rgba(0, 6, 36, .3);
@@ -535,6 +531,10 @@
535
531
  --wds-color-fill-social-xcorp-active: #101419;
536
532
  --wds-color-fill-social-xcorp-disabled: rgba(0, 6, 36, .3);
537
533
  --wds-color-fill-social-xcorp-hover: rgba(16, 20, 25, .8);
534
+ --wds-color-fill-social-youtube: #ff0000;
535
+ --wds-color-fill-social-youtube-active: #ff0000;
536
+ --wds-color-fill-social-youtube-disabled: rgba(0, 6, 36, .3);
537
+ --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
538
538
  --wds-color-fill-standard-light-primary: #80b1ff;
539
539
  --wds-color-fill-standard-light-primary-active: #5999ff;
540
540
  --wds-color-fill-standard-light-primary-disabled: rgba(255, 255, 255, .3);
package/studio/all.css CHANGED
@@ -377,6 +377,8 @@
377
377
  --wds-section-helper-fullwidth-vertical-padding-small: 6px;
378
378
  --wds-section-helper-horizontal-margin: 4px;
379
379
  --wds-section-helper-prefix-offset-margin: 4px;
380
+ --wds-section-helper-text-font-line-height: 18px;
381
+ --wds-section-helper-text-font-size: 14px;
380
382
  --wds-segmented-toggle-border-radius-medium: 4px;
381
383
  --wds-segmented-toggle-border-radius-small: 4px;
382
384
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 4px;
package/studio/all.st.css CHANGED
@@ -328,10 +328,6 @@
328
328
  @property st-global(--wds-color-fill-social-instagram-active);
329
329
  @property st-global(--wds-color-fill-social-instagram-disabled);
330
330
  @property st-global(--wds-color-fill-social-instagram-hover);
331
- @property st-global(--wds-color-fill-social-youtube);
332
- @property st-global(--wds-color-fill-social-youtube-active);
333
- @property st-global(--wds-color-fill-social-youtube-disabled);
334
- @property st-global(--wds-color-fill-social-youtube-hover);
335
331
  @property st-global(--wds-color-fill-social-linkedin);
336
332
  @property st-global(--wds-color-fill-social-linkedin-active);
337
333
  @property st-global(--wds-color-fill-social-linkedin-disabled);
@@ -348,6 +344,10 @@
348
344
  @property st-global(--wds-color-fill-social-xcorp-active);
349
345
  @property st-global(--wds-color-fill-social-xcorp-disabled);
350
346
  @property st-global(--wds-color-fill-social-xcorp-hover);
347
+ @property st-global(--wds-color-fill-social-youtube);
348
+ @property st-global(--wds-color-fill-social-youtube-active);
349
+ @property st-global(--wds-color-fill-social-youtube-disabled);
350
+ @property st-global(--wds-color-fill-social-youtube-hover);
351
351
  @property st-global(--wds-color-fill-standard-light-primary);
352
352
  @property st-global(--wds-color-fill-standard-light-primary-active);
353
353
  @property st-global(--wds-color-fill-standard-light-primary-disabled);
@@ -431,14 +431,6 @@
431
431
  @property st-global(--wds-color-green-400);
432
432
  @property st-global(--wds-color-green-500);
433
433
  @property st-global(--wds-color-green-600);
434
- @property st-global(--wds-color-yellow-0);
435
- @property st-global(--wds-color-yellow-50);
436
- @property st-global(--wds-color-yellow-100);
437
- @property st-global(--wds-color-yellow-200);
438
- @property st-global(--wds-color-yellow-300);
439
- @property st-global(--wds-color-yellow-400);
440
- @property st-global(--wds-color-yellow-500);
441
- @property st-global(--wds-color-yellow-600);
442
434
  @property st-global(--wds-color-iris-0);
443
435
  @property st-global(--wds-color-iris-50);
444
436
  @property st-global(--wds-color-iris-100);
@@ -498,6 +490,14 @@
498
490
  @property st-global(--wds-color-white-transparent-50);
499
491
  @property st-global(--wds-color-white-transparent-70);
500
492
  @property st-global(--wds-color-white-transparent-80);
493
+ @property st-global(--wds-color-yellow-0);
494
+ @property st-global(--wds-color-yellow-50);
495
+ @property st-global(--wds-color-yellow-100);
496
+ @property st-global(--wds-color-yellow-200);
497
+ @property st-global(--wds-color-yellow-300);
498
+ @property st-global(--wds-color-yellow-400);
499
+ @property st-global(--wds-color-yellow-500);
500
+ @property st-global(--wds-color-yellow-600);
501
501
  @property st-global(--wds-composer-sidebar-bottom-width);
502
502
  @property st-global(--wds-composer-sidebar-end-max-width);
503
503
  @property st-global(--wds-composer-sidebar-item-bottom-padding-horizontal-large);
@@ -818,6 +818,8 @@
818
818
  @property st-global(--wds-section-helper-fullwidth-vertical-padding-small);
819
819
  @property st-global(--wds-section-helper-horizontal-margin);
820
820
  @property st-global(--wds-section-helper-prefix-offset-margin);
821
+ @property st-global(--wds-section-helper-text-font-line-height);
822
+ @property st-global(--wds-section-helper-text-font-size);
821
823
  @property st-global(--wds-segmented-toggle-border-radius-medium);
822
824
  @property st-global(--wds-segmented-toggle-border-radius-small);
823
825
  @property st-global(--wds-segmented-toggle-icononly-padding-horizontal-medium);
@@ -1491,10 +1493,6 @@
1491
1493
  --wds-color-fill-social-instagram-active: #ff0175;
1492
1494
  --wds-color-fill-social-instagram-disabled: #bebebe;
1493
1495
  --wds-color-fill-social-instagram-hover: rgba(255, 1, 117, .8);
1494
- --wds-color-fill-social-youtube: #ff0000;
1495
- --wds-color-fill-social-youtube-active: #ff0000;
1496
- --wds-color-fill-social-youtube-disabled: #bebebe;
1497
- --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
1498
1496
  --wds-color-fill-social-linkedin: #0065c8;
1499
1497
  --wds-color-fill-social-linkedin-active: #0065c8;
1500
1498
  --wds-color-fill-social-linkedin-disabled: #bebebe;
@@ -1511,6 +1509,10 @@
1511
1509
  --wds-color-fill-social-xcorp-active: #101419;
1512
1510
  --wds-color-fill-social-xcorp-disabled: #bebebe;
1513
1511
  --wds-color-fill-social-xcorp-hover: rgba(16, 20, 25, .8);
1512
+ --wds-color-fill-social-youtube: #ff0000;
1513
+ --wds-color-fill-social-youtube-active: #ff0000;
1514
+ --wds-color-fill-social-youtube-disabled: #bebebe;
1515
+ --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
1514
1516
  --wds-color-fill-standard-light-primary: #7cafff;
1515
1517
  --wds-color-fill-standard-light-primary-active: #418aff;
1516
1518
  --wds-color-fill-standard-light-primary-disabled: rgba(255, 255, 255, .3);
@@ -1594,14 +1596,6 @@
1594
1596
  --wds-color-green-400: #c8e8d6;
1595
1597
  --wds-color-green-500: #e1f4eb;
1596
1598
  --wds-color-green-600: #e9f6ee;
1597
- --wds-color-yellow-0: #d49341;
1598
- --wds-color-yellow-50: #e7a047;
1599
- --wds-color-yellow-100: #f9ad4d;
1600
- --wds-color-yellow-200: #fabd71;
1601
- --wds-color-yellow-300: #fcd29d;
1602
- --wds-color-yellow-400: #fdead2;
1603
- --wds-color-yellow-500: #fef3e5;
1604
- --wds-color-yellow-600: #fef6ed;
1605
1599
  --wds-color-iris-0: #4d3dd0;
1606
1600
  --wds-color-iris-50: #5443e3;
1607
1601
  --wds-color-iris-100: #5a48f5;
@@ -1661,6 +1655,14 @@
1661
1655
  --wds-color-white-transparent-50: rgba(255, 255, 255, .5);
1662
1656
  --wds-color-white-transparent-70: rgba(255, 255, 255, .7);
1663
1657
  --wds-color-white-transparent-80: rgba(255, 255, 255, .8);
1658
+ --wds-color-yellow-0: #d49341;
1659
+ --wds-color-yellow-50: #e7a047;
1660
+ --wds-color-yellow-100: #f9ad4d;
1661
+ --wds-color-yellow-200: #fabd71;
1662
+ --wds-color-yellow-300: #fcd29d;
1663
+ --wds-color-yellow-400: #fdead2;
1664
+ --wds-color-yellow-500: #fef3e5;
1665
+ --wds-color-yellow-600: #fef6ed;
1664
1666
  --wds-composer-sidebar-bottom-width: 88px;
1665
1667
  --wds-composer-sidebar-end-max-width: 240px;
1666
1668
  --wds-composer-sidebar-item-bottom-padding-horizontal-large: 4px;
@@ -1981,6 +1983,8 @@
1981
1983
  --wds-section-helper-fullwidth-vertical-padding-small: 6px;
1982
1984
  --wds-section-helper-horizontal-margin: 4px;
1983
1985
  --wds-section-helper-prefix-offset-margin: 4px;
1986
+ --wds-section-helper-text-font-line-height: 18px;
1987
+ --wds-section-helper-text-font-size: 14px;
1984
1988
  --wds-segmented-toggle-border-radius-medium: 4px;
1985
1989
  --wds-segmented-toggle-border-radius-small: 4px;
1986
1990
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 4px;
package/studio/component.st.css CHANGED
@@ -376,6 +376,8 @@
376
376
  @property st-global(--wds-section-helper-fullwidth-vertical-padding-small);
377
377
  @property st-global(--wds-section-helper-horizontal-margin);
378
378
  @property st-global(--wds-section-helper-prefix-offset-margin);
379
+ @property st-global(--wds-section-helper-text-font-line-height);
380
+ @property st-global(--wds-section-helper-text-font-size);
379
381
  @property st-global(--wds-segmented-toggle-border-radius-medium);
380
382
  @property st-global(--wds-segmented-toggle-border-radius-small);
381
383
  @property st-global(--wds-segmented-toggle-icononly-padding-horizontal-medium);
@@ -1031,6 +1033,8 @@
1031
1033
  --wds-section-helper-fullwidth-vertical-padding-small: 6px;
1032
1034
  --wds-section-helper-horizontal-margin: 4px;
1033
1035
  --wds-section-helper-prefix-offset-margin: 4px;
1036
+ --wds-section-helper-text-font-line-height: 18px;
1037
+ --wds-section-helper-text-font-size: 14px;
1034
1038
  --wds-segmented-toggle-border-radius-medium: 4px;
1035
1039
  --wds-segmented-toggle-border-radius-small: 4px;
1036
1040
  --wds-segmented-toggle-icononly-padding-horizontal-medium: 4px;
package/studio/foundation.st.css CHANGED
@@ -52,14 +52,6 @@
52
52
  @property st-global(--wds-color-green-400);
53
53
  @property st-global(--wds-color-green-500);
54
54
  @property st-global(--wds-color-green-600);
55
- @property st-global(--wds-color-yellow-0);
56
- @property st-global(--wds-color-yellow-50);
57
- @property st-global(--wds-color-yellow-100);
58
- @property st-global(--wds-color-yellow-200);
59
- @property st-global(--wds-color-yellow-300);
60
- @property st-global(--wds-color-yellow-400);
61
- @property st-global(--wds-color-yellow-500);
62
- @property st-global(--wds-color-yellow-600);
63
55
  @property st-global(--wds-color-iris-0);
64
56
  @property st-global(--wds-color-iris-50);
65
57
  @property st-global(--wds-color-iris-100);
@@ -105,6 +97,14 @@
105
97
  @property st-global(--wds-color-white-transparent-50);
106
98
  @property st-global(--wds-color-white-transparent-70);
107
99
  @property st-global(--wds-color-white-transparent-80);
100
+ @property st-global(--wds-color-yellow-0);
101
+ @property st-global(--wds-color-yellow-50);
102
+ @property st-global(--wds-color-yellow-100);
103
+ @property st-global(--wds-color-yellow-200);
104
+ @property st-global(--wds-color-yellow-300);
105
+ @property st-global(--wds-color-yellow-400);
106
+ @property st-global(--wds-color-yellow-500);
107
+ @property st-global(--wds-color-yellow-600);
108
108
  @property st-global(--wds-font-family-default);
109
109
  @property st-global(--wds-font-letter-spacing-0);
110
110
  @property st-global(--wds-font-letter-spacing-100);
@@ -225,14 +225,6 @@
225
225
  --wds-color-green-400: #c8e8d6;
226
226
  --wds-color-green-500: #e1f4eb;
227
227
  --wds-color-green-600: #e9f6ee;
228
- --wds-color-yellow-0: #d49341;
229
- --wds-color-yellow-50: #e7a047;
230
- --wds-color-yellow-100: #f9ad4d;
231
- --wds-color-yellow-200: #fabd71;
232
- --wds-color-yellow-300: #fcd29d;
233
- --wds-color-yellow-400: #fdead2;
234
- --wds-color-yellow-500: #fef3e5;
235
- --wds-color-yellow-600: #fef6ed;
236
228
  --wds-color-iris-0: #4d3dd0;
237
229
  --wds-color-iris-50: #5443e3;
238
230
  --wds-color-iris-100: #5a48f5;
@@ -278,6 +270,14 @@
278
270
  --wds-color-white-transparent-50: rgba(255, 255, 255, .5);
279
271
  --wds-color-white-transparent-70: rgba(255, 255, 255, .7);
280
272
  --wds-color-white-transparent-80: rgba(255, 255, 255, .8);
273
+ --wds-color-yellow-0: #d49341;
274
+ --wds-color-yellow-50: #e7a047;
275
+ --wds-color-yellow-100: #f9ad4d;
276
+ --wds-color-yellow-200: #fabd71;
277
+ --wds-color-yellow-300: #fcd29d;
278
+ --wds-color-yellow-400: #fdead2;
279
+ --wds-color-yellow-500: #fef3e5;
280
+ --wds-color-yellow-600: #fef6ed;
281
281
  --wds-font-family-default: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
282
282
  --wds-font-letter-spacing-0: 0;
283
283
  --wds-font-letter-spacing-100: 1px;
package/studio/semantic.st.css CHANGED
@@ -172,10 +172,6 @@
172
172
  @property st-global(--wds-color-fill-social-instagram-active);
173
173
  @property st-global(--wds-color-fill-social-instagram-disabled);
174
174
  @property st-global(--wds-color-fill-social-instagram-hover);
175
- @property st-global(--wds-color-fill-social-youtube);
176
- @property st-global(--wds-color-fill-social-youtube-active);
177
- @property st-global(--wds-color-fill-social-youtube-disabled);
178
- @property st-global(--wds-color-fill-social-youtube-hover);
179
175
  @property st-global(--wds-color-fill-social-linkedin);
180
176
  @property st-global(--wds-color-fill-social-linkedin-active);
181
177
  @property st-global(--wds-color-fill-social-linkedin-disabled);
@@ -192,6 +188,10 @@
192
188
  @property st-global(--wds-color-fill-social-xcorp-active);
193
189
  @property st-global(--wds-color-fill-social-xcorp-disabled);
194
190
  @property st-global(--wds-color-fill-social-xcorp-hover);
191
+ @property st-global(--wds-color-fill-social-youtube);
192
+ @property st-global(--wds-color-fill-social-youtube-active);
193
+ @property st-global(--wds-color-fill-social-youtube-disabled);
194
+ @property st-global(--wds-color-fill-social-youtube-hover);
195
195
  @property st-global(--wds-color-fill-standard-light-primary);
196
196
  @property st-global(--wds-color-fill-standard-light-primary-active);
197
197
  @property st-global(--wds-color-fill-standard-light-primary-disabled);
@@ -511,10 +511,6 @@
511
511
  --wds-color-fill-social-instagram-active: #ff0175;
512
512
  --wds-color-fill-social-instagram-disabled: #bebebe;
513
513
  --wds-color-fill-social-instagram-hover: rgba(255, 1, 117, .8);
514
- --wds-color-fill-social-youtube: #ff0000;
515
- --wds-color-fill-social-youtube-active: #ff0000;
516
- --wds-color-fill-social-youtube-disabled: #bebebe;
517
- --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
518
514
  --wds-color-fill-social-linkedin: #0065c8;
519
515
  --wds-color-fill-social-linkedin-active: #0065c8;
520
516
  --wds-color-fill-social-linkedin-disabled: #bebebe;
@@ -531,6 +527,10 @@
531
527
  --wds-color-fill-social-xcorp-active: #101419;
532
528
  --wds-color-fill-social-xcorp-disabled: #bebebe;
533
529
  --wds-color-fill-social-xcorp-hover: rgba(16, 20, 25, .8);
530
+ --wds-color-fill-social-youtube: #ff0000;
531
+ --wds-color-fill-social-youtube-active: #ff0000;
532
+ --wds-color-fill-social-youtube-disabled: #bebebe;
533
+ --wds-color-fill-social-youtube-hover: rgba(255, 0, 0, .8);
534
534
  --wds-color-fill-standard-light-primary: #7cafff;
535
535
  --wds-color-fill-standard-light-primary-active: #418aff;
536
536
  --wds-color-fill-standard-light-primary-disabled: rgba(255, 255, 255, .3);