@wix/design-system-tokens 1.12.2 → 1.13.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 (5) hide show
  1. package/all.st.css +20 -0
  2. package/component.st.css +20 -0
  3. package/package.json +2 -2
  4. package/studio/all.st.css +20 -0
  5. package/studio/component.st.css +20 -0
package/all.st.css CHANGED
@@ -656,7 +656,9 @@
656
656
  @property st-global(--wds-list-item-action-padding-horizontal-medium);
657
657
  @property st-global(--wds-list-item-action-padding-horizontal-small);
658
658
  @property st-global(--wds-list-item-action-padding-vertical-medium);
659
+ @property st-global(--wds-list-item-action-padding-vertical-medium-screen-small);
659
660
  @property st-global(--wds-list-item-action-padding-vertical-small);
661
+ @property st-global(--wds-list-item-action-padding-vertical-small-screen-small);
660
662
  @property st-global(--wds-list-item-gap-columns);
661
663
  @property st-global(--wds-list-item-indentation-level-2);
662
664
  @property st-global(--wds-list-item-indentation-level-3);
@@ -675,12 +677,18 @@
675
677
  @property st-global(--wds-list-item-section-padding-horizontal);
676
678
  @property st-global(--wds-list-item-select-active-fill);
677
679
  @property st-global(--wds-list-item-select-active-fill-active);
680
+ @property st-global(--wds-list-item-select-active-fill-active-screen-small);
678
681
  @property st-global(--wds-list-item-select-active-fill-disabled);
679
682
  @property st-global(--wds-list-item-select-active-fill-hover);
683
+ @property st-global(--wds-list-item-select-active-fill-screen-small);
680
684
  @property st-global(--wds-list-item-select-active-subtitle);
681
685
  @property st-global(--wds-list-item-select-active-subtitle-disabled);
686
+ @property st-global(--wds-list-item-select-active-subtitle-disabled-screen-small);
687
+ @property st-global(--wds-list-item-select-active-subtitle-screen-small);
682
688
  @property st-global(--wds-list-item-select-active-title);
683
689
  @property st-global(--wds-list-item-select-active-title-disabled);
690
+ @property st-global(--wds-list-item-select-active-title-disabled-screen-small);
691
+ @property st-global(--wds-list-item-select-active-title-screen-small);
684
692
  @property st-global(--wds-list-item-select-fill);
685
693
  @property st-global(--wds-list-item-select-fill-active);
686
694
  @property st-global(--wds-list-item-select-fill-disabled);
@@ -688,7 +696,9 @@
688
696
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
689
697
  @property st-global(--wds-list-item-select-padding-horizontal-small);
690
698
  @property st-global(--wds-list-item-select-padding-vertical-medium);
699
+ @property st-global(--wds-list-item-select-padding-vertical-medium-screen-small);
691
700
  @property st-global(--wds-list-item-select-padding-vertical-small);
701
+ @property st-global(--wds-list-item-select-padding-vertical-small-screen-small);
692
702
  @property st-global(--wds-list-item-select-subtitle);
693
703
  @property st-global(--wds-list-item-select-subtitle-disabled);
694
704
  @property st-global(--wds-list-item-select-title);
@@ -1671,7 +1681,9 @@
1671
1681
  --wds-list-item-action-padding-horizontal-medium: 18px;
1672
1682
  --wds-list-item-action-padding-horizontal-small: 18px;
1673
1683
  --wds-list-item-action-padding-vertical-medium: 6px;
1684
+ --wds-list-item-action-padding-vertical-medium-screen-small: 12px;
1674
1685
  --wds-list-item-action-padding-vertical-small: 6px;
1686
+ --wds-list-item-action-padding-vertical-small-screen-small: 12px;
1675
1687
  --wds-list-item-gap-columns: 24px;
1676
1688
  --wds-list-item-indentation-level-2: 12px;
1677
1689
  --wds-list-item-indentation-level-3: 30px;
@@ -1690,12 +1702,18 @@
1690
1702
  --wds-list-item-section-padding-horizontal: 24px;
