@wix/design-system-tokens 1.16.3 → 1.16.4

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 +120 -0
  2. package/component.st.css +120 -0
  3. package/package.json +2 -2
  4. package/studio/all.st.css +118 -0
  5. package/studio/component.st.css +118 -0
package/all.st.css CHANGED
@@ -852,6 +852,66 @@
852
852
  @property st-global(--wds-side-panel-header-padding-left);
853
853
  @property st-global(--wds-side-panel-header-padding-right);
854
854
  @property st-global(--wds-side-panel-header-padding-vertical);
855
+ @property st-global(--wds-sidebar-divider-fill-dark-default);
856
+ @property st-global(--wds-sidebar-divider-fill-light-default);
857
+ @property st-global(--wds-sidebar-divider-fill-neutral-default);
858
+ @property st-global(--wds-sidebar-header-margin-bottom);
859
+ @property st-global(--wds-sidebar-item-content-gap);
860
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-active);
861
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-default);
862
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-hover);
863
+ @property st-global(--wds-sidebar-item-level-1-fill-light-active);
864
+ @property st-global(--wds-sidebar-item-level-1-fill-light-default);
865
+ @property st-global(--wds-sidebar-item-level-1-fill-light-hover);
866
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-active);
867
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-default);
868
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-hover);
869
+ @property st-global(--wds-sidebar-item-level-1-padding-bottom);
870
+ @property st-global(--wds-sidebar-item-level-1-padding-end);
871
+ @property st-global(--wds-sidebar-item-level-1-padding-start);
872
+ @property st-global(--wds-sidebar-item-level-1-padding-top);
873
+ @property st-global(--wds-sidebar-item-level-2-fill-dark-default);
874
+ @property st-global(--wds-sidebar-item-level-2-fill-light-default);
875
+ @property st-global(--wds-sidebar-item-level-2-fill-neutral-default);
876
+ @property st-global(--wds-sidebar-item-level-2-padding-bottom);
877
+ @property st-global(--wds-sidebar-item-level-2-padding-end);
878
+ @property st-global(--wds-sidebar-item-level-2-padding-start);
879
+ @property st-global(--wds-sidebar-item-level-2-padding-top);
880
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-bottom);
881
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-end);
882
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-top);
883
+ @property st-global(--wds-sidebar-item-level-3-padding-bottom);
884
+ @property st-global(--wds-sidebar-item-level-3-padding-end);
885
+ @property st-global(--wds-sidebar-item-level-3-padding-start);
886
+ @property st-global(--wds-sidebar-item-level-3-padding-top);
887
+ @property st-global(--wds-sidebar-item-minimized-paddings-horizontal);
888
+ @property st-global(--wds-sidebar-item-minimized-paddings-vertical);
889
+ @property st-global(--wds-sidebar-item-prefix-padding-end);
890
+ @property st-global(--wds-sidebar-item-text-dark-active);
891
+ @property st-global(--wds-sidebar-item-text-dark-default);
892
+ @property st-global(--wds-sidebar-item-text-dark-disabled);
893
+ @property st-global(--wds-sidebar-item-text-light-active);
894
+ @property st-global(--wds-sidebar-item-text-light-default);
895
+ @property st-global(--wds-sidebar-item-text-light-disabled);
896
+ @property st-global(--wds-sidebar-item-text-neutral-active);
897
+ @property st-global(--wds-sidebar-item-text-neutral-default);
898
+ @property st-global(--wds-sidebar-item-text-neutral-disabled);
899
+ @property st-global(--wds-sidebar-item-title);
900
+ @property st-global(--wds-sidebar-minimize-action-fill-dark-default);
901
+ @property st-global(--wds-sidebar-minimize-action-fill-light-default);
902
+ @property st-global(--wds-sidebar-minimize-action-fill-neutral-default);
903
+ @property st-global(--wds-sidebar-minimize-action-text-dark-default);
904
+ @property st-global(--wds-sidebar-minimize-action-text-light-default);
905
+ @property st-global(--wds-sidebar-minimize-action-text-neutral-default);
906
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-dark-default);
907
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-light-default);
908
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-neutral-default);
909
+ @property st-global(--wds-sidebar-minimize-tooltip-text-dark-default);
910
+ @property st-global(--wds-sidebar-minimize-tooltip-text-light-default);
911
+ @property st-global(--wds-sidebar-minimize-tooltip-text-neutral-default);
912
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-active);
913
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-default);
914
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-hover);
855
915
  @property st-global(--wds-skeleton-border-radius-circle);
856
916
  @property st-global(--wds-skeleton-border-radius-line);
857
917
  @property st-global(--wds-skeleton-border-radius-rectangle);
@@ -1911,6 +1971,66 @@
1911
1971
  --wds-side-panel-header-padding-left: 24px;
1912
1972
  --wds-side-panel-header-padding-right: 9px;
1913
1973
  --wds-side-panel-header-padding-vertical: 18px;
