@spectrum-web-components/styles 0.14.0 → 0.15.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.
@@ -0,0 +1,48 @@
1
+ /*
2
+ Copyright 2022 Adobe. All rights reserved.
3
+ This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License. You may obtain a copy
5
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
6
+
7
+ Unless required by applicable law or agreed to in writing, software distributed under
8
+ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
+ OF ANY KIND, either express or implied. See the License for the specific language
10
+ governing permissions and limitations under the License.
11
+ */
12
+
13
+ :host {
14
+ --spectrum-checkbox-control-size-small: 14px;
15
+ --spectrum-checkbox-control-size-medium: 16px;
16
+ --spectrum-checkbox-control-size-large: 18px;
17
+ --spectrum-checkbox-control-size-extra-large: 20px;
18
+ --spectrum-checkbox-top-to-control-small: 5px;
19
+ --spectrum-checkbox-top-to-control-medium: 8px;
20
+ --spectrum-checkbox-top-to-control-large: 11px;
21
+ --spectrum-checkbox-top-to-control-extra-large: 14px;
22
+ --spectrum-radio-button-control-size-small: 14px;
23
+ --spectrum-radio-button-control-size-medium: 16px;
24
+ --spectrum-radio-button-control-size-large: 18px;
25
+ --spectrum-radio-button-control-size-extra-large: 20px;
26
+ --spectrum-radio-button-top-to-control-small: 5px;
27
+ --spectrum-radio-button-top-to-control-medium: 8px;
28
+ --spectrum-radio-button-top-to-control-large: 11px;
29
+ --spectrum-radio-button-top-to-control-extra-large: 14px;
30
+ --spectrum-switch-control-width-small: 25px;
31
+ --spectrum-switch-control-width-medium: 28px;
32
+ --spectrum-switch-control-width-large: 32px;
33
+ --spectrum-switch-control-width-extra-large: 35px;
34
+ --spectrum-switch-control-height-small: 14px;
35
+ --spectrum-switch-control-height-medium: 16px;
36
+ --spectrum-switch-control-height-large: 18px;
37
+ --spectrum-switch-control-height-extra-large: 20px;
38
+ --spectrum-switch-top-to-control-small: 5px;
39
+ --spectrum-switch-top-to-control-medium: 8px;
40
+ --spectrum-switch-top-to-control-large: 11px;
41
+ --spectrum-switch-top-to-control-extra-large: 14px;
42
+ --spectrum-corner-radius-75: 3px;
43
+ --spectrum-corner-radius-100: 6px;
44
+ --spectrum-corner-radius-200: 12px;
45
+ --spectrum-drop-shadow-x: 0px;
46
+ --spectrum-drop-shadow-y: 4px;
47
+ --spectrum-drop-shadow-blur: 16px;
48
+ }
@@ -0,0 +1,161 @@
1
+ /*
2
+ Copyright 2022 Adobe. All rights reserved.
3
+ This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License. You may obtain a copy
5
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
6
+
7
+ Unless required by applicable law or agreed to in writing, software distributed under
8
+ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
+ OF ANY KIND, either express or implied. See the License for the specific language
10
+ governing permissions and limitations under the License.
11
+ */
12
+
13
+ :host {
14
+ --spectrum-transparent-white-200: rgba(255, 255, 255, 0.1);
15
+ --spectrum-transparent-white-300: rgba(255, 255, 255, 0.25);
16
+ --spectrum-transparent-white-400: rgba(255, 255, 255, 0.4);
17
+ --spectrum-transparent-white-500: rgba(255, 255, 255, 0.55);
18
+ --spectrum-transparent-white-600: rgba(255, 255, 255, 0.7);
19
+ --spectrum-transparent-white-700: rgba(255, 255, 255, 0.8);
20
+ --spectrum-transparent-white-800: rgba(255, 255, 255, 0.9);
21
+ --spectrum-transparent-white-900: rgb(255, 255, 255);
22
+ --spectrum-transparent-black-200: rgba(0, 0, 0, 0.1);
23
+ --spectrum-transparent-black-300: rgba(0, 0, 0, 0.25);
24
+ --spectrum-transparent-black-400: rgba(0, 0, 0, 0.4);
25
+ --spectrum-transparent-black-500: rgba(0, 0, 0, 0.55);
26
+ --spectrum-transparent-black-600: rgba(0, 0, 0, 0.7);
27
+ --spectrum-transparent-black-700: rgba(0, 0, 0, 0.8);
28
+ --spectrum-transparent-black-800: rgba(0, 0, 0, 0.9);
29
+ --spectrum-transparent-black-900: rgb(0, 0, 0);
30
+ --spectrum-focus-ring-color: var(--spectrum-blue-800);
31
+ --spectrum-static-white-focus-ring-color: var(--spectrum-white);
32
+ --spectrum-static-black-focus-ring-color: var(--spectrum-black);
33
+ --spectrum-neutral-content-color-default: var(--spectrum-gray-800);
34
+ --spectrum-neutral-content-color-hover: var(--spectrum-gray-900);
35
+ --spectrum-neutral-content-color-down: var(--spectrum-gray-900);
36
+ --spectrum-neutral-content-color-key-focus: var(--spectrum-gray-900);
37
+ --spectrum-neutral-subdued-content-color-default: var(--spectrum-gray-700);
38
+ --spectrum-neutral-subdued-content-color-hover: var(--spectrum-gray-800);
39
+ --spectrum-neutral-subdued-content-color-down: var(--spectrum-gray-900);
40
+ --spectrum-neutral-subdued-content-color-key-focus: var(
41
+ --spectrum-gray-800
42
+ );
43
+ --spectrum-accent-content-color: var(--spectrum-accent-color-900);
44
+ --spectrum-accent-content-color-hover: var(--spectrum-accent-color-1000);
45
+ --spectrum-accent-content-color-down: var(--spectrum-accent-color-1100);
46
+ --spectrum-accent-content-color-key-focus: var(
47
+ --spectrum-accent-color-1000
48
+ );
49
+ --spectrum-negative-content-color: var(--spectrum-negative-color-900);
50
+ --spectrum-negative-content-color-hover: var(
51
+ --spectrum-negative-color-1000
52
+ );
53
+ --spectrum-negative-content-color-down: var(--spectrum-negative-color-1100);
54
+ --spectrum-negative-content-color-key-focus: var(
55
+ --spectrum-negative-color-1000
56
+ );
57
+ --spectrum-disabled-content-color: var(--spectrum-gray-400);
58
+ --spectrum-disabled-static-white-content-color: var(
59
+ --spectrum-transparent-white-500
60
+ );
61
+ --spectrum-disabled-static-black-content-color: var(
62
+ --spectrum-transparent-black-500
63
+ );
64
+ --spectrum-disabled-background-color: var(--spectrum-gray-200);
65
+ --spectrum-disabled-static-white-background-color: var(
66
+ --spectrum-transparent-white-200
67
+ );
68
+ --spectrum-disabled-static-black-background-color: var(
69
+ --spectrum-transparent-black-200
70
+ );
71
+ --spectrum-disabled-border-color: var(--spectrum-gray-300);
72
+ --spectrum-disabled-static-white-border-color: var(
73
+ --spectrum-transparent-white-300
74
+ );
75
+ --spectrum-disabled-static-black-border-color: var(
76
+ --spectrum-transparent-black-300
77
+ );
78
+ --spectrum-informative-color-100: var(--spectrum-blue-100);
79
+ --spectrum-informative-color-200: var(--spectrum-blue-200);
80
+ --spectrum-informative-color-300: var(--spectrum-blue-300);
81
+ --spectrum-informative-color-400: var(--spectrum-blue-400);
82
+ --spectrum-informative-color-500: var(--spectrum-blue-500);
83
+ --spectrum-informative-color-600: var(--spectrum-blue-600);
84
+ --spectrum-informative-color-700: var(--spectrum-blue-700);
85
+ --spectrum-informative-color-800: var(--spectrum-blue-800);
86
+ --spectrum-informative-color-900: var(--spectrum-blue-900);
87
+ --spectrum-informative-color-1000: var(--spectrum-blue-1000);
88
+ --spectrum-informative-color-1100: var(--spectrum-blue-1100);
89
+ --spectrum-informative-color-1200: var(--spectrum-blue-1200);
90
+ --spectrum-informative-color-1300: var(--spectrum-blue-1300);
91
+ --spectrum-informative-color-1400: var(--spectrum-blue-1400);
92
+ --spectrum-negative-color-100: var(--spectrum-red-100);
93
+ --spectrum-negative-color-200: var(--spectrum-red-200);
94
+ --spectrum-negative-color-300: var(--spectrum-red-300);
95
+ --spectrum-negative-color-400: var(--spectrum-red-400);
96
+ --spectrum-negative-color-500: var(--spectrum-red-500);
97
+ --spectrum-negative-color-600: var(--spectrum-red-600);
98
+ --spectrum-negative-color-700: var(--spectrum-red-700);
99
+ --spectrum-negative-color-800: var(--spectrum-red-800);
100
+ --spectrum-negative-color-900: var(--spectrum-red-900);
101
+ --spectrum-negative-color-1000: var(--spectrum-red-1000);
102
+ --spectrum-negative-color-1100: var(--spectrum-red-1100);
103
+ --spectrum-negative-color-1200: var(--spectrum-red-1200);
104
+ --spectrum-negative-color-1300: var(--spectrum-red-1300);
105
+ --spectrum-negative-color-1400: var(--spectrum-red-1400);
106
+ --spectrum-notice-color-100: var(--spectrum-orange-100);
107
+ --spectrum-notice-color-200: var(--spectrum-orange-200);
108
+ --spectrum-notice-color-300: var(--spectrum-orange-300);
109
+ --spectrum-notice-color-400: var(--spectrum-orange-400);
110
+ --spectrum-notice-color-500: var(--spectrum-orange-500);
111
+ --spectrum-notice-color-600: var(--spectrum-orange-600);
112
+ --spectrum-notice-color-700: var(--spectrum-orange-700);
113
+ --spectrum-notice-color-800: var(--spectrum-orange-800);
114
+ --spectrum-notice-color-900: var(--spectrum-orange-900);
115
+ --spectrum-notice-color-1000: var(--spectrum-orange-1000);
116
+ --spectrum-notice-color-1100: var(--spectrum-orange-1100);
117
+ --spectrum-notice-color-1200: var(--spectrum-orange-1200);
118
+ --spectrum-notice-color-1300: var(--spectrum-orange-1300);
119
+ --spectrum-notice-color-1400: var(--spectrum-orange-1400);
120
+ --spectrum-positive-color-100: var(--spectrum-green-100);
121
+ --spectrum-positive-color-200: var(--spectrum-green-200);
122
+ --spectrum-positive-color-300: var(--spectrum-green-300);
123
+ --spectrum-positive-color-400: var(--spectrum-green-400);
124
+ --spectrum-positive-color-500: var(--spectrum-green-500);
125
+ --spectrum-positive-color-600: var(--spectrum-green-600);
126
+ --spectrum-positive-color-700: var(--spectrum-green-700);
127
+ --spectrum-positive-color-800: var(--spectrum-green-800);
128
+ --spectrum-positive-color-900: var(--spectrum-green-900);
129
+ --spectrum-positive-color-1000: var(--spectrum-green-1000);
130
+ --spectrum-positive-color-1100: var(--spectrum-green-1100);
131
+ --spectrum-positive-color-1200: var(--spectrum-green-1200);
132
+ --spectrum-positive-color-1300: var(--spectrum-green-1300);
133
+ --spectrum-positive-color-1400: var(--spectrum-green-1400);
134
+ --spectrum-black: rgb(0, 0, 0);
135
+ --spectrum-white: rgb(255, 255, 255);
136
+ --spectrum-button-minimum-width-multiplier: 2.25;
137
+ --spectrum-divider-thickness-small: 1px;
138
+ --spectrum-divider-thickness-medium: 2px;
139
+ --spectrum-divider-thickness-large: 4px;
140
+ --spectrum-radio-button-selection-indicator: 4px;
141
+ --spectrum-android-elevation: 2dp;
142
+ --spectrum-spacing-50: 2px;
143
+ --spectrum-spacing-75: 4px;
144
+ --spectrum-spacing-100: 8px;
145
+ --spectrum-spacing-200: 12px;
146
+ --spectrum-spacing-300: 16px;
147
+ --spectrum-spacing-400: 24px;
148
+ --spectrum-spacing-500: 32px;
149
+ --spectrum-spacing-600: 40px;
150
+ --spectrum-spacing-700: 48px;
151
+ --spectrum-spacing-800: 64px;
152
+ --spectrum-spacing-900: 80px;
153
+ --spectrum-spacing-1000: 96px;
154
+ --spectrum-focus-ring-thickness: 2px;
155
+ --spectrum-focus-ring-gap: 2px;
156
+ --spectrum-border-width-200: 2px;
157
+ --spectrum-line-height-100: 1.3;
158
+ --spectrum-line-height-200: 1.5;
159
+ --spectrum-CJK-line-height-100: 1.5;
160
+ --spectrum-CJK-line-height-200: 1.7;
161
+ }
@@ -0,0 +1,140 @@
1
+ /*
2
+ Copyright 2022 Adobe. All rights reserved.
3
+ This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License. You may obtain a copy
5
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
6
+
7
+ Unless required by applicable law or agreed to in writing, software distributed under
8
+ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
+ OF ANY KIND, either express or implied. See the License for the specific language
10
+ governing permissions and limitations under the License.
11
+ */
12
+
13
+ :host {
14
+ --spectrum-component-pill-edge-to-visual-75: 13px;
15
+ --spectrum-component-pill-edge-to-visual-100: 17px;
16
+ --spectrum-component-pill-edge-to-visual-200: 22px;
17
+ --spectrum-component-pill-edge-to-visual-300: 27px;
18
+ --spectrum-component-pill-edge-to-visual-only-75: 5px;
19
+ --spectrum-component-pill-edge-to-visual-only-100: 9px;
20
+ --spectrum-component-pill-edge-to-visual-only-200: 13px;
21
+ --spectrum-component-pill-edge-to-visual-only-300: 16px;
22
+ --spectrum-component-pill-edge-to-text-75: 15px;
23
+ --spectrum-component-pill-edge-to-text-100: 20px;
24
+ --spectrum-component-pill-edge-to-text-200: 25px;
25
+ --spectrum-component-pill-edge-to-text-300: 30px;
26
+ --spectrum-component-edge-to-visual-50: 7px;
27
+ --spectrum-component-edge-to-visual-75: 9px;
28
+ --spectrum-component-edge-to-visual-100: 12px;
29
+ --spectrum-component-edge-to-visual-200: 16px;
30
+ --spectrum-component-edge-to-visual-300: 19px;
31
+ --spectrum-component-edge-to-visual-only-50: 4px;
32
+ --spectrum-component-edge-to-visual-only-75: 5px;
33
+ --spectrum-component-edge-to-visual-only-100: 9px;
34
+ --spectrum-component-edge-to-visual-only-200: 13px;
35
+ --spectrum-component-edge-to-visual-only-300: 16px;
36
+ --spectrum-component-edge-to-text-50: 10px;
37
+ --spectrum-component-edge-to-text-75: 11px;
38
+ --spectrum-component-edge-to-text-100: 15px;
39
+ --spectrum-component-edge-to-text-200: 19px;
40
+ --spectrum-component-edge-to-text-300: 22px;
41
+ --spectrum-component-height-50: 26px;
42
+ --spectrum-component-height-75: 30px;
43
+ --spectrum-component-height-100: 40px;
44
+ --spectrum-component-height-200: 50px;
45
+ --spectrum-component-height-300: 60px;
46
+ --spectrum-component-top-to-workflow-icon-50: 4px;
47
+ --spectrum-component-top-to-workflow-icon-75: 5px;
48
+ --spectrum-component-top-to-workflow-icon-100: 9px;
49
+ --spectrum-component-top-to-workflow-icon-200: 13px;
50
+ --spectrum-component-top-to-workflow-icon-300: 16px;
51
+ --spectrum-component-top-to-text-50: 4px;
52
+ --spectrum-component-top-to-text-75: 5px;
53
+ --spectrum-component-top-to-text-100: 8px;
54
+ --spectrum-component-top-to-text-200: 12px;
55
+ --spectrum-component-top-to-text-300: 15px;
56
+ --spectrum-component-bottom-to-text-50: 6px;
57
+ --spectrum-component-bottom-to-text-75: 7px;
58
+ --spectrum-component-bottom-to-text-100: 11px;
59
+ --spectrum-component-bottom-to-text-200: 14px;
60
+ --spectrum-component-bottom-to-text-300: 18px;
61
+ --spectrum-action-bar-height: 56px;
62
+ --spectrum-action-bar-top-to-item-counter: 16px;
63
+ --spectrum-action-button-edge-to-hold-icon-small: 3px;
64
+ --spectrum-action-button-edge-to-hold-icon-medium: 5px;
65
+ --spectrum-action-button-edge-to-hold-icon-large: 6px;
66
+ --spectrum-action-button-edge-to-hold-icon-extra-large: 7px;
67
+ --spectrum-field-label-text-to-asterisk-small: 5px;
68
+ --spectrum-field-label-text-to-asterisk-medium: 5px;
69
+ --spectrum-field-label-text-to-asterisk-large: 6px;
70
+ --spectrum-field-label-text-to-asterisk-extra-large: 6px;
71
+ --spectrum-field-label-top-to-asterisk-small: 11px;
72
+ --spectrum-field-label-top-to-asterisk-medium: 15px;
73
+ --spectrum-field-label-top-to-asterisk-large: 19px;
74
+ --spectrum-field-label-top-to-asterisk-extra-large: 24px;
75
+ --spectrum-field-label-top-margin-small: 0px;
76
+ --spectrum-field-label-top-margin-medium: 5px;
77
+ --spectrum-field-label-top-margin-large: 5px;
78
+ --spectrum-field-label-top-margin-extra-large: 5px;
79
+ --spectrum-help-text-top-to-workflow-icon-small: 5px;
80
+ --spectrum-help-text-top-to-workflow-icon-medium: 9px;
81
+ --spectrum-help-text-top-to-workflow-icon-large: 13px;
82
+ --spectrum-help-text-top-to-workflow-icon-extra-large: 16px;
83
+ --spectrum-in-line-alert-minimum-width: 360px;
84
+ --spectrum-progress-bar-minimum-width: 48px;
85
+ --spectrum-progress-bar-maximum-width: 768px;
86
+ --spectrum-progress-bar-thickness-small: 5px;
87
+ --spectrum-progress-bar-thickness-medium: 8px;
88
+ --spectrum-progress-bar-thickness-large: 10px;
89
+ --spectrum-progress-bar-thickness-extra-large: 13px;
90
+ --spectrum-progress-circle-size-small: 20px;
91
+ --spectrum-progress-circle-size-medium: 40px;
92
+ --spectrum-progress-circle-size-large: 80px;
93
+ --spectrum-progress-circle-thickness-small: 3px;
94
+ --spectrum-progress-circle-thickness-medium: 4px;
95
+ --spectrum-progress-circle-thickness-large: 5px;
96
+ --spectrum-status-light-dot-size-small: 8px;
97
+ --spectrum-status-light-dot-size-medium: 10px;
98
+ --spectrum-status-light-dot-size-large: 12px;
99
+ --spectrum-status-light-dot-size-extra-large: 12px;
100
+ --spectrum-status-light-top-to-dot-small: 11px;
101
+ --spectrum-status-light-top-to-dot-medium: 15px;
102
+ --spectrum-status-light-top-to-dot-large: 19px;
103
+ --spectrum-status-light-top-to-dot-extra-large: 24px;
104
+ --spectrum-toast-height: 56px;
105
+ --spectrum-toast-top-to-workflow-icon: 17px;
106
+ --spectrum-toast-top-to-text: 16px;
107
+ --spectrum-toast-bottom-to-text: 19px;
108
+ --spectrum-tooltip-width: 10px;
109
+ --spectrum-tooltip-height: 5px;
110
+ --spectrum-tooltip-maximum-width: 200px;
111
+ --spectrum-font-size-50: 13px;
112
+ --spectrum-font-size-75: 15px;
113
+ --spectrum-font-size-100: 17px;
114
+ --spectrum-font-size-200: 19px;
115
+ --spectrum-font-size-300: 22px;
116
+ --spectrum-font-size-400: 24px;
117
+ --spectrum-font-size-500: 27px;
118
+ --spectrum-font-size-600: 31px;
119
+ --spectrum-font-size-700: 34px;
120
+ --spectrum-font-size-800: 39px;
121
+ --spectrum-font-size-900: 44px;
122
+ --spectrum-font-size-1000: 49px;
123
+ --spectrum-font-size-1100: 55px;
124
+ --spectrum-font-size-1200: 62px;
125
+ --spectrum-font-size-1300: 70px;
126
+ --spectrum-workflow-icon-size-50: 18px;
127
+ --spectrum-workflow-icon-size-75: 20px;
128
+ --spectrum-workflow-icon-size-100: 22px;
129
+ --spectrum-workflow-icon-size-200: 24px;
130
+ --spectrum-workflow-icon-size-300: 28px;
131
+ --spectrum-text-to-visual-50: 8px;
132
+ --spectrum-text-to-visual-75: 9px;
133
+ --spectrum-text-to-visual-100: 10px;
134
+ --spectrum-text-to-visual-200: 11px;
135
+ --spectrum-text-to-visual-300: 13px;
136
+ --spectrum-text-to-control-75: 11px;
137
+ --spectrum-text-to-control-100: 13px;
138
+ --spectrum-text-to-control-200: 14px;
139
+ --spectrum-text-to-control-300: 16px;
140
+ }
@@ -0,0 +1,267 @@
1
+ /*
2
+ Copyright 2022 Adobe. All rights reserved.
3
+ This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License. You may obtain a copy
5
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
6
+
7
+ Unless required by applicable law or agreed to in writing, software distributed under
8
+ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
+ OF ANY KIND, either express or implied. See the License for the specific language
10
+ governing permissions and limitations under the License.
11
+ */
12
+
13
+ :host {
14
+ --spectrum-neutral-background-color-default: var(--spectrum-gray-800);
15
+ --spectrum-neutral-background-color-hover: var(--spectrum-gray-900);
16
+ --spectrum-neutral-background-color-down: var(--spectrum-gray-900);
17
+ --spectrum-neutral-background-color-key-focus: var(--spectrum-gray-900);
18
+ --spectrum-neutral-subdued-background-color-default: var(
19
+ --spectrum-gray-600
20
+ );
21
+ --spectrum-neutral-subdued-background-color-hover: var(--spectrum-gray-700);
22
+ --spectrum-neutral-subdued-background-color-down: var(--spectrum-gray-800);
23
+ --spectrum-neutral-subdued-background-color-key-focus: var(
24
+ --spectrum-gray-700
25
+ );
26
+ --spectrum-accent-background-color-default: var(
27
+ --spectrum-accent-color-900
28
+ );
29
+ --spectrum-accent-background-color-hover: var(--spectrum-accent-color-1000);
30
+ --spectrum-accent-background-color-down: var(--spectrum-accent-color-1100);
31
+ --spectrum-accent-background-color-key-focus: var(
32
+ --spectrum-accent-color-1000
33
+ );
34
+ --spectrum-informative-background-color-default: var(
35
+ --spectrum-informative-color-900
36
+ );
37
+ --spectrum-informative-background-color-hover: var(
38
+ --spectrum-informative-color-1000
39
+ );
40
+ --spectrum-informative-background-color-down: var(
41
+ --spectrum-informative-color-1100
42
+ );
43
+ --spectrum-informative-background-color-key-focus: var(
44
+ --spectrum-informative-color-1000
45
+ );
46
+ --spectrum-negative-background-color-default: var(
47
+ --spectrum-negative-color-900
48
+ );
49
+ --spectrum-negative-background-color-hover: var(
50
+ --spectrum-negative-color-1000
51
+ );
52
+ --spectrum-negative-background-color-down: var(
53
+ --spectrum-negative-color-1100
54
+ );
55
+ --spectrum-negative-background-color-key-focus: var(
56
+ --spectrum-negative-color-1000
57
+ );
58
+ --spectrum-positive-background-color-default: var(
59
+ --spectrum-positive-color-900
60
+ );
61
+ --spectrum-positive-background-color-hover: var(
62
+ --spectrum-positive-color-1000
63
+ );
64
+ --spectrum-positive-background-color-down: var(
65
+ --spectrum-positive-color-1100
66
+ );
67
+ --spectrum-positive-background-color-key-focus: var(
68
+ --spectrum-positive-color-1000
69
+ );
70
+ --spectrum-drop-shadow-color: rgba(0, 0, 0, 0.15);
71
+ --spectrum-background-base-color: var(--spectrum-gray-200);
72
+ --spectrum-background-layer-1-color: var(--spectrum-gray-100);
73
+ --spectrum-background-layer-2-color: var(--spectrum-gray-50);
74
+ --spectrum-gray-50: rgb(255, 255, 255);
75
+ --spectrum-gray-75: rgb(253, 253, 253);
76
+ --spectrum-gray-100: rgb(248, 248, 248);
77
+ --spectrum-gray-200: rgb(230, 230, 230);
78
+ --spectrum-gray-300: rgb(213, 213, 213);
79
+ --spectrum-gray-400: rgb(177, 177, 177);
80
+ --spectrum-gray-500: rgb(144, 144, 144);
81
+ --spectrum-gray-600: rgb(109, 109, 109);
82
+ --spectrum-gray-700: rgb(70, 70, 70);
83
+ --spectrum-gray-800: rgb(34, 34, 34);
84
+ --spectrum-gray-900: rgb(0, 0, 0);
85
+ --spectrum-red-100: rgb(255, 235, 231);
86
+ --spectrum-red-200: rgb(255, 221, 214);
87
+ --spectrum-red-300: rgb(255, 205, 195);
88
+ --spectrum-red-400: rgb(255, 183, 169);
89
+ --spectrum-red-500: rgb(255, 155, 136);
90
+ --spectrum-red-600: rgb(255, 124, 101);
91
+ --spectrum-red-700: rgb(247, 92, 70);
92
+ --spectrum-red-800: rgb(234, 56, 41);
93
+ --spectrum-red-900: rgb(211, 21, 16);
94
+ --spectrum-red-1000: rgb(180, 0, 0);
95
+ --spectrum-red-1100: rgb(147, 0, 0);
96
+ --spectrum-red-1200: rgb(116, 0, 0);
97
+ --spectrum-red-1300: rgb(89, 0, 0);
98
+ --spectrum-red-1400: rgb(67, 0, 0);
99
+ --spectrum-orange-100: rgb(255, 236, 204);
100
+ --spectrum-orange-200: rgb(255, 223, 173);
101
+ --spectrum-orange-300: rgb(253, 210, 145);
102
+ --spectrum-orange-400: rgb(255, 187, 99);
103
+ --spectrum-orange-500: rgb(255, 160, 55);
104
+ --spectrum-orange-600: rgb(246, 133, 17);
105
+ --spectrum-orange-700: rgb(228, 111, 0);
106
+ --spectrum-orange-800: rgb(203, 93, 0);
107
+ --spectrum-orange-900: rgb(177, 76, 0);
108
+ --spectrum-orange-1000: rgb(149, 61, 0);
109
+ --spectrum-orange-1100: rgb(122, 47, 0);
110
+ --spectrum-orange-1200: rgb(97, 35, 0);
111
+ --spectrum-orange-1300: rgb(73, 25, 1);
112
+ --spectrum-orange-1400: rgb(53, 18, 1);
113
+ --spectrum-yellow-100: rgb(251, 241, 152);
114
+ --spectrum-yellow-200: rgb(248, 231, 80);
115
+ --spectrum-yellow-300: rgb(248, 217, 4);
116
+ --spectrum-yellow-400: rgb(232, 198, 0);
117
+ --spectrum-yellow-500: rgb(215, 179, 0);
118
+ --spectrum-yellow-600: rgb(196, 159, 0);
119
+ --spectrum-yellow-700: rgb(176, 140, 0);
120
+ --spectrum-yellow-800: rgb(155, 120, 0);
121
+ --spectrum-yellow-900: rgb(133, 102, 0);
122
+ --spectrum-yellow-1000: rgb(112, 83, 0);
123
+ --spectrum-yellow-1100: rgb(91, 67, 0);
124
+ --spectrum-yellow-1200: rgb(72, 51, 0);
125
+ --spectrum-yellow-1300: rgb(54, 37, 0);
126
+ --spectrum-yellow-1400: rgb(40, 26, 0);
127
+ --spectrum-chartreuse-100: rgb(219, 252, 110);
128
+ --spectrum-chartreuse-200: rgb(203, 244, 67);
129
+ --spectrum-chartreuse-300: rgb(188, 233, 42);
130
+ --spectrum-chartreuse-400: rgb(170, 216, 22);
131
+ --spectrum-chartreuse-500: rgb(152, 197, 10);
132
+ --spectrum-chartreuse-600: rgb(135, 177, 3);
133
+ --spectrum-chartreuse-700: rgb(118, 156, 0);
134
+ --spectrum-chartreuse-800: rgb(103, 136, 0);
135
+ --spectrum-chartreuse-900: rgb(87, 116, 0);
136
+ --spectrum-chartreuse-1000: rgb(72, 96, 0);
137
+ --spectrum-chartreuse-1100: rgb(58, 77, 0);
138
+ --spectrum-chartreuse-1200: rgb(44, 59, 0);
139
+ --spectrum-chartreuse-1300: rgb(33, 44, 0);
140
+ --spectrum-chartreuse-1400: rgb(24, 31, 0);
141
+ --spectrum-celery-100: rgb(205, 252, 191);
142
+ --spectrum-celery-200: rgb(174, 246, 157);
143
+ --spectrum-celery-300: rgb(150, 238, 133);
144
+ --spectrum-celery-400: rgb(114, 224, 106);
145
+ --spectrum-celery-500: rgb(78, 207, 80);
146
+ --spectrum-celery-600: rgb(39, 187, 54);
147
+ --spectrum-celery-700: rgb(7, 167, 33);
148
+ --spectrum-celery-800: rgb(0, 145, 18);
149
+ --spectrum-celery-900: rgb(0, 124, 15);
150
+ --spectrum-celery-1000: rgb(0, 103, 15);
151
+ --spectrum-celery-1100: rgb(0, 83, 13);
152
+ --spectrum-celery-1200: rgb(0, 64, 10);
153
+ --spectrum-celery-1300: rgb(0, 48, 7);
154
+ --spectrum-celery-1400: rgb(0, 34, 5);
155
+ --spectrum-green-100: rgb(206, 248, 224);
156
+ --spectrum-green-200: rgb(173, 244, 206);
157
+ --spectrum-green-300: rgb(137, 236, 188);
158
+ --spectrum-green-400: rgb(103, 222, 168);
159
+ --spectrum-green-500: rgb(73, 204, 147);
160
+ --spectrum-green-600: rgb(47, 184, 128);
161
+ --spectrum-green-700: rgb(21, 164, 110);
162
+ --spectrum-green-800: rgb(0, 143, 93);
163
+ --spectrum-green-900: rgb(0, 122, 77);
164
+ --spectrum-green-1000: rgb(0, 101, 62);
165
+ --spectrum-green-1100: rgb(0, 81, 50);
166
+ --spectrum-green-1200: rgb(5, 63, 39);
167
+ --spectrum-green-1300: rgb(10, 46, 29);
168
+ --spectrum-green-1400: rgb(10, 32, 21);
169
+ --spectrum-seafoam-100: rgb(206, 247, 243);
170
+ --spectrum-seafoam-200: rgb(170, 241, 234);
171
+ --spectrum-seafoam-300: rgb(140, 233, 226);
172
+ --spectrum-seafoam-400: rgb(101, 218, 210);
173
+ --spectrum-seafoam-500: rgb(63, 201, 193);
174
+ --spectrum-seafoam-600: rgb(15, 181, 174);
175
+ --spectrum-seafoam-700: rgb(0, 161, 154);
176
+ --spectrum-seafoam-800: rgb(0, 140, 135);
177
+ --spectrum-seafoam-900: rgb(0, 119, 114);
178
+ --spectrum-seafoam-1000: rgb(0, 99, 95);
179
+ --spectrum-seafoam-1100: rgb(12, 79, 76);
180
+ --spectrum-seafoam-1200: rgb(18, 60, 58);
181
+ --spectrum-seafoam-1300: rgb(18, 44, 43);
182
+ --spectrum-seafoam-1400: rgb(15, 31, 30);
183
+ --spectrum-cyan-100: rgb(197, 248, 255);
184
+ --spectrum-cyan-200: rgb(164, 240, 255);
185
+ --spectrum-cyan-300: rgb(136, 231, 250);
186
+ --spectrum-cyan-400: rgb(96, 216, 243);
187
+ --spectrum-cyan-500: rgb(51, 197, 232);
188
+ --spectrum-cyan-600: rgb(18, 176, 218);
189
+ --spectrum-cyan-700: rgb(1, 156, 200);
190
+ --spectrum-cyan-800: rgb(0, 134, 180);
191
+ --spectrum-cyan-900: rgb(0, 113, 159);
192
+ --spectrum-cyan-1000: rgb(0, 93, 137);
193
+ --spectrum-cyan-1100: rgb(0, 74, 115);
194
+ --spectrum-cyan-1200: rgb(0, 57, 93);
195
+ --spectrum-cyan-1300: rgb(0, 42, 70);
196
+ --spectrum-cyan-1400: rgb(0, 30, 51);
197
+ --spectrum-blue-100: rgb(224, 242, 255);
198
+ --spectrum-blue-200: rgb(202, 232, 255);
199
+ --spectrum-blue-300: rgb(181, 222, 255);
200
+ --spectrum-blue-400: rgb(150, 206, 253);
201
+ --spectrum-blue-500: rgb(120, 187, 250);
202
+ --spectrum-blue-600: rgb(89, 167, 246);
203
+ --spectrum-blue-700: rgb(56, 146, 243);
204
+ --spectrum-blue-800: rgb(20, 122, 243);
205
+ --spectrum-blue-900: rgb(2, 101, 220);
206
+ --spectrum-blue-1000: rgb(0, 84, 182);
207
+ --spectrum-blue-1100: rgb(0, 68, 145);
208
+ --spectrum-blue-1200: rgb(0, 53, 113);
209
+ --spectrum-blue-1300: rgb(0, 39, 84);
210
+ --spectrum-blue-1400: rgb(0, 28, 60);
211
+ --spectrum-indigo-100: rgb(237, 238, 255);
212
+ --spectrum-indigo-200: rgb(224, 226, 255);
213
+ --spectrum-indigo-300: rgb(211, 213, 255);
214
+ --spectrum-indigo-400: rgb(193, 196, 255);
215
+ --spectrum-indigo-500: rgb(172, 175, 255);
216
+ --spectrum-indigo-600: rgb(149, 153, 255);
217
+ --spectrum-indigo-700: rgb(126, 132, 252);
218
+ --spectrum-indigo-800: rgb(104, 109, 244);
219
+ --spectrum-indigo-900: rgb(82, 88, 228);
220
+ --spectrum-indigo-1000: rgb(64, 70, 202);
221
+ --spectrum-indigo-1100: rgb(50, 54, 168);
222
+ --spectrum-indigo-1200: rgb(38, 41, 134);
223
+ --spectrum-indigo-1300: rgb(27, 30, 100);
224
+ --spectrum-indigo-1400: rgb(20, 22, 72);
225
+ --spectrum-purple-100: rgb(246, 235, 255);
226
+ --spectrum-purple-200: rgb(238, 221, 255);
227
+ --spectrum-purple-300: rgb(230, 208, 255);
228
+ --spectrum-purple-400: rgb(219, 187, 254);
229
+ --spectrum-purple-500: rgb(204, 164, 253);
230
+ --spectrum-purple-600: rgb(189, 139, 252);
231
+ --spectrum-purple-700: rgb(174, 114, 249);
232
+ --spectrum-purple-800: rgb(157, 87, 244);
233
+ --spectrum-purple-900: rgb(137, 61, 231);
234
+ --spectrum-purple-1000: rgb(115, 38, 211);
235
+ --spectrum-purple-1100: rgb(93, 19, 183);
236
+ --spectrum-purple-1200: rgb(71, 12, 148);
237
+ --spectrum-purple-1300: rgb(51, 16, 106);
238
+ --spectrum-purple-1400: rgb(35, 15, 73);
239
+ --spectrum-fuchsia-100: rgb(255, 233, 252);
240
+ --spectrum-fuchsia-200: rgb(255, 218, 250);
241
+ --spectrum-fuchsia-300: rgb(254, 199, 248);
242
+ --spectrum-fuchsia-400: rgb(251, 174, 246);
243
+ --spectrum-fuchsia-500: rgb(245, 146, 243);
244
+ --spectrum-fuchsia-600: rgb(237, 116, 237);
245
+ --spectrum-fuchsia-700: rgb(224, 85, 226);
246
+ --spectrum-fuchsia-800: rgb(205, 58, 206);
247
+ --spectrum-fuchsia-900: rgb(182, 34, 183);
248
+ --spectrum-fuchsia-1000: rgb(157, 3, 158);
249
+ --spectrum-fuchsia-1100: rgb(128, 0, 129);
250
+ --spectrum-fuchsia-1200: rgb(100, 6, 100);
251
+ --spectrum-fuchsia-1300: rgb(71, 14, 70);
252
+ --spectrum-fuchsia-1400: rgb(50, 13, 49);
253
+ --spectrum-magenta-100: rgb(255, 234, 241);
254
+ --spectrum-magenta-200: rgb(255, 220, 232);
255
+ --spectrum-magenta-300: rgb(255, 202, 221);
256
+ --spectrum-magenta-400: rgb(255, 178, 206);
257
+ --spectrum-magenta-500: rgb(255, 149, 189);
258
+ --spectrum-magenta-600: rgb(250, 119, 170);
259
+ --spectrum-magenta-700: rgb(239, 90, 152);
260
+ --spectrum-magenta-800: rgb(222, 61, 130);
261
+ --spectrum-magenta-900: rgb(200, 34, 105);
262
+ --spectrum-magenta-1000: rgb(173, 9, 85);
263
+ --spectrum-magenta-1100: rgb(142, 0, 69);
264
+ --spectrum-magenta-1200: rgb(112, 0, 55);
265
+ --spectrum-magenta-1300: rgb(84, 3, 42);
266
+ --spectrum-magenta-1400: rgb(60, 6, 29);
267
+ }