1691
1703
  --wds-list-item-select-active-fill: #116dff;
1692
1704
  --wds-list-item-select-active-fill-active: #084ebd;
1705
+ --wds-list-item-select-active-fill-active-screen-small: #d6e6fe;
1693
1706
  --wds-list-item-select-active-fill-disabled: rgba(0, 6, 36, .3);
1694
1707
  --wds-list-item-select-active-fill-hover: #0f62e6;
1708
+ --wds-list-item-select-active-fill-screen-small: #ffffff;
1695
1709
  --wds-list-item-select-active-subtitle: #ffffff;
1696
1710
  --wds-list-item-select-active-subtitle-disabled: rgba(255, 255, 255, .7);
1711
+ --wds-list-item-select-active-subtitle-disabled-screen-small: rgba(0, 6, 36, .3);
1712
+ --wds-list-item-select-active-subtitle-screen-small: #116dff;
1697
1713
  --wds-list-item-select-active-title: #ffffff;
1698
1714
  --wds-list-item-select-active-title-disabled: rgba(255, 255, 255, .7);
1715
+ --wds-list-item-select-active-title-disabled-screen-small: rgba(0, 6, 36, .3);
1716
+ --wds-list-item-select-active-title-screen-small: #116dff;
1699
1717
  --wds-list-item-select-fill: #ffffff;
1700
1718
  --wds-list-item-select-fill-active: #d6e6fe;
1701
1719
  --wds-list-item-select-fill-disabled: #ffffff;
@@ -1703,7 +1721,9 @@
1703
1721
  --wds-list-item-select-padding-horizontal-medium: 18px;
1704
1722
  --wds-list-item-select-padding-horizontal-small: 18px;
1705
1723
  --wds-list-item-select-padding-vertical-medium: 6px;
1724
+ --wds-list-item-select-padding-vertical-medium-screen-small: 12px;
1706
1725
  --wds-list-item-select-padding-vertical-small: 6px;
1726
+ --wds-list-item-select-padding-vertical-small-screen-small: 12px;
1707
1727
  --wds-list-item-select-subtitle: #868aa5;
1708
1728
  --wds-list-item-select-subtitle-disabled: rgba(0, 6, 36, .3);
1709
1729
  --wds-list-item-select-title: #000624;
package/component.st.css CHANGED
@@ -219,7 +219,9 @@
219
219
  @property st-global(--wds-list-item-action-padding-horizontal-medium);
220
220
  @property st-global(--wds-list-item-action-padding-horizontal-small);
221
221
  @property st-global(--wds-list-item-action-padding-vertical-medium);
222
+ @property st-global(--wds-list-item-action-padding-vertical-medium-screen-small);
222
223
  @property st-global(--wds-list-item-action-padding-vertical-small);
224
+ @property st-global(--wds-list-item-action-padding-vertical-small-screen-small);
223
225
  @property st-global(--wds-list-item-gap-columns);
224
226
  @property st-global(--wds-list-item-indentation-level-2);
225
227
  @property st-global(--wds-list-item-indentation-level-3);
@@ -238,12 +240,18 @@
238
240
  @property st-global(--wds-list-item-section-padding-horizontal);
239
241
  @property st-global(--wds-list-item-select-active-fill);
240
242
  @property st-global(--wds-list-item-select-active-fill-active);
243
+ @property st-global(--wds-list-item-select-active-fill-active-screen-small);
241
244
  @property st-global(--wds-list-item-select-active-fill-disabled);
242
245
  @property st-global(--wds-list-item-select-active-fill-hover);
246
+ @property st-global(--wds-list-item-select-active-fill-screen-small);
243
247
  @property st-global(--wds-list-item-select-active-subtitle);
244
248
  @property st-global(--wds-list-item-select-active-subtitle-disabled);
249
+ @property st-global(--wds-list-item-select-active-subtitle-disabled-screen-small);
250
+ @property st-global(--wds-list-item-select-active-subtitle-screen-small);
245
251
  @property st-global(--wds-list-item-select-active-title);