1974
+ --wds-sidebar-divider-fill-dark-default: #42454C;
1975
+ --wds-sidebar-divider-fill-light-default: #cfd1dc;
1976
+ --wds-sidebar-divider-fill-neutral-default: #cfd1dc;
1977
+ --wds-sidebar-header-margin-bottom: 12px;
1978
+ --wds-sidebar-item-content-gap: 6px;
1979
+ --wds-sidebar-item-level-1-fill-dark-active: #42454C;
1980
+ --wds-sidebar-item-level-1-fill-dark-default: #131720;
1981
+ --wds-sidebar-item-level-1-fill-dark-hover: #2B2E36;
1982
+ --wds-sidebar-item-level-1-fill-light-active: #a8caff;
1983
+ --wds-sidebar-item-level-1-fill-light-default: #ffffff;
1984
+ --wds-sidebar-item-level-1-fill-light-hover: #d6e6fe;
1985
+ --wds-sidebar-item-level-1-fill-neutral-active: #a8caff;
1986
+ --wds-sidebar-item-level-1-fill-neutral-default: #eceff3;
1987
+ --wds-sidebar-item-level-1-fill-neutral-hover: #d6e6fe;
1988
+ --wds-sidebar-item-level-1-padding-bottom: 9px;
1989
+ --wds-sidebar-item-level-1-padding-end: 18px;
1990
+ --wds-sidebar-item-level-1-padding-start: 24px;
1991
+ --wds-sidebar-item-level-1-padding-top: 9px;
1992
+ --wds-sidebar-item-level-2-fill-dark-default: #1F222B;
1993
+ --wds-sidebar-item-level-2-fill-light-default: #EAF7FF;
1994
+ --wds-sidebar-item-level-2-fill-neutral-default: #eceff3;
1995
+ --wds-sidebar-item-level-2-padding-bottom: 6px;
1996
+ --wds-sidebar-item-level-2-padding-end: 18px;
1997
+ --wds-sidebar-item-level-2-padding-start: 54px;
1998
+ --wds-sidebar-item-level-2-padding-top: 6px;
1999
+ --wds-sidebar-item-level-3-divider-padding-bottom: 9px;
2000
+ --wds-sidebar-item-level-3-divider-padding-end: 12px;
2001
+ --wds-sidebar-item-level-3-divider-padding-top: 9px;
2002
+ --wds-sidebar-item-level-3-padding-bottom: 6px;
2003
+ --wds-sidebar-item-level-3-padding-end: 18px;
2004
+ --wds-sidebar-item-level-3-padding-start: 54px;
2005
+ --wds-sidebar-item-level-3-padding-top: 6px;
2006
+ --wds-sidebar-item-minimized-paddings-horizontal: 18px;
2007
+ --wds-sidebar-item-minimized-paddings-vertical: 9px;
2008
+ --wds-sidebar-item-prefix-padding-end: 12px;
2009
+ --wds-sidebar-item-text-dark-active: #ffffff;
2010
+ --wds-sidebar-item-text-dark-default: #cfd1dc;
2011
+ --wds-sidebar-item-text-dark-disabled: #898B8F;
2012
+ --wds-sidebar-item-text-light-active: #084ebd;
2013
+ --wds-sidebar-item-text-light-default: #44485f;
2014
+ --wds-sidebar-item-text-light-disabled: rgba(0, 6, 36, .3);
2015
+ --wds-sidebar-item-text-neutral-active: #084ebd;
2016
+ --wds-sidebar-item-text-neutral-default: #44485f;
2017
+ --wds-sidebar-item-text-neutral-disabled: rgba(0, 6, 36, .3);
2018
+ --wds-sidebar-item-title: #868aa5;
2019
+ --wds-sidebar-minimize-action-fill-dark-default: #42454C;
2020
+ --wds-sidebar-minimize-action-fill-light-default: #d6e6fe;
2021
+ --wds-sidebar-minimize-action-fill-neutral-default: #d6e6fe;
2022
+ --wds-sidebar-minimize-action-text-dark-default: #cfd1dc;
2023
+ --wds-sidebar-minimize-action-text-light-default: #116dff;
2024
+ --wds-sidebar-minimize-action-text-neutral-default: #116dff;
2025
+ --wds-sidebar-minimize-tooltip-fill-dark-default: #333850;
2026
+ --wds-sidebar-minimize-tooltip-fill-light-default: #ffffff;
2027
+ --wds-sidebar-minimize-tooltip-fill-neutral-default: #ffffff;
2028
+ --wds-sidebar-minimize-tooltip-text-dark-default: #ffffff;
2029
+ --wds-sidebar-minimize-tooltip-text-light-default: #44485f;
2030
+ --wds-sidebar-minimize-tooltip-text-neutral-default: #44485f;
2031
+ --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
2032
+ --wds-sidebar-scrollbar-fill-dark-default: #717379;
2033
+ --wds-sidebar-scrollbar-fill-dark-hover: #8D8F96;
1914
2034
  --wds-skeleton-border-radius-circle: 1000px;
1915
2035
  --wds-skeleton-border-radius-line: 1000px;
