@wix/design-system-tokens 1.162.0 → 1.164.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/all.css +9 -0
- package/all.scss +9 -0
- package/all.st.css +18 -0
- package/component.st.css +16 -0
- package/odeditor/all.css +3 -1
- package/odeditor/all.scss +3 -1
- package/odeditor/all.st.css +6 -2
- package/odeditor/component.st.css +6 -2
- package/odeditor-dark/all.css +38 -35
- package/odeditor-dark/all.scss +38 -35
- package/odeditor-dark/all.st.css +48 -42
- package/odeditor-dark/component.st.css +8 -4
- package/odeditor-dark/foundation.st.css +22 -20
- package/odeditor-dark/semantic.st.css +18 -18
- package/package.json +2 -2
- package/semantic.st.css +2 -0
- package/studio/all.css +9 -0
- package/studio/all.scss +9 -0
- package/studio/all.st.css +18 -0
- package/studio/component.st.css +16 -0
- package/studio/semantic.st.css +2 -0
- package/wixel/all.css +8 -0
- package/wixel/all.scss +8 -0
- package/wixel/all.st.css +16 -0
- package/wixel/component.st.css +16 -0
package/odeditor-dark/all.scss
CHANGED
|
@@ -108,13 +108,9 @@
|
|
|
108
108
|
--wds-shadow-x-25: 1px;
|
|
109
109
|
--wds-shadow-x-0: 0px;
|
|
110
110
|
--wds-shadow-spread-secondary-raised: -0.70;
|
|
111
|
+
--wds-shadow-inner-300-vertical: 0;
|
|
112
|
+
--wds-shadow-inner-300-top: 0 0 0;
|
|
111
113
|
--wds-shadow-focus-spread: 0;
|
|
112
|
-
--wds-shadow-fill-secondary-raised: #0006241F;
|
|
113
|
-
--wds-shadow-fill-secondary-overlay: #00000061;
|
|
114
|
-
--wds-shadow-fill-primary-raised: #0006244D;
|
|
115
|
-
--wds-shadow-fill-primary-overlay-dark: #00000052;
|
|
116
|
-
--wds-shadow-fill-primary-overlay: #00000052;
|
|
117
|
-
--wds-shadow-fill-primary-modal: #00000040;
|
|
118
114
|
--wds-shadow-blur-tertiary-toggle-button: 0.6px;
|
|
119
115
|
--wds-shadow-blur-secondary-toggle-button: 1.7px;
|
|
120
116
|
--wds-shadow-blur-800: 30px;
|
|
@@ -297,6 +293,7 @@
|
|
|
297
293
|
--wds-color-blue-600: #111214;
|
|
298
294
|
--wds-color-blue-500: #212328;
|
|
299
295
|
--wds-color-blue-400: #343F53;
|
|
296
|
+
--wds-color-blue-350: #40506C;
|
|
300
297
|
--wds-color-blue-300: #485B7E;
|
|
301
298
|
--wds-color-blue-250: #5B78A9;
|
|
302
299
|
--wds-color-blue-200: #6F94D4;
|
|
@@ -397,6 +394,7 @@
|
|
|
397
394
|
--wds-vertical-tabs-action-padding-horizontal-tiny: var(--wds-space-300);
|
|
398
395
|
--wds-vertical-tabs-action-padding-horizontal-small: var(--wds-space-300);
|
|
399
396
|
--wds-vertical-tabs-action-padding-horizontal-medium: var(--wds-space-600);
|
|
397
|
+
--wds-top-banner-fill: var(--wds-color-purple-400);
|
|
400
398
|
--wds-tooltip-shadow: var(--wds-color-black-100-transparent-0);
|
|
401
399
|
--wds-tooltip-padding-vertical-small: var(--wds-space-150);
|
|
402
400
|
--wds-tooltip-padding-vertical-medium: var(--wds-space-150);
|
|
@@ -586,7 +584,6 @@
|
|
|
586
584
|
--wds-sidebar-minimize-action-fill-light-default: var(--wds-color-blue-400);
|
|
587
585
|
--wds-sidebar-item-text-neutral-active: var(--wds-color-blue-0);
|
|
588
586
|
--wds-sidebar-item-text-light-active: var(--wds-color-blue-0);
|
|
589
|
-
--wds-sidebar-item-text-dark-default: var(--wds-color-black-550);
|
|
590
587
|
--wds-sidebar-item-text-dark-active: var(--wds-color-white);
|
|
591
588
|
--wds-sidebar-item-prefix-padding-end: var(--wds-space-300);
|
|
592
589
|
--wds-sidebar-item-minimized-paddings-vertical: var(--wds-space-200);
|
|
@@ -652,36 +649,42 @@
|
|
|
652
649
|
--wds-shadow-x-primary-toggle-button: var(--wds-shadow-x-25);
|
|
653
650
|
--wds-shadow-x-primary-modal: var(--wds-shadow-x-0);
|
|
654
651
|
--wds-shadow-x-input: var(--wds-shadow-x-25);
|
|
655
|
-
--wds-shadow-surface-modal: var(--wds-shadow-x-50) var(--wds-shadow-y-600) var(--wds-shadow-blur-800) var(--wds-color-
|
|
656
|
-
--wds-shadow-inner-400-
|
|
657
|
-
--wds-shadow-inner-400-
|
|
658
|
-
--wds-shadow-inner-400-
|
|
659
|
-
--wds-shadow-inner-400-
|
|
660
|
-
--wds-shadow-inner-400: 0
|
|
661
|
-
--wds-shadow-inner-
|
|
662
|
-
--wds-shadow-inner-300-right: -22px 0 18px -18px var(--wds-color-
|
|
663
|
-
--wds-shadow-inner-300-left: 22px 0 18px -18px var(--wds-color-
|
|
664
|
-
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px var(--wds-color-
|
|
665
|
-
--wds-shadow-inner-300: 0 0 18px var(--wds-color-
|
|
666
|
-
--wds-shadow-inner-200: 1px 1px 4px var(--wds-color-
|
|
667
|
-
--wds-shadow-inner-100: 1px 1px 2px var(--wds-color-
|
|
652
|
+
--wds-shadow-surface-modal: var(--wds-shadow-x-50) var(--wds-shadow-y-600) var(--wds-shadow-blur-800) var(--wds-color-white-transparent-30), 0 var(--wds-shadow-blur-0) var(--wds-shadow-y-0) var(--wds-color-white-transparent-30);
|
|
653
|
+
--wds-shadow-inner-400-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
|
|
654
|
+
--wds-shadow-inner-400-top: 0 32px 24px -24px var(--wds-color-white-transparent-20) inset, 0 8px 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
655
|
+
--wds-shadow-inner-400-right: -32px 0 24px -24px var(--wds-color-white-transparent-20) inset, -8px 0 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
656
|
+
--wds-shadow-inner-400-left: 32px 0 24px -24px var(--wds-color-white-transparent-20) inset, 8px 0 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
657
|
+
--wds-shadow-inner-400-bottom: 0 -32px 24px -24px var(--wds-color-white-transparent-20) inset, 0 -8px 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
658
|
+
--wds-shadow-inner-400: 0 0 24px var(--wds-color-white-transparent-20) inset, 0 0 6px var(--wds-color-white-transparent-5) inset;
|
|
659
|
+
--wds-shadow-inner-300-right: -22px 0 18px -18px var(--wds-color-white-transparent-10) inset, -8px 0 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
660
|
+
--wds-shadow-inner-300-left: 22px 0 18px -18px var(--wds-color-white-transparent-10) inset, 8px 0 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
661
|
+
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px var(--wds-color-white-transparent-10) inset, 0 -8px 6px -6px var(--wds-color-white-transparent-5) inset;
|
|
662
|
+
--wds-shadow-inner-300: 0 0 18px var(--wds-color-white-transparent-10) inset, 0 0 6px var(--wds-color-white-transparent-5) inset;
|
|
663
|
+
--wds-shadow-inner-200: 1px 1px 4px var(--wds-color-white-transparent-20) inset;
|
|
664
|
+
--wds-shadow-inner-100: 1px 1px 2px var(--wds-color-white-transparent-10) inset, 1px 1px 2px var(--wds-color-white-transparent-10);
|
|
668
665
|
--wds-shadow-focus-warning: 0 0 0 var(--wds-color-yellow-400);
|
|
669
666
|
--wds-shadow-focus-standard: 0 0 0 3px var(--wds-color-blue-300);
|
|
670
667
|
--wds-shadow-focus-inner-warning: 0 0 0 3px var(--wds-color-yellow-400) inset;
|
|
671
668
|
--wds-shadow-focus-inner-standard: 0 0 0 3px var(--wds-color-blue-300) inset;
|
|
672
669
|
--wds-shadow-focus-inner-destructive: 0 0 0 3px var(--wds-color-red-400) inset;
|
|
673
670
|
--wds-shadow-focus-destructive: 0 0 0 var(--wds-color-red-400);
|
|
674
|
-
--wds-shadow-fill-tertiary-toggle-button: var(--wds-color-
|
|
671
|
+
--wds-shadow-fill-tertiary-toggle-button: var(--wds-color-blue-500);
|
|
675
672
|
--wds-shadow-fill-tertiary-raised: var(--wds-color-black-100-transparent-0);
|
|
676
|
-
--wds-shadow-fill-secondary-toggle-button: var(--wds-color-
|
|
673
|
+
--wds-shadow-fill-secondary-toggle-button: var(--wds-color-blue-600);
|
|
677
674
|
--wds-shadow-fill-secondary-toggle: var(--wds-color-black-100-transparent-0);
|
|
678
|
-
--wds-shadow-fill-secondary-
|
|
675
|
+
--wds-shadow-fill-secondary-raised: var(--wds-color-white-transparent-10);
|
|
676
|
+
--wds-shadow-fill-secondary-overlay-dark: var(--wds-color-white-transparent-20);
|
|
677
|
+
--wds-shadow-fill-secondary-overlay: var(--wds-color-white-transparent-30);
|
|
679
678
|
--wds-shadow-fill-secondary-modal: var(--wds-color-black-100-transparent-0);
|
|
680
679
|
--wds-shadow-fill-quaternary-raised: var(--wds-color-black-100-transparent-0);
|
|
681
680
|
--wds-shadow-fill-primary-toggle-button: var(--wds-color-black-100-transparent-0);
|
|
682
681
|
--wds-shadow-fill-primary-toggle: var(--wds-color-black-100-transparent-0);
|
|
683
682
|
--wds-shadow-fill-primary-slider: var(--wds-color-black-100-transparent-0);
|
|
684
|
-
--wds-shadow-fill-
|
|
683
|
+
--wds-shadow-fill-primary-raised: var(--wds-color-white-transparent-30);
|
|
684
|
+
--wds-shadow-fill-primary-overlay-dark: var(--wds-color-white-transparent-30);
|
|
685
|
+
--wds-shadow-fill-primary-overlay: var(--wds-color-white-transparent-30);
|
|
686
|
+
--wds-shadow-fill-primary-modal: var(--wds-color-white-transparent-30);
|
|
687
|
+
--wds-shadow-fill-input: var(--wds-color-white-transparent-20);
|
|
685
688
|
--wds-shadow-blur-secondary-toggle: var(--wds-shadow-blur-0);
|
|
686
689
|
--wds-shadow-blur-secondary-raised: var(--wds-shadow-blur-50);
|
|
687
690
|
--wds-shadow-blur-secondary-overlay-dark: var(--wds-shadow-blur-0);
|
|
@@ -694,10 +697,10 @@
|
|
|
694
697
|
--wds-shadow-blur-primary-overlay: var(--wds-shadow-blur-125);
|
|
695
698
|
--wds-shadow-blur-primary-modal: var(--wds-shadow-blur-500);
|
|
696
699
|
--wds-shadow-blur-input: var(--wds-shadow-blur-35);
|
|
697
|
-
--wds-shadow-400: 0 8px 8px var(--wds-color-
|
|
698
|
-
--wds-shadow-300: 0 var(--wds-shadow-y-300) var(--wds-shadow-blur-800) 0 var(--wds-color-
|
|
699
|
-
--wds-shadow-200: 0 2px 4px var(--wds-color-
|
|
700
|
-
--wds-shadow-100: 0 2px 1px var(--wds-color-
|
|
700
|
+
--wds-shadow-400: 0 8px 8px var(--wds-color-white-transparent-10), 0 3px 24px var(--wds-color-white-transparent-20);
|
|
701
|
+
--wds-shadow-300: 0 var(--wds-shadow-y-300) var(--wds-shadow-blur-800) 0 var(--wds-color-white-transparent-30), 0 var(--wds-shadow-blur-0) var(--wds-shadow-y-0) 0 var(--wds-color-white-transparent-30);
|
|
702
|
+
--wds-shadow-200: 0 2px 4px var(--wds-color-white-transparent-5), 0 0 6px var(--wds-color-white-transparent-10);
|
|
703
|
+
--wds-shadow-100: 0 2px 1px var(--wds-color-white-transparent-50), 0 0 3px var(--wds-color-white-transparent-10);
|
|
701
704
|
--wds-selector-list-item-padding-vertical-small: var(--wds-space-100);
|
|
702
705
|
--wds-selector-list-item-padding-vertical-medium: var(--wds-space-200);
|
|
703
706
|
--wds-selector-list-item-padding-horizontal-small: var(--wds-space-400);
|
|
@@ -941,10 +944,10 @@
|
|
|
941
944
|
--wds-inner-shadow-x-secondary: var(--wds-shadow-x-25);
|
|
942
945
|
--wds-inner-shadow-x-primary: var(--wds-shadow-x-25);
|
|
943
946
|
--wds-inner-shadow-x-input: var(--wds-shadow-x-25);
|
|
944
|
-
--wds-inner-shadow-fill-track: var(--wds-color-
|
|
945
|
-
--wds-inner-shadow-fill-secondary: var(--wds-color-
|
|
946
|
-
--wds-inner-shadow-fill-primary: var(--wds-color-
|
|
947
|
-
--wds-inner-shadow-fill-input: var(--wds-color-
|
|
947
|
+
--wds-inner-shadow-fill-track: var(--wds-color-white-transparent-20);
|
|
948
|
+
--wds-inner-shadow-fill-secondary: var(--wds-color-blue-600);
|
|
949
|
+
--wds-inner-shadow-fill-primary: var(--wds-color-blue-600);
|
|
950
|
+
--wds-inner-shadow-fill-input: var(--wds-color-blue-600);
|
|
948
951
|
--wds-inner-shadow-blur-secondary: var(--wds-shadow-blur-25);
|
|
949
952
|
--wds-inner-shadow-blur-primary: var(--wds-shadow-blur-25);
|
|
950
953
|
--wds-inner-shadow-blur-input: var(--wds-shadow-blur-35);
|
|
@@ -1590,7 +1593,7 @@
|
|
|
1590
1593
|
--wds-toggle-button-label-fill-inverted-selected-hover: var(--wds-color-text-standard-primary);
|
|
1591
1594
|
--wds-toggle-button-label-fill-inverted-selected: var(--wds-color-text-standard-primary);
|
|
1592
1595
|
--wds-toggle-button-label-fill-inverted-hover: var(--wds-color-text-standard-primary);
|
|
1593
|
-
--wds-toggle-button-label-fill-inverted: var(--wds-color-text-standard-primary);
|
|
1596
|
+
--wds-toggle-button-label-fill-inverted-default: var(--wds-color-text-standard-primary);
|
|
1594
1597
|
--wds-toggle-button-label-fill-dark-selected-hover: var(--wds-color-text-standard-primary);
|
|
1595
1598
|
--wds-toggle-button-label-fill-dark-selected: var(--wds-color-text-standard-primary);
|
|
1596
1599
|
--wds-toggle-button-label-fill-dark-hover: var(--wds-color-text-standard-primary);
|
|
@@ -1634,15 +1637,15 @@
|
|
|
1634
1637
|
--wds-sidebar-item-text-neutral-default: var(--wds-color-text-standard-secondary);
|
|
1635
1638
|
--wds-sidebar-item-text-light-disabled: var(--wds-color-text-disabled);
|
|
1636
1639
|
--wds-sidebar-item-text-light-default: var(--wds-color-text-standard-secondary);
|
|
1640
|
+
--wds-sidebar-item-text-dark-default: var(--wds-color-text-standard-primary);
|
|
1641
|
+
--wds-sidebar-header-text-dark-default: var(--wds-color-text-standard-primary);
|
|
1637
1642
|
--wds-side-panel-title-font-size: var(--wds-font-size-heading-3);
|
|
1638
1643
|
--wds-side-panel-footer-fill: var(--wds-color-fill-surface-modal);
|
|
1639
1644
|
--wds-side-panel-floating-title-font-size: var(--wds-font-size-heading-3);
|
|
1640
1645
|
--wds-shadow-surface-raised: var(--wds-shadow-200);
|
|
1641
1646
|
--wds-shadow-surface-overlay-dark: var(--wds-shadow-300);
|
|
1642
1647
|
--wds-shadow-surface-overlay: var(--wds-shadow-300);
|
|
1643
|
-
--wds-shadow-inner-400-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
|
|
1644
1648
|
--wds-shadow-inner-400-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
|
|
1645
|
-
--wds-shadow-inner-300-vertical: var(--wds-shadow-inner-300-top), var(--wds-shadow-inner-300-bottom);
|
|
1646
1649
|
--wds-shadow-inner-300-horizontal: var(--wds-shadow-inner-300-left), var(--wds-shadow-inner-300-right);
|
|
1647
1650
|
--wds-selector-button-text-fill-pressed: var(--wds-color-text-primary);
|
|
1648
1651
|
--wds-selector-button-text-fill-hover: var(--wds-color-text-standard-primary);
|
package/odeditor-dark/all.st.css
CHANGED
|
@@ -367,6 +367,7 @@
|
|
|
367
367
|
@property st-global(--wds-color-blue-200);
|
|
368
368
|
@property st-global(--wds-color-blue-250);
|
|
369
369
|
@property st-global(--wds-color-blue-300);
|
|
370
|
+
@property st-global(--wds-color-blue-350);
|
|
370
371
|
@property st-global(--wds-color-blue-400);
|
|
371
372
|
@property st-global(--wds-color-blue-500);
|
|
372
373
|
@property st-global(--wds-color-blue-600);
|
|
@@ -1564,6 +1565,7 @@
|
|
|
1564
1565
|
@property st-global(--wds-sidebar-divider-fill-light-default);
|
|
1565
1566
|
@property st-global(--wds-sidebar-divider-fill-neutral-default);
|
|
1566
1567
|
@property st-global(--wds-sidebar-header-margin-bottom);
|
|
1568
|
+
@property st-global(--wds-sidebar-header-text-dark-default);
|
|
1567
1569
|
@property st-global(--wds-sidebar-item-content-gap);
|
|
1568
1570
|
@property st-global(--wds-sidebar-item-level-1-fill-dark-active);
|
|
1569
1571
|
@property st-global(--wds-sidebar-item-level-1-fill-dark-default);
|
|
@@ -1848,7 +1850,7 @@
|
|
|
1848
1850
|
@property st-global(--wds-toggle-button-label-fill-dark-selected);
|
|
1849
1851
|
@property st-global(--wds-toggle-button-label-fill-dark-selected-disabled);
|
|
1850
1852
|
@property st-global(--wds-toggle-button-label-fill-dark-selected-hover);
|
|
1851
|
-
@property st-global(--wds-toggle-button-label-fill-inverted);
|
|
1853
|
+
@property st-global(--wds-toggle-button-label-fill-inverted-default);
|
|
1852
1854
|
@property st-global(--wds-toggle-button-label-fill-inverted-disabled);
|
|
1853
1855
|
@property st-global(--wds-toggle-button-label-fill-inverted-hover);
|
|
1854
1856
|
@property st-global(--wds-toggle-button-label-fill-inverted-selected);
|
|
@@ -1953,6 +1955,7 @@
|
|
|
1953
1955
|
@property st-global(--wds-tooltip-padding-vertical-small);
|
|
1954
1956
|
@property st-global(--wds-tooltip-shadow);
|
|
1955
1957
|
@property st-global(--wds-tooltip-text-fill);
|
|
1958
|
+
@property st-global(--wds-top-banner-fill);
|
|
1956
1959
|
@property st-global(--wds-variable-input-padding-vertical-small);
|
|
1957
1960
|
@property st-global(--wds-variable-input-padding-vertical-tiny);
|
|
1958
1961
|
@property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
|
|
@@ -2298,7 +2301,7 @@
|
|
|
2298
2301
|
--wds-card-tab-padding-horizontal-small: 20px;
|
|
2299
2302
|
--wds-card-tab-padding-vertical-medium: 16px;
|
|
2300
2303
|
--wds-card-tab-padding-vertical-small: 16px;
|
|
2301
|
-
--wds-carousel-controls-shadow: 0 9 20px
|
|
2304
|
+
--wds-carousel-controls-shadow: 0 9 20px rgba(0, 0, 0, .3), 0 0px 0px rgba(255, 255, 255, 0);
|
|
2302
2305
|
--wds-carousel-dots-width: 4px;
|
|
2303
2306
|
--wds-checkbox-border: #D4D3D2;
|
|
2304
2307
|
--wds-checkbox-border-active: #82B0FF;
|
|
@@ -2394,6 +2397,7 @@
|
|
|
2394
2397
|
--wds-color-blue-200: #6F94D4;
|
|
2395
2398
|
--wds-color-blue-250: #5B78A9;
|
|
2396
2399
|
--wds-color-blue-300: #485B7E;
|
|
2400
|
+
--wds-color-blue-350: #40506C;
|
|
2397
2401
|
--wds-color-blue-400: #343F53;
|
|
2398
2402
|
--wds-color-blue-500: #212328;
|
|
2399
2403
|
--wds-color-blue-600: #111214;
|
|
@@ -3074,10 +3078,10 @@
|
|
|
3074
3078
|
--wds-inner-shadow-blur-input: 3px;
|
|
3075
3079
|
--wds-inner-shadow-blur-primary: 2px;
|
|
3076
3080
|
--wds-inner-shadow-blur-secondary: 2px;
|
|
3077
|
-
--wds-inner-shadow-fill-input:
|
|
3078
|
-
--wds-inner-shadow-fill-primary: #
|
|
3079
|
-
--wds-inner-shadow-fill-secondary: #
|
|
3080
|
-
--wds-inner-shadow-fill-track: rgba(
|
|
3081
|
+
--wds-inner-shadow-fill-input: #111214;
|
|
3082
|
+
--wds-inner-shadow-fill-primary: #111214;
|
|
3083
|
+
--wds-inner-shadow-fill-secondary: #111214;
|
|
3084
|
+
--wds-inner-shadow-fill-track: rgba(0, 0, 0, .2);
|
|
3081
3085
|
--wds-inner-shadow-x-input: 1px;
|
|
3082
3086
|
--wds-inner-shadow-x-primary: 1px;
|
|
3083
3087
|
--wds-inner-shadow-x-secondary: 1px;
|
|
@@ -3447,10 +3451,10 @@
|
|
|
3447
3451
|
--wds-selector-list-item-padding-horizontal-small: 16px;
|
|
3448
3452
|
--wds-selector-list-item-padding-vertical-medium: 8px;
|
|
3449
3453
|
--wds-selector-list-item-padding-vertical-small: 4px;
|
|
3450
|
-
--wds-shadow-100: 0 2px 1px rgba(
|
|
3451
|
-
--wds-shadow-200: 0 2px 4px rgba(
|
|
3452
|
-
--wds-shadow-300: 0 12px 30px 0 rgba(
|
|
3453
|
-
--wds-shadow-400: 0 8px 8px rgba(
|
|
3454
|
+
--wds-shadow-100: 0 2px 1px rgba(0, 0, 0, .5), 0 0 3px rgba(0, 0, 0, .1);
|
|
3455
|
+
--wds-shadow-200: 0 2px 4px rgba(0, 0, 0, .05), 0 0 6px rgba(0, 0, 0, .1);
|
|
3456
|
+
--wds-shadow-300: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
3457
|
+
--wds-shadow-400: 0 8px 8px rgba(0, 0, 0, .1), 0 3px 24px rgba(0, 0, 0, .2);
|
|
3454
3458
|
--wds-shadow-blur-0: 0px;
|
|
3455
3459
|
--wds-shadow-blur-25: 2px;
|
|
3456
3460
|
--wds-shadow-blur-35: 3px;
|
|
@@ -3478,23 +3482,23 @@
|
|
|
3478
3482
|
--wds-shadow-blur-secondary-toggle: 0px;
|
|
3479
3483
|
--wds-shadow-blur-secondary-toggle-button: 1.7px;
|
|
3480
3484
|
--wds-shadow-blur-tertiary-toggle-button: 0.6px;
|
|
3481
|
-
--wds-shadow-fill-input: rgba(
|
|
3482
|
-
--wds-shadow-fill-primary-modal:
|
|
3483
|
-
--wds-shadow-fill-primary-overlay:
|
|
3484
|
-
--wds-shadow-fill-primary-overlay-dark:
|
|
3485
|
-
--wds-shadow-fill-primary-raised:
|
|
3485
|
+
--wds-shadow-fill-input: rgba(0, 0, 0, .2);
|
|
3486
|
+
--wds-shadow-fill-primary-modal: rgba(0, 0, 0, .3);
|
|
3487
|
+
--wds-shadow-fill-primary-overlay: rgba(0, 0, 0, .3);
|
|
3488
|
+
--wds-shadow-fill-primary-overlay-dark: rgba(0, 0, 0, .3);
|
|
3489
|
+
--wds-shadow-fill-primary-raised: rgba(0, 0, 0, .3);
|
|
3486
3490
|
--wds-shadow-fill-primary-slider: rgba(255, 255, 255, 0);
|
|
3487
3491
|
--wds-shadow-fill-primary-toggle: rgba(255, 255, 255, 0);
|
|
3488
3492
|
--wds-shadow-fill-primary-toggle-button: rgba(255, 255, 255, 0);
|
|
3489
3493
|
--wds-shadow-fill-quaternary-raised: rgba(255, 255, 255, 0);
|
|
3490
3494
|
--wds-shadow-fill-secondary-modal: rgba(255, 255, 255, 0);
|
|
3491
|
-
--wds-shadow-fill-secondary-overlay:
|
|
3492
|
-
--wds-shadow-fill-secondary-overlay-dark: rgba(
|
|
3493
|
-
--wds-shadow-fill-secondary-raised:
|
|
3495
|
+
--wds-shadow-fill-secondary-overlay: rgba(0, 0, 0, .3);
|
|
3496
|
+
--wds-shadow-fill-secondary-overlay-dark: rgba(0, 0, 0, .2);
|
|
3497
|
+
--wds-shadow-fill-secondary-raised: rgba(0, 0, 0, .1);
|
|
3494
3498
|
--wds-shadow-fill-secondary-toggle: rgba(255, 255, 255, 0);
|
|
3495
|
-
--wds-shadow-fill-secondary-toggle-button: #
|
|
3499
|
+
--wds-shadow-fill-secondary-toggle-button: #111214;
|
|
3496
3500
|
--wds-shadow-fill-tertiary-raised: rgba(255, 255, 255, 0);
|
|
3497
|
-
--wds-shadow-fill-tertiary-toggle-button: #
|
|
3501
|
+
--wds-shadow-fill-tertiary-toggle-button: #212328;
|
|
3498
3502
|
--wds-shadow-focus-destructive: 0 0 0 #A6464B;
|
|
3499
3503
|
--wds-shadow-focus-inner-destructive: 0 0 0 3px #A6464B inset;
|
|
3500
3504
|
--wds-shadow-focus-inner-standard: 0 0 0 3px #485B7E inset;
|
|
@@ -3502,27 +3506,27 @@
|
|
|
3502
3506
|
--wds-shadow-focus-spread: 0;
|
|
3503
3507
|
--wds-shadow-focus-standard: 0 0 0 3px #485B7E;
|
|
3504
3508
|
--wds-shadow-focus-warning: 0 0 0 #946933;
|
|
3505
|
-
--wds-shadow-inner-100: 1px 1px 2px rgba(
|
|
3506
|
-
--wds-shadow-inner-200: 1px 1px 4px rgba(
|
|
3507
|
-
--wds-shadow-inner-300: 0 0 18px rgba(
|
|
3508
|
-
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px rgba(
|
|
3509
|
-
--wds-shadow-inner-300-horizontal: 22px 0 18px -18px rgba(
|
|
3510
|
-
--wds-shadow-inner-300-left: 22px 0 18px -18px rgba(
|
|
3511
|
-
--wds-shadow-inner-300-right: -22px 0 18px -18px rgba(
|
|
3512
|
-
--wds-shadow-inner-300-top: 0
|
|
3513
|
-
--wds-shadow-inner-300-vertical: 0
|
|
3514
|
-
--wds-shadow-inner-400: 0 0 24px rgba(
|
|
3515
|
-
--wds-shadow-inner-400-bottom: 0 -32px 24px -24px rgba(
|
|
3516
|
-
--wds-shadow-inner-400-horizontal: 22px 0 18px -18px rgba(
|
|
3517
|
-
--wds-shadow-inner-400-left: 32px 0 24px -24px rgba(
|
|
3518
|
-
--wds-shadow-inner-400-right: -32px 0 24px -24px rgba(
|
|
3519
|
-
--wds-shadow-inner-400-top: 0 32px 24px -24px rgba(
|
|
3520
|
-
--wds-shadow-inner-400-vertical: 0
|
|
3509
|
+
--wds-shadow-inner-100: 1px 1px 2px rgba(0, 0, 0, .1) inset, 1px 1px 2px rgba(0, 0, 0, .1);
|
|
3510
|
+
--wds-shadow-inner-200: 1px 1px 4px rgba(0, 0, 0, .2) inset;
|
|
3511
|
+
--wds-shadow-inner-300: 0 0 18px rgba(0, 0, 0, .1) inset, 0 0 6px rgba(0, 0, 0, .05) inset;
|
|
3512
|
+
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px rgba(0, 0, 0, .1) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3513
|
+
--wds-shadow-inner-300-horizontal: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset, -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3514
|
+
--wds-shadow-inner-300-left: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3515
|
+
--wds-shadow-inner-300-right: -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3516
|
+
--wds-shadow-inner-300-top: 0 0 0;
|
|
3517
|
+
--wds-shadow-inner-300-vertical: 0;
|
|
3518
|
+
--wds-shadow-inner-400: 0 0 24px rgba(0, 0, 0, .2) inset, 0 0 6px rgba(0, 0, 0, .05) inset;
|
|
3519
|
+
--wds-shadow-inner-400-bottom: 0 -32px 24px -24px rgba(0, 0, 0, .2) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3520
|
+
--wds-shadow-inner-400-horizontal: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset, -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3521
|
+
--wds-shadow-inner-400-left: 32px 0 24px -24px rgba(0, 0, 0, .2) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3522
|
+
--wds-shadow-inner-400-right: -32px 0 24px -24px rgba(0, 0, 0, .2) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3523
|
+
--wds-shadow-inner-400-top: 0 32px 24px -24px rgba(0, 0, 0, .2) inset, 0 8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3524
|
+
--wds-shadow-inner-400-vertical: 0 0 0, 0 -22px 18px -18px rgba(0, 0, 0, .1) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
3521
3525
|
--wds-shadow-spread-secondary-raised: -0.70;
|
|
3522
|
-
--wds-shadow-surface-modal: 2px 20px 30px rgba(
|
|
3523
|
-
--wds-shadow-surface-overlay: 0 12px 30px 0 rgba(
|
|
3524
|
-
--wds-shadow-surface-overlay-dark: 0 12px 30px 0 rgba(
|
|
3525
|
-
--wds-shadow-surface-raised: 0 2px 4px rgba(
|
|
3526
|
+
--wds-shadow-surface-modal: 2px 20px 30px rgba(0, 0, 0, .3), 0 0px 0px rgba(0, 0, 0, .3);
|
|
3527
|
+
--wds-shadow-surface-overlay: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
3528
|
+
--wds-shadow-surface-overlay-dark: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
3529
|
+
--wds-shadow-surface-raised: 0 2px 4px rgba(0, 0, 0, .05), 0 0 6px rgba(0, 0, 0, .1);
|
|
3526
3530
|
--wds-shadow-x-0: 0px;
|
|
3527
3531
|
--wds-shadow-x-25: 1px;
|
|
3528
3532
|
--wds-shadow-x-50: 2px;
|
|
@@ -3591,6 +3595,7 @@
|
|
|
3591
3595
|
--wds-sidebar-divider-fill-light-default: #666565;
|
|
3592
3596
|
--wds-sidebar-divider-fill-neutral-default: #666565;
|
|
3593
3597
|
--wds-sidebar-header-margin-bottom: 12px;
|
|
3598
|
+
--wds-sidebar-header-text-dark-default: #FFFFFF;
|
|
3594
3599
|
--wds-sidebar-item-content-gap: 8px;
|
|
3595
3600
|
--wds-sidebar-item-level-1-fill-dark-active: #42454c;
|
|
3596
3601
|
--wds-sidebar-item-level-1-fill-dark-default: #131720;
|
|
@@ -3623,7 +3628,7 @@
|
|
|
3623
3628
|
--wds-sidebar-item-minimized-paddings-vertical: 8px;
|
|
3624
3629
|
--wds-sidebar-item-prefix-padding-end: 12px;
|
|
3625
3630
|
--wds-sidebar-item-text-dark-active: #2C2D30;
|
|
3626
|
-
--wds-sidebar-item-text-dark-default: #
|
|
3631
|
+
--wds-sidebar-item-text-dark-default: #FFFFFF;
|
|
3627
3632
|
--wds-sidebar-item-text-dark-disabled: #898b8f;
|
|
3628
3633
|
--wds-sidebar-item-text-light-active: #E0E7FF;
|
|
3629
3634
|
--wds-sidebar-item-text-light-default: #D4D3D2;
|
|
@@ -3875,7 +3880,7 @@
|
|
|
3875
3880
|
--wds-toggle-button-label-fill-dark-selected: #FFFFFF;
|
|
3876
3881
|
--wds-toggle-button-label-fill-dark-selected-disabled: #878685;
|
|
3877
3882
|
--wds-toggle-button-label-fill-dark-selected-hover: #FFFFFF;
|
|
3878
|
-
--wds-toggle-button-label-fill-inverted: #FFFFFF;
|
|
3883
|
+
--wds-toggle-button-label-fill-inverted-default: #FFFFFF;
|
|
3879
3884
|
--wds-toggle-button-label-fill-inverted-disabled: #878685;
|
|
3880
3885
|
--wds-toggle-button-label-fill-inverted-hover: #FFFFFF;
|
|
3881
3886
|
--wds-toggle-button-label-fill-inverted-selected: #FFFFFF;
|
|
@@ -3980,6 +3985,7 @@
|
|
|
3980
3985
|
--wds-tooltip-padding-vertical-small: 6px;
|
|
3981
3986
|
--wds-tooltip-shadow: rgba(255, 255, 255, 0);
|
|
3982
3987
|
--wds-tooltip-text-fill: #2C2D30;
|
|
3988
|
+
--wds-top-banner-fill: #d7b7fb;
|
|
3983
3989
|
--wds-variable-input-padding-vertical-small: 5px;
|
|
3984
3990
|
--wds-variable-input-padding-vertical-tiny: 2px;
|
|
3985
3991
|
--wds-vertical-tabs-action-padding-horizontal-medium: 24px;
|
|
@@ -895,6 +895,7 @@
|
|
|
895
895
|
@property st-global(--wds-sidebar-divider-fill-light-default);
|
|
896
896
|
@property st-global(--wds-sidebar-divider-fill-neutral-default);
|
|
897
897
|
@property st-global(--wds-sidebar-header-margin-bottom);
|
|
898
|
+
@property st-global(--wds-sidebar-header-text-dark-default);
|
|
898
899
|
@property st-global(--wds-sidebar-item-content-gap);
|
|
899
900
|
@property st-global(--wds-sidebar-item-level-1-fill-dark-active);
|
|
900
901
|
@property st-global(--wds-sidebar-item-level-1-fill-dark-default);
|
|
@@ -1134,7 +1135,7 @@
|
|
|
1134
1135
|
@property st-global(--wds-toggle-button-label-fill-dark-selected);
|
|
1135
1136
|
@property st-global(--wds-toggle-button-label-fill-dark-selected-disabled);
|
|
1136
1137
|
@property st-global(--wds-toggle-button-label-fill-dark-selected-hover);
|
|
1137
|
-
@property st-global(--wds-toggle-button-label-fill-inverted);
|
|
1138
|
+
@property st-global(--wds-toggle-button-label-fill-inverted-default);
|
|
1138
1139
|
@property st-global(--wds-toggle-button-label-fill-inverted-disabled);
|
|
1139
1140
|
@property st-global(--wds-toggle-button-label-fill-inverted-hover);
|
|
1140
1141
|
@property st-global(--wds-toggle-button-label-fill-inverted-selected);
|
|
@@ -1239,6 +1240,7 @@
|
|
|
1239
1240
|
@property st-global(--wds-tooltip-padding-vertical-small);
|
|
1240
1241
|
@property st-global(--wds-tooltip-shadow);
|
|
1241
1242
|
@property st-global(--wds-tooltip-text-fill);
|
|
1243
|
+
@property st-global(--wds-top-banner-fill);
|
|
1242
1244
|
@property st-global(--wds-variable-input-padding-vertical-small);
|
|
1243
1245
|
@property st-global(--wds-variable-input-padding-vertical-tiny);
|
|
1244
1246
|
@property st-global(--wds-vertical-tabs-action-padding-horizontal-medium);
|
|
@@ -1544,7 +1546,7 @@
|
|
|
1544
1546
|
--wds-card-tab-padding-horizontal-small: 20px;
|
|
1545
1547
|
--wds-card-tab-padding-vertical-medium: 16px;
|
|
1546
1548
|
--wds-card-tab-padding-vertical-small: 16px;
|
|
1547
|
-
--wds-carousel-controls-shadow: 0 9 20px
|
|
1549
|
+
--wds-carousel-controls-shadow: 0 9 20px rgba(0, 0, 0, .3), 0 0px 0px rgba(255, 255, 255, 0);
|
|
1548
1550
|
--wds-carousel-dots-width: 4px;
|
|
1549
1551
|
--wds-checkbox-border: #D4D3D2;
|
|
1550
1552
|
--wds-checkbox-border-active: #82B0FF;
|
|
@@ -2206,6 +2208,7 @@
|
|
|
2206
2208
|
--wds-sidebar-divider-fill-light-default: #666565;
|
|
2207
2209
|
--wds-sidebar-divider-fill-neutral-default: #666565;
|
|
2208
2210
|
--wds-sidebar-header-margin-bottom: 12px;
|
|
2211
|
+
--wds-sidebar-header-text-dark-default: #FFFFFF;
|
|
2209
2212
|
--wds-sidebar-item-content-gap: 8px;
|
|
2210
2213
|
--wds-sidebar-item-level-1-fill-dark-active: #42454c;
|
|
2211
2214
|
--wds-sidebar-item-level-1-fill-dark-default: #131720;
|
|
@@ -2238,7 +2241,7 @@
|
|
|
2238
2241
|
--wds-sidebar-item-minimized-paddings-vertical: 8px;
|
|
2239
2242
|
--wds-sidebar-item-prefix-padding-end: 12px;
|
|
2240
2243
|
--wds-sidebar-item-text-dark-active: #2C2D30;
|
|
2241
|
-
--wds-sidebar-item-text-dark-default: #
|
|
2244
|
+
--wds-sidebar-item-text-dark-default: #FFFFFF;
|
|
2242
2245
|
--wds-sidebar-item-text-dark-disabled: #898b8f;
|
|
2243
2246
|
--wds-sidebar-item-text-light-active: #E0E7FF;
|
|
2244
2247
|
--wds-sidebar-item-text-light-default: #D4D3D2;
|
|
@@ -2445,7 +2448,7 @@
|
|
|
2445
2448
|
--wds-toggle-button-label-fill-dark-selected: #FFFFFF;
|
|
2446
2449
|
--wds-toggle-button-label-fill-dark-selected-disabled: #878685;
|
|
2447
2450
|
--wds-toggle-button-label-fill-dark-selected-hover: #FFFFFF;
|
|
2448
|
-
--wds-toggle-button-label-fill-inverted: #FFFFFF;
|
|
2451
|
+
--wds-toggle-button-label-fill-inverted-default: #FFFFFF;
|
|
2449
2452
|
--wds-toggle-button-label-fill-inverted-disabled: #878685;
|
|
2450
2453
|
--wds-toggle-button-label-fill-inverted-hover: #FFFFFF;
|
|
2451
2454
|
--wds-toggle-button-label-fill-inverted-selected: #FFFFFF;
|
|
@@ -2550,6 +2553,7 @@
|
|
|
2550
2553
|
--wds-tooltip-padding-vertical-small: 6px;
|
|
2551
2554
|
--wds-tooltip-shadow: rgba(255, 255, 255, 0);
|
|
2552
2555
|
--wds-tooltip-text-fill: #2C2D30;
|
|
2556
|
+
--wds-top-banner-fill: #d7b7fb;
|
|
2553
2557
|
--wds-variable-input-padding-vertical-small: 5px;
|
|
2554
2558
|
--wds-variable-input-padding-vertical-tiny: 2px;
|
|
2555
2559
|
--wds-vertical-tabs-action-padding-horizontal-medium: 24px;
|
|
@@ -63,6 +63,7 @@
|
|
|
63
63
|
@property st-global(--wds-color-blue-200);
|
|
64
64
|
@property st-global(--wds-color-blue-250);
|
|
65
65
|
@property st-global(--wds-color-blue-300);
|
|
66
|
+
@property st-global(--wds-color-blue-350);
|
|
66
67
|
@property st-global(--wds-color-blue-400);
|
|
67
68
|
@property st-global(--wds-color-blue-500);
|
|
68
69
|
@property st-global(--wds-color-blue-600);
|
|
@@ -295,6 +296,7 @@
|
|
|
295
296
|
--wds-color-blue-200: #6F94D4;
|
|
296
297
|
--wds-color-blue-250: #5B78A9;
|
|
297
298
|
--wds-color-blue-300: #485B7E;
|
|
299
|
+
--wds-color-blue-350: #40506C;
|
|
298
300
|
--wds-color-blue-400: #343F53;
|
|
299
301
|
--wds-color-blue-500: #212328;
|
|
300
302
|
--wds-color-blue-600: #111214;
|
|
@@ -383,10 +385,10 @@
|
|
|
383
385
|
--wds-font-weight-medium: 500;
|
|
384
386
|
--wds-font-weight-regular: 400;
|
|
385
387
|
--wds-font-weight-semi-bold: 600;
|
|
386
|
-
--wds-shadow-100: 0 2px 1px rgba(
|
|
387
|
-
--wds-shadow-200: 0 2px 4px rgba(
|
|
388
|
-
--wds-shadow-300: 0 12px 30px 0 rgba(
|
|
389
|
-
--wds-shadow-400: 0 8px 8px rgba(
|
|
388
|
+
--wds-shadow-100: 0 2px 1px rgba(0, 0, 0, .5), 0 0 3px rgba(0, 0, 0, .1);
|
|
389
|
+
--wds-shadow-200: 0 2px 4px rgba(0, 0, 0, .05), 0 0 6px rgba(0, 0, 0, .1);
|
|
390
|
+
--wds-shadow-300: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
391
|
+
--wds-shadow-400: 0 8px 8px rgba(0, 0, 0, .1), 0 3px 24px rgba(0, 0, 0, .2);
|
|
390
392
|
--wds-shadow-blur-0: 0px;
|
|
391
393
|
--wds-shadow-blur-25: 2px;
|
|
392
394
|
--wds-shadow-blur-35: 3px;
|
|
@@ -400,22 +402,22 @@
|
|
|
400
402
|
--wds-shadow-blur-400: 20px;
|
|
401
403
|
--wds-shadow-blur-500: 20px;
|
|
402
404
|
--wds-shadow-blur-800: 30px;
|
|
403
|
-
--wds-shadow-inner-100: 1px 1px 2px rgba(
|
|
404
|
-
--wds-shadow-inner-200: 1px 1px 4px rgba(
|
|
405
|
-
--wds-shadow-inner-300: 0 0 18px rgba(
|
|
406
|
-
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px rgba(
|
|
407
|
-
--wds-shadow-inner-300-horizontal: 22px 0 18px -18px rgba(
|
|
408
|
-
--wds-shadow-inner-300-left: 22px 0 18px -18px rgba(
|
|
409
|
-
--wds-shadow-inner-300-right: -22px 0 18px -18px rgba(
|
|
410
|
-
--wds-shadow-inner-300-top: 0
|
|
411
|
-
--wds-shadow-inner-300-vertical: 0
|
|
412
|
-
--wds-shadow-inner-400: 0 0 24px rgba(
|
|
413
|
-
--wds-shadow-inner-400-bottom: 0 -32px 24px -24px rgba(
|
|
414
|
-
--wds-shadow-inner-400-horizontal: 22px 0 18px -18px rgba(
|
|
415
|
-
--wds-shadow-inner-400-left: 32px 0 24px -24px rgba(
|
|
416
|
-
--wds-shadow-inner-400-right: -32px 0 24px -24px rgba(
|
|
417
|
-
--wds-shadow-inner-400-top: 0 32px 24px -24px rgba(
|
|
418
|
-
--wds-shadow-inner-400-vertical: 0
|
|
405
|
+
--wds-shadow-inner-100: 1px 1px 2px rgba(0, 0, 0, .1) inset, 1px 1px 2px rgba(0, 0, 0, .1);
|
|
406
|
+
--wds-shadow-inner-200: 1px 1px 4px rgba(0, 0, 0, .2) inset;
|
|
407
|
+
--wds-shadow-inner-300: 0 0 18px rgba(0, 0, 0, .1) inset, 0 0 6px rgba(0, 0, 0, .05) inset;
|
|
408
|
+
--wds-shadow-inner-300-bottom: 0 -22px 18px -18px rgba(0, 0, 0, .1) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
409
|
+
--wds-shadow-inner-300-horizontal: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset, -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
410
|
+
--wds-shadow-inner-300-left: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
411
|
+
--wds-shadow-inner-300-right: -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
412
|
+
--wds-shadow-inner-300-top: 0 0 0;
|
|
413
|
+
--wds-shadow-inner-300-vertical: 0;
|
|
414
|
+
--wds-shadow-inner-400: 0 0 24px rgba(0, 0, 0, .2) inset, 0 0 6px rgba(0, 0, 0, .05) inset;
|
|
415
|
+
--wds-shadow-inner-400-bottom: 0 -32px 24px -24px rgba(0, 0, 0, .2) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
416
|
+
--wds-shadow-inner-400-horizontal: 22px 0 18px -18px rgba(0, 0, 0, .1) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset, -22px 0 18px -18px rgba(0, 0, 0, .1) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
417
|
+
--wds-shadow-inner-400-left: 32px 0 24px -24px rgba(0, 0, 0, .2) inset, 8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
418
|
+
--wds-shadow-inner-400-right: -32px 0 24px -24px rgba(0, 0, 0, .2) inset, -8px 0 6px -6px rgba(0, 0, 0, .05) inset;
|
|
419
|
+
--wds-shadow-inner-400-top: 0 32px 24px -24px rgba(0, 0, 0, .2) inset, 0 8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
420
|
+
--wds-shadow-inner-400-vertical: 0 0 0, 0 -22px 18px -18px rgba(0, 0, 0, .1) inset, 0 -8px 6px -6px rgba(0, 0, 0, .05) inset;
|
|
419
421
|
--wds-shadow-x-0: 0px;
|
|
420
422
|
--wds-shadow-x-25: 1px;
|
|
421
423
|
--wds-shadow-x-50: 2px;
|
|
@@ -883,10 +883,10 @@
|
|
|
883
883
|
--wds-inner-shadow-blur-input: 3px;
|
|
884
884
|
--wds-inner-shadow-blur-primary: 2px;
|
|
885
885
|
--wds-inner-shadow-blur-secondary: 2px;
|
|
886
|
-
--wds-inner-shadow-fill-input:
|
|
887
|
-
--wds-inner-shadow-fill-primary: #
|
|
888
|
-
--wds-inner-shadow-fill-secondary: #
|
|
889
|
-
--wds-inner-shadow-fill-track: rgba(
|
|
886
|
+
--wds-inner-shadow-fill-input: #111214;
|
|
887
|
+
--wds-inner-shadow-fill-primary: #111214;
|
|
888
|
+
--wds-inner-shadow-fill-secondary: #111214;
|
|
889
|
+
--wds-inner-shadow-fill-track: rgba(0, 0, 0, .2);
|
|
890
890
|
--wds-inner-shadow-x-input: 1px;
|
|
891
891
|
--wds-inner-shadow-x-primary: 1px;
|
|
892
892
|
--wds-inner-shadow-x-secondary: 1px;
|
|
@@ -907,23 +907,23 @@
|
|
|
907
907
|
--wds-shadow-blur-secondary-toggle: 0px;
|
|
908
908
|
--wds-shadow-blur-secondary-toggle-button: 1.7px;
|
|
909
909
|
--wds-shadow-blur-tertiary-toggle-button: 0.6px;
|
|
910
|
-
--wds-shadow-fill-input: rgba(
|
|
911
|
-
--wds-shadow-fill-primary-modal:
|
|
912
|
-
--wds-shadow-fill-primary-overlay:
|
|
913
|
-
--wds-shadow-fill-primary-overlay-dark:
|
|
914
|
-
--wds-shadow-fill-primary-raised:
|
|
910
|
+
--wds-shadow-fill-input: rgba(0, 0, 0, .2);
|
|
911
|
+
--wds-shadow-fill-primary-modal: rgba(0, 0, 0, .3);
|
|
912
|
+
--wds-shadow-fill-primary-overlay: rgba(0, 0, 0, .3);
|
|
913
|
+
--wds-shadow-fill-primary-overlay-dark: rgba(0, 0, 0, .3);
|
|
914
|
+
--wds-shadow-fill-primary-raised: rgba(0, 0, 0, .3);
|
|
915
915
|
--wds-shadow-fill-primary-slider: rgba(255, 255, 255, 0);
|
|
916
916
|
--wds-shadow-fill-primary-toggle: rgba(255, 255, 255, 0);
|
|
917
917
|
--wds-shadow-fill-primary-toggle-button: rgba(255, 255, 255, 0);
|
|
918
918
|
--wds-shadow-fill-quaternary-raised: rgba(255, 255, 255, 0);
|
|
919
919
|
--wds-shadow-fill-secondary-modal: rgba(255, 255, 255, 0);
|
|
920
|
-
--wds-shadow-fill-secondary-overlay:
|
|
921
|
-
--wds-shadow-fill-secondary-overlay-dark: rgba(
|
|
922
|
-
--wds-shadow-fill-secondary-raised:
|
|
920
|
+
--wds-shadow-fill-secondary-overlay: rgba(0, 0, 0, .3);
|
|
921
|
+
--wds-shadow-fill-secondary-overlay-dark: rgba(0, 0, 0, .2);
|
|
922
|
+
--wds-shadow-fill-secondary-raised: rgba(0, 0, 0, .1);
|
|
923
923
|
--wds-shadow-fill-secondary-toggle: rgba(255, 255, 255, 0);
|
|
924
|
-
--wds-shadow-fill-secondary-toggle-button: #
|
|
924
|
+
--wds-shadow-fill-secondary-toggle-button: #111214;
|
|
925
925
|
--wds-shadow-fill-tertiary-raised: rgba(255, 255, 255, 0);
|
|
926
|
-
--wds-shadow-fill-tertiary-toggle-button: #
|
|
926
|
+
--wds-shadow-fill-tertiary-toggle-button: #212328;
|
|
927
927
|
--wds-shadow-focus-destructive: 0 0 0 #A6464B;
|
|
928
928
|
--wds-shadow-focus-inner-destructive: 0 0 0 3px #A6464B inset;
|
|
929
929
|
--wds-shadow-focus-inner-standard: 0 0 0 3px #485B7E inset;
|
|
@@ -932,10 +932,10 @@
|
|
|
932
932
|
--wds-shadow-focus-standard: 0 0 0 3px #485B7E;
|
|
933
933
|
--wds-shadow-focus-warning: 0 0 0 #946933;
|
|
934
934
|
--wds-shadow-spread-secondary-raised: -0.70;
|
|
935
|
-
--wds-shadow-surface-modal: 2px 20px 30px rgba(
|
|
936
|
-
--wds-shadow-surface-overlay: 0 12px 30px 0 rgba(
|
|
937
|
-
--wds-shadow-surface-overlay-dark: 0 12px 30px 0 rgba(
|
|
938
|
-
--wds-shadow-surface-raised: 0 2px 4px rgba(
|
|
935
|
+
--wds-shadow-surface-modal: 2px 20px 30px rgba(0, 0, 0, .3), 0 0px 0px rgba(0, 0, 0, .3);
|
|
936
|
+
--wds-shadow-surface-overlay: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
937
|
+
--wds-shadow-surface-overlay-dark: 0 12px 30px 0 rgba(0, 0, 0, .3), 0 0px 0px 0 rgba(0, 0, 0, .3);
|
|
938
|
+
--wds-shadow-surface-raised: 0 2px 4px rgba(0, 0, 0, .05), 0 0 6px rgba(0, 0, 0, .1);
|
|
939
939
|
--wds-shadow-x-input: 1px;
|
|
940
940
|
--wds-shadow-x-primary-modal: 0px;
|
|
941
941
|
--wds-shadow-x-primary-toggle-button: 1px;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wix/design-system-tokens",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.164.0",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"build": "cp -r tokens/* .",
|
|
6
6
|
"figma-to-dictionary": "ts-node src/scripts/figma-to-dictionary.ts",
|
|
@@ -34,5 +34,5 @@
|
|
|
34
34
|
"author": "augustinasv@wix.com",
|
|
35
35
|
"description": "Design system tokens",
|
|
36
36
|
"packageManager": "yarn@3.5.0",
|
|
37
|
-
"falconPackageHash": "
|
|
37
|
+
"falconPackageHash": "a92314497551e6602d1be16e41ae5e683504c87717978ad2f1b827ce"
|
|
38
38
|
}
|
package/semantic.st.css
CHANGED
|
@@ -453,6 +453,7 @@
|
|
|
453
453
|
@property st-global(--wds-shadow-surface-overlay-dark);
|
|
454
454
|
@property st-global(--wds-shadow-surface-raised);
|
|
455
455
|
@property st-global(--wds-shadow-x-input);
|
|
456
|
+
@property st-global(--wds-shadow-x-primary-modal);
|
|
456
457
|
@property st-global(--wds-shadow-x-primary-toggle-button);
|
|
457
458
|
@property st-global(--wds-shadow-x-secondary-raised);
|
|
458
459
|
@property st-global(--wds-shadow-x-secondary-toggle-button);
|
|
@@ -944,6 +945,7 @@
|
|
|
944
945
|
--wds-shadow-surface-overlay-dark: 0 0 18px rgba(0, 6, 36, .1), 0 6px 6px rgba(0, 6, 36, .05);
|
|
945
946
|
--wds-shadow-surface-raised: 0 0 6px rgba(0, 6, 36, .1), 0 2px 4px rgba(0, 6, 36, .1);
|
|
946
947
|
--wds-shadow-x-input: 0px;
|
|
948
|
+
--wds-shadow-x-primary-modal: 0px;
|
|
947
949
|
--wds-shadow-x-primary-toggle-button: 0px;
|
|
948
950
|
--wds-shadow-x-secondary-raised: 0px;
|
|
949
951
|
--wds-shadow-x-secondary-toggle-button: 0px;
|