246
252
  @property st-global(--wds-list-item-select-active-title-disabled);
253
+ @property st-global(--wds-list-item-select-active-title-disabled-screen-small);
254
+ @property st-global(--wds-list-item-select-active-title-screen-small);
247
255
  @property st-global(--wds-list-item-select-fill);
248
256
  @property st-global(--wds-list-item-select-fill-active);
249
257
  @property st-global(--wds-list-item-select-fill-disabled);
@@ -251,7 +259,9 @@
251
259
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
252
260
  @property st-global(--wds-list-item-select-padding-horizontal-small);
253
261
  @property st-global(--wds-list-item-select-padding-vertical-medium);
262
+ @property st-global(--wds-list-item-select-padding-vertical-medium-screen-small);
254
263
  @property st-global(--wds-list-item-select-padding-vertical-small);
264
+ @property st-global(--wds-list-item-select-padding-vertical-small-screen-small);
255
265
  @property st-global(--wds-list-item-select-subtitle);
256
266
  @property st-global(--wds-list-item-select-subtitle-disabled);
257
267
  @property st-global(--wds-list-item-select-title);
@@ -746,7 +756,9 @@
746
756
  --wds-list-item-action-padding-horizontal-medium: 18px;
747
757
  --wds-list-item-action-padding-horizontal-small: 18px;
748
758
  --wds-list-item-action-padding-vertical-medium: 6px;
759
+ --wds-list-item-action-padding-vertical-medium-screen-small: 12px;
749
760
  --wds-list-item-action-padding-vertical-small: 6px;
761
+ --wds-list-item-action-padding-vertical-small-screen-small: 12px;
750
762
  --wds-list-item-gap-columns: 24px;
751
763
  --wds-list-item-indentation-level-2: 12px;
752
764
  --wds-list-item-indentation-level-3: 30px;
@@ -765,12 +777,18 @@
765
777
  --wds-list-item-section-padding-horizontal: 24px;
766
778
  --wds-list-item-select-active-fill: #116dff;
767
779
  --wds-list-item-select-active-fill-active: #084ebd;
780
+ --wds-list-item-select-active-fill-active-screen-small: #d6e6fe;
768
781
  --wds-list-item-select-active-fill-disabled: rgba(0, 6, 36, .3);
769
782
  --wds-list-item-select-active-fill-hover: #0f62e6;
783
+ --wds-list-item-select-active-fill-screen-small: #ffffff;
770
784
  --wds-list-item-select-active-subtitle: #ffffff;
771
785
  --wds-list-item-select-active-subtitle-disabled: rgba(255, 255, 255, .7);
786
+ --wds-list-item-select-active-subtitle-disabled-screen-small: rgba(0, 6, 36, .3);
787
+ --wds-list-item-select-active-subtitle-screen-small: #116dff;
772
788
  --wds-list-item-select-active-title: #ffffff;
773
789
  --wds-list-item-select-active-title-disabled: rgba(255, 255, 255, .7);
790
+ --wds-list-item-select-active-title-disabled-screen-small: rgba(0, 6, 36, .3);
791
+ --wds-list-item-select-active-title-screen-small: #116dff;
774
792
  --wds-list-item-select-fill: #ffffff;
775
793
  --wds-list-item-select-fill-active: #d6e6fe;
776
794
  --wds-list-item-select-fill-disabled: #ffffff;
@@ -778,7 +796,9 @@
778
796
  --wds-list-item-select-padding-horizontal-medium: 18px;
779
797
  --wds-list-item-select-padding-horizontal-small: 18px;
780
798
  --wds-list-item-select-padding-vertical-medium: 6px;
799
+ --wds-list-item-select-padding-vertical-medium-screen-small: 12px;
781
800
  --wds-list-item-select-padding-vertical-small: 6px;
801
+ --wds-list-item-select-padding-vertical-small-screen-small: 12px;
782
802
  --wds-list-item-select-subtitle: #868aa5;