1916
2036
  --wds-skeleton-border-radius-rectangle: 6px;
package/component.st.css CHANGED
@@ -385,6 +385,66 @@
385
385
  @property st-global(--wds-side-panel-header-padding-left);
386
386
  @property st-global(--wds-side-panel-header-padding-right);
387
387
  @property st-global(--wds-side-panel-header-padding-vertical);
388
+ @property st-global(--wds-sidebar-divider-fill-dark-default);
389
+ @property st-global(--wds-sidebar-divider-fill-light-default);
390
+ @property st-global(--wds-sidebar-divider-fill-neutral-default);
391
+ @property st-global(--wds-sidebar-header-margin-bottom);
392
+ @property st-global(--wds-sidebar-item-content-gap);
393
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-active);
394
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-default);
395
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-hover);
396
+ @property st-global(--wds-sidebar-item-level-1-fill-light-active);
397
+ @property st-global(--wds-sidebar-item-level-1-fill-light-default);
398
+ @property st-global(--wds-sidebar-item-level-1-fill-light-hover);
399
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-active);
400
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-default);
401
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-hover);
402
+ @property st-global(--wds-sidebar-item-level-1-padding-bottom);
403
+ @property st-global(--wds-sidebar-item-level-1-padding-end);
404
+ @property st-global(--wds-sidebar-item-level-1-padding-start);
405
+ @property st-global(--wds-sidebar-item-level-1-padding-top);
406
+ @property st-global(--wds-sidebar-item-level-2-fill-dark-default);
407
+ @property st-global(--wds-sidebar-item-level-2-fill-light-default);
408
+ @property st-global(--wds-sidebar-item-level-2-fill-neutral-default);
409
+ @property st-global(--wds-sidebar-item-level-2-padding-bottom);
410
+ @property st-global(--wds-sidebar-item-level-2-padding-end);
411
+ @property st-global(--wds-sidebar-item-level-2-padding-start);
412
+ @property st-global(--wds-sidebar-item-level-2-padding-top);
413
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-bottom);
414
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-end);
415
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-top);
416
+ @property st-global(--wds-sidebar-item-level-3-padding-bottom);
417
+ @property st-global(--wds-sidebar-item-level-3-padding-end);
418
+ @property st-global(--wds-sidebar-item-level-3-padding-start);
419
+ @property st-global(--wds-sidebar-item-level-3-padding-top);
420
+ @property st-global(--wds-sidebar-item-minimized-paddings-horizontal);
421
+ @property st-global(--wds-sidebar-item-minimized-paddings-vertical);
422
+ @property st-global(--wds-sidebar-item-prefix-padding-end);
423
+ @property st-global(--wds-sidebar-item-text-dark-active);
424
+ @property st-global(--wds-sidebar-item-text-dark-default);
425
+ @property st-global(--wds-sidebar-item-text-dark-disabled);
426
+ @property st-global(--wds-sidebar-item-text-light-active);
427
+ @property st-global(--wds-sidebar-item-text-light-default);
428
+ @property st-global(--wds-sidebar-item-text-light-disabled);
429
+ @property st-global(--wds-sidebar-item-text-neutral-active);
430
+ @property st-global(--wds-sidebar-item-text-neutral-default);
431
+ @property st-global(--wds-sidebar-item-text-neutral-disabled);
432
+ @property st-global(--wds-sidebar-item-title);
433
+ @property st-global(--wds-sidebar-minimize-action-fill-dark-default);
434
+ @property st-global(--wds-sidebar-minimize-action-fill-light-default);
435
+ @property st-global(--wds-sidebar-minimize-action-fill-neutral-default);
436
+ @property st-global(--wds-sidebar-minimize-action-text-dark-default);
437
+ @property st-global(--wds-sidebar-minimize-action-text-light-default);
438
+ @property st-global(--wds-sidebar-minimize-action-text-neutral-default);
439
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-dark-default);
440
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-light-default);
441
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-neutral-default);
442
+ @property st-global(--wds-sidebar-minimize-tooltip-text-dark-default);
443
+ @property st-global(--wds-sidebar-minimize-tooltip-text-light-default);
444
+ @property st-global(--wds-sidebar-minimize-tooltip-text-neutral-default);
445
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-active);
446
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-default);
447
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-hover);
388
448
  @property st-global(--wds-skeleton-border-radius-circle);
389
449
  @property st-global(--wds-skeleton-border-radius-line);
390
450
  @property st-global(--wds-skeleton-border-radius-rectangle);
@@ -941,6 +1001,66 @@
941
1001
  --wds-side-panel-header-padding-left: 24px;
942
1002
  --wds-side-panel-header-padding-right: 9px;
943
1003
  --wds-side-panel-header-padding-vertical: 18px;