783
803
  --wds-list-item-select-subtitle-disabled: rgba(0, 6, 36, .3);
784
804
  --wds-list-item-select-title: #000624;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.12.2",
3
+ "version": "1.13.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": "a51434ed31f5fe1b8a105494a6e4cce16740c57fe5cfc257ddc02265"
36
+ "falconPackageHash": "4bf0f68a66323bacbe41ca475ce14baf552678bf661ba7e1c4cdebc2"
37
37
  }
package/studio/all.st.css CHANGED
@@ -652,7 +652,9 @@
652
652
  @property st-global(--wds-list-item-action-padding-horizontal-medium);
653
653
  @property st-global(--wds-list-item-action-padding-horizontal-small);
654
654
  @property st-global(--wds-list-item-action-padding-vertical-medium);
655
+ @property st-global(--wds-list-item-action-padding-vertical-medium-screen-small);
655
656
  @property st-global(--wds-list-item-action-padding-vertical-small);
657
+ @property st-global(--wds-list-item-action-padding-vertical-small-screen-small);
656
658
  @property st-global(--wds-list-item-gap-columns);
657
659
  @property st-global(--wds-list-item-indentation-level-2);
658
660
  @property st-global(--wds-list-item-indentation-level-3);
@@ -671,12 +673,18 @@
671
673
  @property st-global(--wds-list-item-section-padding-horizontal);
672
674
  @property st-global(--wds-list-item-select-active-fill);
673
675
  @property st-global(--wds-list-item-select-active-fill-active);
676
+ @property st-global(--wds-list-item-select-active-fill-active-screen-small);
674
677
  @property st-global(--wds-list-item-select-active-fill-disabled);
675
678
  @property st-global(--wds-list-item-select-active-fill-hover);
679
+ @property st-global(--wds-list-item-select-active-fill-screen-small);
676
680
  @property st-global(--wds-list-item-select-active-subtitle);
677
681
  @property st-global(--wds-list-item-select-active-subtitle-disabled);
682
+ @property st-global(--wds-list-item-select-active-subtitle-disabled-screen-small);
683
+ @property st-global(--wds-list-item-select-active-subtitle-screen-small);
678
684
  @property st-global(--wds-list-item-select-active-title);
679
685
  @property st-global(--wds-list-item-select-active-title-disabled);
686
+ @property st-global(--wds-list-item-select-active-title-disabled-screen-small);
687
+ @property st-global(--wds-list-item-select-active-title-screen-small);
680
688
  @property st-global(--wds-list-item-select-fill);
681
689
  @property st-global(--wds-list-item-select-fill-active);
682
690
  @property st-global(--wds-list-item-select-fill-disabled);
@@ -684,7 +692,9 @@
684
692
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
685
693
  @property st-global(--wds-list-item-select-padding-horizontal-small);
686
694
  @property st-global(--wds-list-item-select-padding-vertical-medium);
695
+ @property st-global(--wds-list-item-select-padding-vertical-medium-screen-small);
687
696
  @property st-global(--wds-list-item-select-padding-vertical-small);
697
+ @property st-global(--wds-list-item-select-padding-vertical-small-screen-small);
688
698
  @property st-global(--wds-list-item-select-subtitle);
689
699
  @property st-global(--wds-list-item-select-subtitle-disabled);
690
700
  @property st-global(--wds-list-item-select-title);
@@ -1640,7 +1650,9 @@
1640
1650
  --wds-list-item-action-padding-horizontal-medium: 12px;
1641
1651
  --wds-list-item-action-padding-horizontal-small: 12px;
1642
1652
  --wds-list-item-action-padding-vertical-medium: 4px;
1653
+ --wds-list-item-action-padding-vertical-medium-screen-small: 8px;
1643
1654
  --wds-list-item-action-padding-vertical-small: 4px;
1655
+ --wds-list-item-action-padding-vertical-small-screen-small: 8px;
1644
1656
  --wds-list-item-gap-columns: 24px;
1645
1657
  --wds-list-item-indentation-level-2: 12px;