1004
+ --wds-sidebar-divider-fill-dark-default: #42454C;
1005
+ --wds-sidebar-divider-fill-light-default: #cfd1dc;
1006
+ --wds-sidebar-divider-fill-neutral-default: #cfd1dc;
1007
+ --wds-sidebar-header-margin-bottom: 12px;
1008
+ --wds-sidebar-item-content-gap: 6px;
1009
+ --wds-sidebar-item-level-1-fill-dark-active: #42454C;
1010
+ --wds-sidebar-item-level-1-fill-dark-default: #131720;
1011
+ --wds-sidebar-item-level-1-fill-dark-hover: #2B2E36;
1012
+ --wds-sidebar-item-level-1-fill-light-active: #a8caff;
1013
+ --wds-sidebar-item-level-1-fill-light-default: #ffffff;
1014
+ --wds-sidebar-item-level-1-fill-light-hover: #d6e6fe;
1015
+ --wds-sidebar-item-level-1-fill-neutral-active: #a8caff;
1016
+ --wds-sidebar-item-level-1-fill-neutral-default: #eceff3;
1017
+ --wds-sidebar-item-level-1-fill-neutral-hover: #d6e6fe;
1018
+ --wds-sidebar-item-level-1-padding-bottom: 9px;
1019
+ --wds-sidebar-item-level-1-padding-end: 18px;
1020
+ --wds-sidebar-item-level-1-padding-start: 24px;
1021
+ --wds-sidebar-item-level-1-padding-top: 9px;
1022
+ --wds-sidebar-item-level-2-fill-dark-default: #1F222B;
1023
+ --wds-sidebar-item-level-2-fill-light-default: #EAF7FF;
1024
+ --wds-sidebar-item-level-2-fill-neutral-default: #eceff3;
1025
+ --wds-sidebar-item-level-2-padding-bottom: 6px;
1026
+ --wds-sidebar-item-level-2-padding-end: 18px;
1027
+ --wds-sidebar-item-level-2-padding-start: 54px;
1028
+ --wds-sidebar-item-level-2-padding-top: 6px;
1029
+ --wds-sidebar-item-level-3-divider-padding-bottom: 9px;
1030
+ --wds-sidebar-item-level-3-divider-padding-end: 12px;
1031
+ --wds-sidebar-item-level-3-divider-padding-top: 9px;
1032
+ --wds-sidebar-item-level-3-padding-bottom: 6px;
1033
+ --wds-sidebar-item-level-3-padding-end: 18px;
1034
+ --wds-sidebar-item-level-3-padding-start: 54px;
1035
+ --wds-sidebar-item-level-3-padding-top: 6px;
1036
+ --wds-sidebar-item-minimized-paddings-horizontal: 18px;
1037
+ --wds-sidebar-item-minimized-paddings-vertical: 9px;
1038
+ --wds-sidebar-item-prefix-padding-end: 12px;
1039
+ --wds-sidebar-item-text-dark-active: #ffffff;
1040
+ --wds-sidebar-item-text-dark-default: #cfd1dc;
1041
+ --wds-sidebar-item-text-dark-disabled: #898B8F;
1042
+ --wds-sidebar-item-text-light-active: #084ebd;
1043
+ --wds-sidebar-item-text-light-default: #44485f;
1044
+ --wds-sidebar-item-text-light-disabled: rgba(0, 6, 36, .3);
1045
+ --wds-sidebar-item-text-neutral-active: #084ebd;
1046
+ --wds-sidebar-item-text-neutral-default: #44485f;
1047
+ --wds-sidebar-item-text-neutral-disabled: rgba(0, 6, 36, .3);
1048
+ --wds-sidebar-item-title: #868aa5;
1049
+ --wds-sidebar-minimize-action-fill-dark-default: #42454C;
1050
+ --wds-sidebar-minimize-action-fill-light-default: #d6e6fe;
1051
+ --wds-sidebar-minimize-action-fill-neutral-default: #d6e6fe;
1052
+ --wds-sidebar-minimize-action-text-dark-default: #cfd1dc;
1053
+ --wds-sidebar-minimize-action-text-light-default: #116dff;
1054
+ --wds-sidebar-minimize-action-text-neutral-default: #116dff;
1055
+ --wds-sidebar-minimize-tooltip-fill-dark-default: #333850;
1056
+ --wds-sidebar-minimize-tooltip-fill-light-default: #ffffff;
1057
+ --wds-sidebar-minimize-tooltip-fill-neutral-default: #ffffff;
1058
+ --wds-sidebar-minimize-tooltip-text-dark-default: #ffffff;
1059
+ --wds-sidebar-minimize-tooltip-text-light-default: #44485f;
1060
+ --wds-sidebar-minimize-tooltip-text-neutral-default: #44485f;
1061
+ --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
1062
+ --wds-sidebar-scrollbar-fill-dark-default: #717379;
1063
+ --wds-sidebar-scrollbar-fill-dark-hover: #8D8F96;
944
1064
  --wds-skeleton-border-radius-circle: 1000px;
945
1065
  --wds-skeleton-border-radius-line: 1000px;
946
1066
  --wds-skeleton-border-radius-rectangle: 6px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.16.3",
3
+ "version": "1.16.4",
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": "86562d789f73d8c585b91bc8e03896444b3865791915bee7ecd1e082"
36
+ "falconPackageHash": "222455cdffbef1847ff6c5e77be6aa474dbed0e02c0887cb7ad82e63"
37
37
  }
package/studio/all.st.css CHANGED
@@ -848,6 +848,65 @@
848
848
  @property st-global(--wds-side-panel-header-padding-left);
849
849
  @property st-global(--wds-side-panel-header-padding-right);
850
850
  @property st-global(--wds-side-panel-header-padding-vertical);
851
+ @property st-global(--wds-sidebar-divider-fill-dark-default);
852
+ @property st-global(--wds-sidebar-divider-fill-light-default);
853
+ @property st-global(--wds-sidebar-divider-fill-neutral-default);
854
+ @property st-global(--wds-sidebar-header-margin-bottom);
855
+ @property st-global(--wds-sidebar-item-content-gap);
856
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-active);
857
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-default);
858
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-hover);
859
+ @property st-global(--wds-sidebar-item-level-1-fill-light-active);
860
+ @property st-global(--wds-sidebar-item-level-1-fill-light-default);
861
+ @property st-global(--wds-sidebar-item-level-1-fill-light-hover);
862
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-active);
863
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-default);
864
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-hover);
865
+ @property st-global(--wds-sidebar-item-level-1-padding-bottom);
866
+ @property st-global(--wds-sidebar-item-level-1-padding-end);
867
+ @property st-global(--wds-sidebar-item-level-1-padding-start);
868
+ @property st-global(--wds-sidebar-item-level-1-padding-top);
869
+ @property st-global(--wds-sidebar-item-level-2-fill-dark-default);
870
+ @property st-global(--wds-sidebar-item-level-2-fill-light-default);
871
+ @property st-global(--wds-sidebar-item-level-2-fill-neutral-default);
872
+ @property st-global(--wds-sidebar-item-level-2-padding-bottom);
873
+ @property st-global(--wds-sidebar-item-level-2-padding-end);
874
+ @property st-global(--wds-sidebar-item-level-2-padding-start);
875
+ @property st-global(--wds-sidebar-item-level-2-padding-top);
876
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-bottom);
877
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-end);
878
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-top);
879
+ @property st-global(--wds-sidebar-item-level-3-padding-bottom);
880
+ @property st-global(--wds-sidebar-item-level-3-padding-end);
881
+ @property st-global(--wds-sidebar-item-level-3-padding-start);
882
+ @property st-global(--wds-sidebar-item-level-3-padding-top);
883
+ @property st-global(--wds-sidebar-item-minimized-paddings-horizontal);
884
+ @property st-global(--wds-sidebar-item-minimized-paddings-vertical);
885
+ @property st-global(--wds-sidebar-item-prefix-padding-end);
886
+ @property st-global(--wds-sidebar-item-text-dark-active);
887
+ @property st-global(--wds-sidebar-item-text-dark-default);
888
+ @property st-global(--wds-sidebar-item-text-dark-disabled);
889
+ @property st-global(--wds-sidebar-item-text-light-active);
890
+ @property st-global(--wds-sidebar-item-text-light-default);
891
+ @property st-global(--wds-sidebar-item-text-light-disabled);
892
+ @property st-global(--wds-sidebar-item-text-neutral-active);
893
+ @property st-global(--wds-sidebar-item-text-neutral-default);
894
+ @property st-global(--wds-sidebar-item-text-neutral-disabled);
895
+ @property st-global(--wds-sidebar-minimize-action-fill-dark-default);
896
+ @property st-global(--wds-sidebar-minimize-action-fill-light-default);
897
+ @property st-global(--wds-sidebar-minimize-action-fill-neutral-default);
898
+ @property st-global(--wds-sidebar-minimize-action-text-dark-default);
899
+ @property st-global(--wds-sidebar-minimize-action-text-light-default);
900
+ @property st-global(--wds-sidebar-minimize-action-text-neutral-default);
901
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-dark-default);
902
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-light-default);
903
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-neutral-default);
904
+ @property st-global(--wds-sidebar-minimize-tooltip-text-dark-default);
905
+ @property st-global(--wds-sidebar-minimize-tooltip-text-light-default);
906
+ @property st-global(--wds-sidebar-minimize-tooltip-text-neutral-default);
907
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-active);
908
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-default);
909
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-hover);
851
910
  @property st-global(--wds-skeleton-border-radius-circle);
852
911
  @property st-global(--wds-skeleton-border-radius-line);
853
912
  @property st-global(--wds-skeleton-border-radius-rectangle);
@@ -1903,6 +1962,65 @@
1903
1962
  --wds-side-panel-header-padding-left: 24px;
1904
1963
  --wds-side-panel-header-padding-right: 8px;
1905
1964
  --wds-side-panel-header-padding-vertical: 16px;