1646
1658
  --wds-list-item-indentation-level-3: 28px;
@@ -1659,12 +1671,18 @@
1659
1671
  --wds-list-item-section-padding-horizontal: 16px;
1660
1672
  --wds-list-item-select-active-fill: #dce9ff;
1661
1673
  --wds-list-item-select-active-fill-active: #dce9ff;
1674
+ --wds-list-item-select-active-fill-active-screen-small: #dce9ff;
1662
1675
  --wds-list-item-select-active-fill-disabled: #e5e5e5;
1663
1676
  --wds-list-item-select-active-fill-hover: #c3daff;
1677
+ --wds-list-item-select-active-fill-screen-small: #dce9ff;
1664
1678
  --wds-list-item-select-active-subtitle: #116dff;
1665
1679
  --wds-list-item-select-active-subtitle-disabled: #bebebe;
1680
+ --wds-list-item-select-active-subtitle-disabled-screen-small: #bebebe;
1681
+ --wds-list-item-select-active-subtitle-screen-small: #116dff;
1666
1682
  --wds-list-item-select-active-title: #116dff;
1667
1683
  --wds-list-item-select-active-title-disabled: #bebebe;
1684
+ --wds-list-item-select-active-title-disabled-screen-small: #bebebe;
1685
+ --wds-list-item-select-active-title-screen-small: #116dff;
1668
1686
  --wds-list-item-select-fill: #ffffff;
1669
1687
  --wds-list-item-select-fill-active: #dce9ff;
1670
1688
  --wds-list-item-select-fill-disabled: #ffffff;
@@ -1672,7 +1690,9 @@
1672
1690
  --wds-list-item-select-padding-horizontal-medium: 8px;
1673
1691
  --wds-list-item-select-padding-horizontal-small: 8px;
1674
1692
  --wds-list-item-select-padding-vertical-medium: 4px;
1693
+ --wds-list-item-select-padding-vertical-medium-screen-small: 8px;
1675
1694
  --wds-list-item-select-padding-vertical-small: 4px;
1695
+ --wds-list-item-select-padding-vertical-small-screen-small: 8px;
1676
1696
  --wds-list-item-select-subtitle: #868aa5;
1677
1697
  --wds-list-item-select-subtitle-disabled: #bebebe;
1678
1698
  --wds-list-item-select-title: #131720;
package/studio/component.st.css CHANGED
@@ -219,7 +219,9 @@
219
219
  @property st-global(--wds-list-item-action-padding-horizontal-medium);
220
220
  @property st-global(--wds-list-item-action-padding-horizontal-small);
221
221
  @property st-global(--wds-list-item-action-padding-vertical-medium);
222
+ @property st-global(--wds-list-item-action-padding-vertical-medium-screen-small);
222
223
  @property st-global(--wds-list-item-action-padding-vertical-small);
224
+ @property st-global(--wds-list-item-action-padding-vertical-small-screen-small);
223
225
  @property st-global(--wds-list-item-gap-columns);
224
226
  @property st-global(--wds-list-item-indentation-level-2);
225
227
  @property st-global(--wds-list-item-indentation-level-3);
@@ -238,12 +240,18 @@
238
240
  @property st-global(--wds-list-item-section-padding-horizontal);
239
241
  @property st-global(--wds-list-item-select-active-fill);
240
242
  @property st-global(--wds-list-item-select-active-fill-active);
243
+ @property st-global(--wds-list-item-select-active-fill-active-screen-small);
241
244
  @property st-global(--wds-list-item-select-active-fill-disabled);
242
245
  @property st-global(--wds-list-item-select-active-fill-hover);
246
+ @property st-global(--wds-list-item-select-active-fill-screen-small);
243
247
  @property st-global(--wds-list-item-select-active-subtitle);
244
248
  @property st-global(--wds-list-item-select-active-subtitle-disabled);
249
+ @property st-global(--wds-list-item-select-active-subtitle-disabled-screen-small);
250
+ @property st-global(--wds-list-item-select-active-subtitle-screen-small);
245
251
  @property st-global(--wds-list-item-select-active-title);