1965
+ --wds-sidebar-divider-fill-dark-default: #42454C;
1966
+ --wds-sidebar-divider-fill-light-default: #cfd1dc;
1967
+ --wds-sidebar-divider-fill-neutral-default: #cfd1dc;
1968
+ --wds-sidebar-header-margin-bottom: 12px;
1969
+ --wds-sidebar-item-content-gap: 8px;
1970
+ --wds-sidebar-item-level-1-fill-dark-active: #42454C;
1971
+ --wds-sidebar-item-level-1-fill-dark-default: #131720;
1972
+ --wds-sidebar-item-level-1-fill-dark-hover: #2B2E36;
1973
+ --wds-sidebar-item-level-1-fill-light-active: #c3daff;
1974
+ --wds-sidebar-item-level-1-fill-light-default: #ffffff;
1975
+ --wds-sidebar-item-level-1-fill-light-hover: #dce9ff;
1976
+ --wds-sidebar-item-level-1-fill-neutral-active: #c3daff;
1977
+ --wds-sidebar-item-level-1-fill-neutral-default: #edeef2;
1978
+ --wds-sidebar-item-level-1-fill-neutral-hover: #dce9ff;
1979
+ --wds-sidebar-item-level-1-padding-bottom: 8px;
1980
+ --wds-sidebar-item-level-1-padding-end: 18px;
1981
+ --wds-sidebar-item-level-1-padding-start: 24px;
1982
+ --wds-sidebar-item-level-1-padding-top: 8px;
1983
+ --wds-sidebar-item-level-2-fill-dark-default: #1F222B;
1984
+ --wds-sidebar-item-level-2-fill-light-default: #EAF7FF;
1985
+ --wds-sidebar-item-level-2-fill-neutral-default: #edeef2;
1986
+ --wds-sidebar-item-level-2-padding-bottom: 6px;
1987
+ --wds-sidebar-item-level-2-padding-end: 18px;
1988
+ --wds-sidebar-item-level-2-padding-start: 52px;
1989
+ --wds-sidebar-item-level-2-padding-top: 6px;
1990
+ --wds-sidebar-item-level-3-divider-padding-bottom: 6px;
1991
+ --wds-sidebar-item-level-3-divider-padding-end: 8px;
1992
+ --wds-sidebar-item-level-3-divider-padding-top: 6px;
1993
+ --wds-sidebar-item-level-3-padding-bottom: 6px;
1994
+ --wds-sidebar-item-level-3-padding-end: 18px;
1995
+ --wds-sidebar-item-level-3-padding-start: 52px;
1996
+ --wds-sidebar-item-level-3-padding-top: 6px;
1997
+ --wds-sidebar-item-minimized-paddings-horizontal: 18px;
1998
+ --wds-sidebar-item-minimized-paddings-vertical: 8px;
1999
+ --wds-sidebar-item-prefix-padding-end: 12px;
2000
+ --wds-sidebar-item-text-dark-active: #ffffff;
2001
+ --wds-sidebar-item-text-dark-default: #cfd1dc;
2002
+ --wds-sidebar-item-text-dark-disabled: #898B8F;
2003
+ --wds-sidebar-item-text-light-active: #084ebd;
2004
+ --wds-sidebar-item-text-light-default: #42454c;
2005
+ --wds-sidebar-item-text-light-disabled: #bebebe;
2006
+ --wds-sidebar-item-text-neutral-active: #084ebd;
2007
+ --wds-sidebar-item-text-neutral-default: #42454c;
2008
+ --wds-sidebar-item-text-neutral-disabled: #bebebe;
2009
+ --wds-sidebar-minimize-action-fill-dark-default: #42454C;
2010
+ --wds-sidebar-minimize-action-fill-light-default: #dce9ff;
2011
+ --wds-sidebar-minimize-action-fill-neutral-default: #dce9ff;
2012
+ --wds-sidebar-minimize-action-text-dark-default: #cfd1dc;
2013
+ --wds-sidebar-minimize-action-text-light-default: #116dff;
2014
+ --wds-sidebar-minimize-action-text-neutral-default: #116dff;
2015
+ --wds-sidebar-minimize-tooltip-fill-dark-default: #333850;
2016
+ --wds-sidebar-minimize-tooltip-fill-light-default: #ffffff;
2017
+ --wds-sidebar-minimize-tooltip-fill-neutral-default: #ffffff;
2018
+ --wds-sidebar-minimize-tooltip-text-dark-default: #ffffff;
2019
+ --wds-sidebar-minimize-tooltip-text-light-default: #2b2e36;
2020
+ --wds-sidebar-minimize-tooltip-text-neutral-default: #418aff;
2021
+ --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
2022
+ --wds-sidebar-scrollbar-fill-dark-default: #717379;
2023
+ --wds-sidebar-scrollbar-fill-dark-hover: #9c9ea6;
1906
2024
  --wds-skeleton-border-radius-circle: 1000px;
1907
2025
  --wds-skeleton-border-radius-line: 4px;
1908
2026
  --wds-skeleton-border-radius-rectangle: 4px;
package/studio/component.st.css CHANGED
@@ -385,6 +385,65 @@
385
385
  @property st-global(--wds-side-panel-header-padding-left);