246
252
  @property st-global(--wds-list-item-select-active-title-disabled);
253
+ @property st-global(--wds-list-item-select-active-title-disabled-screen-small);
254
+ @property st-global(--wds-list-item-select-active-title-screen-small);
247
255
  @property st-global(--wds-list-item-select-fill);
248
256
  @property st-global(--wds-list-item-select-fill-active);
249
257
  @property st-global(--wds-list-item-select-fill-disabled);
@@ -251,7 +259,9 @@
251
259
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
252
260
  @property st-global(--wds-list-item-select-padding-horizontal-small);
253
261
  @property st-global(--wds-list-item-select-padding-vertical-medium);
262
+ @property st-global(--wds-list-item-select-padding-vertical-medium-screen-small);
254
263
  @property st-global(--wds-list-item-select-padding-vertical-small);
264
+ @property st-global(--wds-list-item-select-padding-vertical-small-screen-small);
255
265
  @property st-global(--wds-list-item-select-subtitle);
256
266
  @property st-global(--wds-list-item-select-subtitle-disabled);
257
267
  @property st-global(--wds-list-item-select-title);
@@ -746,7 +756,9 @@
746
756
  --wds-list-item-action-padding-horizontal-medium: 12px;
747
757
  --wds-list-item-action-padding-horizontal-small: 12px;
748
758
  --wds-list-item-action-padding-vertical-medium: 4px;
759
+ --wds-list-item-action-padding-vertical-medium-screen-small: 8px;
749
760
  --wds-list-item-action-padding-vertical-small: 4px;
761
+ --wds-list-item-action-padding-vertical-small-screen-small: 8px;
750
762
  --wds-list-item-gap-columns: 24px;
751
763
  --wds-list-item-indentation-level-2: 12px;
752
764
  --wds-list-item-indentation-level-3: 28px;
@@ -765,12 +777,18 @@
765
777
  --wds-list-item-section-padding-horizontal: 16px;
766
778
  --wds-list-item-select-active-fill: #dce9ff;
767
779
  --wds-list-item-select-active-fill-active: #dce9ff;
780
+ --wds-list-item-select-active-fill-active-screen-small: #dce9ff;
768
781
  --wds-list-item-select-active-fill-disabled: #e5e5e5;
769
782
  --wds-list-item-select-active-fill-hover: #c3daff;
783
+ --wds-list-item-select-active-fill-screen-small: #dce9ff;
770
784
  --wds-list-item-select-active-subtitle: #116dff;
771
785
  --wds-list-item-select-active-subtitle-disabled: #bebebe;
786
+ --wds-list-item-select-active-subtitle-disabled-screen-small: #bebebe;
787
+ --wds-list-item-select-active-subtitle-screen-small: #116dff;
772
788
  --wds-list-item-select-active-title: #116dff;
773
789
  --wds-list-item-select-active-title-disabled: #bebebe;
790
+ --wds-list-item-select-active-title-disabled-screen-small: #bebebe;
791
+ --wds-list-item-select-active-title-screen-small: #116dff;
774
792
  --wds-list-item-select-fill: #ffffff;
775
793
  --wds-list-item-select-fill-active: #dce9ff;
776
794
  --wds-list-item-select-fill-disabled: #ffffff;
@@ -778,7 +796,9 @@
778
796
  --wds-list-item-select-padding-horizontal-medium: 8px;
779
797
  --wds-list-item-select-padding-horizontal-small: 8px;
780
798
  --wds-list-item-select-padding-vertical-medium: 4px;
799
+ --wds-list-item-select-padding-vertical-medium-screen-small: 8px;
781
800
  --wds-list-item-select-padding-vertical-small: 4px;
801
+ --wds-list-item-select-padding-vertical-small-screen-small: 8px;
782
802
  --wds-list-item-select-subtitle: #868aa5;
783
803
  --wds-list-item-select-subtitle-disabled: #bebebe;
784
804
  --wds-list-item-select-title: #131720;