386
386
  @property st-global(--wds-side-panel-header-padding-right);
387
387
  @property st-global(--wds-side-panel-header-padding-vertical);
388
+ @property st-global(--wds-sidebar-divider-fill-dark-default);
389
+ @property st-global(--wds-sidebar-divider-fill-light-default);
390
+ @property st-global(--wds-sidebar-divider-fill-neutral-default);
391
+ @property st-global(--wds-sidebar-header-margin-bottom);
392
+ @property st-global(--wds-sidebar-item-content-gap);
393
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-active);
394
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-default);
395
+ @property st-global(--wds-sidebar-item-level-1-fill-dark-hover);
396
+ @property st-global(--wds-sidebar-item-level-1-fill-light-active);
397
+ @property st-global(--wds-sidebar-item-level-1-fill-light-default);
398
+ @property st-global(--wds-sidebar-item-level-1-fill-light-hover);
399
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-active);
400
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-default);
401
+ @property st-global(--wds-sidebar-item-level-1-fill-neutral-hover);
402
+ @property st-global(--wds-sidebar-item-level-1-padding-bottom);
403
+ @property st-global(--wds-sidebar-item-level-1-padding-end);
404
+ @property st-global(--wds-sidebar-item-level-1-padding-start);
405
+ @property st-global(--wds-sidebar-item-level-1-padding-top);
406
+ @property st-global(--wds-sidebar-item-level-2-fill-dark-default);
407
+ @property st-global(--wds-sidebar-item-level-2-fill-light-default);
408
+ @property st-global(--wds-sidebar-item-level-2-fill-neutral-default);
409
+ @property st-global(--wds-sidebar-item-level-2-padding-bottom);
410
+ @property st-global(--wds-sidebar-item-level-2-padding-end);
411
+ @property st-global(--wds-sidebar-item-level-2-padding-start);
412
+ @property st-global(--wds-sidebar-item-level-2-padding-top);
413
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-bottom);
414
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-end);
415
+ @property st-global(--wds-sidebar-item-level-3-divider-padding-top);
416
+ @property st-global(--wds-sidebar-item-level-3-padding-bottom);
417
+ @property st-global(--wds-sidebar-item-level-3-padding-end);
418
+ @property st-global(--wds-sidebar-item-level-3-padding-start);
419
+ @property st-global(--wds-sidebar-item-level-3-padding-top);
420
+ @property st-global(--wds-sidebar-item-minimized-paddings-horizontal);
421
+ @property st-global(--wds-sidebar-item-minimized-paddings-vertical);
422
+ @property st-global(--wds-sidebar-item-prefix-padding-end);
423
+ @property st-global(--wds-sidebar-item-text-dark-active);
424
+ @property st-global(--wds-sidebar-item-text-dark-default);
425
+ @property st-global(--wds-sidebar-item-text-dark-disabled);
426
+ @property st-global(--wds-sidebar-item-text-light-active);
427
+ @property st-global(--wds-sidebar-item-text-light-default);
428
+ @property st-global(--wds-sidebar-item-text-light-disabled);
429
+ @property st-global(--wds-sidebar-item-text-neutral-active);
430
+ @property st-global(--wds-sidebar-item-text-neutral-default);
431
+ @property st-global(--wds-sidebar-item-text-neutral-disabled);
432
+ @property st-global(--wds-sidebar-minimize-action-fill-dark-default);
433
+ @property st-global(--wds-sidebar-minimize-action-fill-light-default);
434
+ @property st-global(--wds-sidebar-minimize-action-fill-neutral-default);
435
+ @property st-global(--wds-sidebar-minimize-action-text-dark-default);
436
+ @property st-global(--wds-sidebar-minimize-action-text-light-default);
437
+ @property st-global(--wds-sidebar-minimize-action-text-neutral-default);
438
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-dark-default);
439
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-light-default);
440
+ @property st-global(--wds-sidebar-minimize-tooltip-fill-neutral-default);
441
+ @property st-global(--wds-sidebar-minimize-tooltip-text-dark-default);
442
+ @property st-global(--wds-sidebar-minimize-tooltip-text-light-default);
443
+ @property st-global(--wds-sidebar-minimize-tooltip-text-neutral-default);
444
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-active);
445
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-default);
446
+ @property st-global(--wds-sidebar-scrollbar-fill-dark-hover);
388
447
  @property st-global(--wds-skeleton-border-radius-circle);
389
448
  @property st-global(--wds-skeleton-border-radius-line);
390
449
  @property st-global(--wds-skeleton-border-radius-rectangle);
@@ -941,6 +1000,65 @@
941
1000
  --wds-side-panel-header-padding-left: 24px;
942
1001
  --wds-side-panel-header-padding-right: 8px;
943
1002
  --wds-side-panel-header-padding-vertical: 16px;
1003
+ --wds-sidebar-divider-fill-dark-default: #42454C;
1004
+ --wds-sidebar-divider-fill-light-default: #cfd1dc;
1005
+ --wds-sidebar-divider-fill-neutral-default: #cfd1dc;
1006
+ --wds-sidebar-header-margin-bottom: 12px;
1007
+ --wds-sidebar-item-content-gap: 8px;
1008
+ --wds-sidebar-item-level-1-fill-dark-active: #42454C;
1009
+ --wds-sidebar-item-level-1-fill-dark-default: #131720;
1010
+ --wds-sidebar-item-level-1-fill-dark-hover: #2B2E36;
1011
+ --wds-sidebar-item-level-1-fill-light-active: #c3daff;
1012
+ --wds-sidebar-item-level-1-fill-light-default: #ffffff;
1013
+ --wds-sidebar-item-level-1-fill-light-hover: #dce9ff;
1014
+ --wds-sidebar-item-level-1-fill-neutral-active: #c3daff;
1015
+ --wds-sidebar-item-level-1-fill-neutral-default: #edeef2;
1016
+ --wds-sidebar-item-level-1-fill-neutral-hover: #dce9ff;
1017
+ --wds-sidebar-item-level-1-padding-bottom: 8px;
1018
+ --wds-sidebar-item-level-1-padding-end: 18px;
1019
+ --wds-sidebar-item-level-1-padding-start: 24px;
1020
+ --wds-sidebar-item-level-1-padding-top: 8px;
1021
+ --wds-sidebar-item-level-2-fill-dark-default: #1F222B;
1022
+ --wds-sidebar-item-level-2-fill-light-default: #EAF7FF;
1023
+ --wds-sidebar-item-level-2-fill-neutral-default: #edeef2;
1024
+ --wds-sidebar-item-level-2-padding-bottom: 6px;
1025
+ --wds-sidebar-item-level-2-padding-end: 18px;
1026
+ --wds-sidebar-item-level-2-padding-start: 52px;
1027
+ --wds-sidebar-item-level-2-padding-top: 6px;
1028
+ --wds-sidebar-item-level-3-divider-padding-bottom: 6px;
1029
+ --wds-sidebar-item-level-3-divider-padding-end: 8px;
1030
+ --wds-sidebar-item-level-3-divider-padding-top: 6px;
1031
+ --wds-sidebar-item-level-3-padding-bottom: 6px;
1032
+ --wds-sidebar-item-level-3-padding-end: 18px;
1033
+ --wds-sidebar-item-level-3-padding-start: 52px;
1034
+ --wds-sidebar-item-level-3-padding-top: 6px;
1035
+ --wds-sidebar-item-minimized-paddings-horizontal: 18px;
1036
+ --wds-sidebar-item-minimized-paddings-vertical: 8px;
1037
+ --wds-sidebar-item-prefix-padding-end: 12px;
1038
+ --wds-sidebar-item-text-dark-active: #ffffff;
1039
+ --wds-sidebar-item-text-dark-default: #cfd1dc;
1040
+ --wds-sidebar-item-text-dark-disabled: #898B8F;
1041
+ --wds-sidebar-item-text-light-active: #084ebd;
1042
+ --wds-sidebar-item-text-light-default: #42454c;
1043
+ --wds-sidebar-item-text-light-disabled: #bebebe;
1044
+ --wds-sidebar-item-text-neutral-active: #084ebd;
1045
+ --wds-sidebar-item-text-neutral-default: #42454c;
1046
+ --wds-sidebar-item-text-neutral-disabled: #bebebe;
1047
+ --wds-sidebar-minimize-action-fill-dark-default: #42454C;
1048
+ --wds-sidebar-minimize-action-fill-light-default: #dce9ff;
1049
+ --wds-sidebar-minimize-action-fill-neutral-default: #dce9ff;
1050
+ --wds-sidebar-minimize-action-text-dark-default: #cfd1dc;
1051
+ --wds-sidebar-minimize-action-text-light-default: #116dff;
1052
+ --wds-sidebar-minimize-action-text-neutral-default: #116dff;
1053
+ --wds-sidebar-minimize-tooltip-fill-dark-default: #333850;
1054
+ --wds-sidebar-minimize-tooltip-fill-light-default: #ffffff;
1055
+ --wds-sidebar-minimize-tooltip-fill-neutral-default: #ffffff;
1056
+ --wds-sidebar-minimize-tooltip-text-dark-default: #ffffff;
1057
+ --wds-sidebar-minimize-tooltip-text-light-default: #2b2e36;
1058
+ --wds-sidebar-minimize-tooltip-text-neutral-default: #418aff;
1059
+ --wds-sidebar-scrollbar-fill-dark-active: #b8b9bc;
1060
+ --wds-sidebar-scrollbar-fill-dark-default: #717379;
1061
+ --wds-sidebar-scrollbar-fill-dark-hover: #9c9ea6;
944
1062
  --wds-skeleton-border-radius-circle: 1000px;
945
1063
  --wds-skeleton-border-radius-line: 4px;
946
1064
  --wds-skeleton-border-radius-rectangle: 4px;