@lightspeed/design-system-css 31.0.1 → 32.0.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.css +170 -152
- package/dist/index.css.map +1 -1
- package/dist/vend-styles.css +170 -152
- package/package.json +1 -1
- package/src/vend-styles/components/DataTable/DataTable.scss +3 -3
- package/src/vend-styles/components/ProgressBar/ProgressBar.scss +1 -1
- package/src/vend-styles/components/TableList/TableList.scss +1 -1
- package/src/vend-styles/components/TableList/_TableList-ns.scss +1 -1
- package/src/vend-styles/utilities/sticky.scss +2 -2
- package/src/vend.ui/components/vd-action-bar/vd-action-bar-ns.scss +1 -1
- package/src/vend.ui/components/vd-avatar/vd-avatar.scss +1 -1
- package/src/vend.ui/components/vd-avatar-multi/vd-avatar-multi.scss +1 -1
- package/src/vend.ui/components/vd-badges/vd-id-badge/vd-id-badge.scss +2 -2
- package/src/vend.ui/components/vd-btn/vd-btn-panel.scss +2 -2
- package/src/vend.ui/components/vd-checkbox/vd-checkbox.scss +2 -2
- package/src/vend.ui/components/vd-dott/vd-dott.scss +6 -6
- package/src/vend.ui/components/vd-flag/vd-flag.scss +1 -1
- package/src/vend.ui/components/vd-input/vd-input-ns.scss +5 -5
- package/src/vend.ui/components/vd-lozenge/vd-lozenge.scss +1 -1
- package/src/vend.ui/components/vd-lozenge-group/vd-lozenge-group.scss +2 -2
- package/src/vend.ui/components/vd-overlay/vd-overlay-ns.scss +1 -1
- package/src/vend.ui/components/vd-popover/vd-popover.scss +1 -1
- package/src/vend.ui/components/vd-radio/vd-radio.scss +1 -1
- package/src/vend.ui/components/vd-scrollable/vd-scrollable.scss +1 -1
- package/src/vend.ui/components/vd-section/vd-section.scss +2 -2
- package/src/vend.ui/components/vd-segcontrol/vd-segcontrol.scss +1 -1
- package/src/vend.ui/components/vd-select/vd-select.scss +2 -2
- package/src/vend.ui/components/vd-switch/vd-switch.scss +2 -2
- package/src/vend.ui/components/vd-table/vd-table-ns.scss +1 -1
- package/src/vend.ui/styles/global/_helper-mixins.scss +1 -1
- package/src/vend.ui/styles/global/_misc.scss +1 -1
package/dist/vend-styles.css
CHANGED
@@ -22,10 +22,13 @@
|
|
22
22
|
--hs-color-bg-supplementary-default-rgb: 91, 131, 172;
|
23
23
|
--hs-color-bg-supplementary-soft: #3c6996;
|
24
24
|
--hs-color-bg-supplementary-strong: #284563;
|
25
|
+
--hs-color-border-go-default: #477bff;
|
25
26
|
--hs-color-border-neutral-inverted-soft: #e7e5e8;
|
26
27
|
--hs-color-border-neutral-inverted-strong: #c9c7ca;
|
27
28
|
--hs-color-border-neutral-soft: #27252a;
|
28
29
|
--hs-color-border-neutral-strong: #37353a;
|
30
|
+
--hs-color-border-no-default: #eb4f29;
|
31
|
+
--hs-color-border-success-default: #15bf20;
|
29
32
|
--hs-color-fg-go-default: #477bff;
|
30
33
|
--hs-color-fg-neutral-default: #e7e5e8;
|
31
34
|
--hs-color-fg-neutral-inverted-default: #0b0b0b;
|
@@ -33,44 +36,47 @@
|
|
33
36
|
--hs-color-fg-no-default: #eb4f29;
|
34
37
|
--hs-color-fg-success-default: #15bf20;
|
35
38
|
--hs-color-fg-supplementary-default: #5b83ac;
|
36
|
-
--hs-color-overlay-
|
39
|
+
--hs-color-overlay-neutral-strong: rgba(43, 54, 61, 0.6509803922);
|
37
40
|
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%23E7E5E8" points="10,0 0,10 20,10"/><polygon fill="%23E7E5E8" points="0,36 20,36 10,46 "/></svg>');
|
38
41
|
}
|
39
42
|
.vd-theme--use-dark-mode.vd-theme--unified {
|
40
|
-
--hs-color-bg-go-default: #
|
41
|
-
--hs-color-bg-go-default-rgb:
|
42
|
-
--hs-color-bg-go-highlight-default: rgba(
|
43
|
-
--hs-color-bg-go-soft: #
|
44
|
-
--hs-color-bg-go-strong: #
|
43
|
+
--hs-color-bg-go-default: #3a1afe;
|
44
|
+
--hs-color-bg-go-default-rgb: 58, 26, 254;
|
45
|
+
--hs-color-bg-go-highlight-default: rgba(134, 157, 255, 0.1607843137);
|
46
|
+
--hs-color-bg-go-soft: #4b59fd;
|
47
|
+
--hs-color-bg-go-strong: #2b13c7;
|
45
48
|
--hs-color-bg-neutral-backdrop: #161619;
|
46
49
|
--hs-color-bg-neutral-dark-default: black;
|
47
|
-
--hs-color-bg-neutral-edge: #
|
50
|
+
--hs-color-bg-neutral-edge: #1e1e21;
|
48
51
|
--hs-color-bg-neutral-inverted-backdrop: #f1f2f7;
|
49
52
|
--hs-color-bg-neutral-inverted-top: white;
|
50
53
|
--hs-color-bg-neutral-top: #242427;
|
51
54
|
--hs-color-bg-neutral-top-rgb: 36, 36, 39;
|
52
|
-
--hs-color-bg-no-default: #
|
53
|
-
--hs-color-bg-no-default-rgb:
|
54
|
-
--hs-color-bg-no-soft: #
|
55
|
-
--hs-color-bg-no-strong: #
|
56
|
-
--hs-color-bg-success-default: #
|
57
|
-
--hs-color-bg-supplementary-default: #
|
58
|
-
--hs-color-bg-supplementary-default-rgb:
|
59
|
-
--hs-color-bg-supplementary-soft: #
|
60
|
-
--hs-color-bg-supplementary-strong: #
|
55
|
+
--hs-color-bg-no-default: #ac1b18;
|
56
|
+
--hs-color-bg-no-default-rgb: 172, 27, 24;
|
57
|
+
--hs-color-bg-no-soft: #c83a31;
|
58
|
+
--hs-color-bg-no-strong: #850609;
|
59
|
+
--hs-color-bg-success-default: #18661e;
|
60
|
+
--hs-color-bg-supplementary-default: #365b85;
|
61
|
+
--hs-color-bg-supplementary-default-rgb: 54, 91, 133;
|
62
|
+
--hs-color-bg-supplementary-soft: #5177a2;
|
63
|
+
--hs-color-bg-supplementary-strong: #193f66;
|
64
|
+
--hs-color-border-go-default: #869dff;
|
61
65
|
--hs-color-border-neutral-inverted-soft: #e3e4e9;
|
62
|
-
--hs-color-border-neutral-inverted-strong: #
|
63
|
-
--hs-color-border-neutral-soft: #
|
64
|
-
--hs-color-border-neutral-strong: #
|
65
|
-
--hs-color-
|
66
|
-
--hs-color-
|
66
|
+
--hs-color-border-neutral-inverted-strong: #a4a4a8;
|
67
|
+
--hs-color-border-neutral-soft: #525256;
|
68
|
+
--hs-color-border-neutral-strong: #747478;
|
69
|
+
--hs-color-border-no-default: #f67a6c;
|
70
|
+
--hs-color-border-success-default: #6abb6a;
|
71
|
+
--hs-color-fg-go-default: #a9bbfc;
|
72
|
+
--hs-color-fg-neutral-default: #e3e4e9;
|
67
73
|
--hs-color-fg-neutral-inverted-default: #29292c;
|
68
74
|
--hs-color-fg-neutral-ondark-default: white;
|
69
75
|
--hs-color-fg-no-default: #fda396;
|
70
76
|
--hs-color-fg-success-default: #86d586;
|
71
77
|
--hs-color-fg-supplementary-default: #99c2f1;
|
72
|
-
--hs-color-overlay-
|
73
|
-
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%
|
78
|
+
--hs-color-overlay-neutral-strong: rgba(0, 0, 0, 0.5019607843);
|
79
|
+
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%23E3E4E9" points="10,0 0,10 20,10"/><polygon fill="%23E3E4E9" points="0,36 20,36 10,46 "/></svg>');
|
74
80
|
}
|
75
81
|
}
|
76
82
|
:root,
|
@@ -97,10 +103,13 @@
|
|
97
103
|
--hs-color-bg-supplementary-default-rgb: 50, 87, 125;
|
98
104
|
--hs-color-bg-supplementary-soft: #3c6996;
|
99
105
|
--hs-color-bg-supplementary-strong: #284563;
|
106
|
+
--hs-color-border-go-default: #3f32f5;
|
100
107
|
--hs-color-border-neutral-inverted-soft: #27252a;
|
101
108
|
--hs-color-border-neutral-inverted-strong: #37353a;
|
102
109
|
--hs-color-border-neutral-soft: #e7e5e8;
|
103
110
|
--hs-color-border-neutral-strong: #c9c7ca;
|
111
|
+
--hs-color-border-no-default: #bb2a1a;
|
112
|
+
--hs-color-border-success-default: #0e7b1d;
|
104
113
|
--hs-color-fg-go-default: #3f32f5;
|
105
114
|
--hs-color-fg-neutral-default: #27252a;
|
106
115
|
--hs-color-fg-neutral-inverted-default: #ffffff;
|
@@ -108,7 +117,7 @@
|
|
108
117
|
--hs-color-fg-no-default: #bb2a1a;
|
109
118
|
--hs-color-fg-success-default: #0e7b1d;
|
110
119
|
--hs-color-fg-supplementary-default: #32577d;
|
111
|
-
--hs-color-overlay-
|
120
|
+
--hs-color-overlay-neutral-strong: rgba(0, 0, 0, 0.3490196078);
|
112
121
|
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%2327252A" points="10,0 0,10 20,10"/><polygon fill="%2327252A" points="0,36 20,36 10,46 "/></svg>');
|
113
122
|
--vd-colour--solar: #E6B03D;
|
114
123
|
--vd-colour--mars: #ED6B44;
|
@@ -120,40 +129,43 @@
|
|
120
129
|
}
|
121
130
|
|
122
131
|
.vd-theme--unified, .vd-theme--light.vd-theme--unified {
|
123
|
-
--hs-color-bg-go-default: #
|
124
|
-
--hs-color-bg-go-default-rgb:
|
125
|
-
--hs-color-bg-go-highlight-default: rgba(
|
126
|
-
--hs-color-bg-go-soft: #
|
127
|
-
--hs-color-bg-go-strong: #
|
132
|
+
--hs-color-bg-go-default: #3a1afe;
|
133
|
+
--hs-color-bg-go-default-rgb: 58, 26, 254;
|
134
|
+
--hs-color-bg-go-highlight-default: rgba(185, 200, 252, 0.1607843137);
|
135
|
+
--hs-color-bg-go-soft: #4b59fd;
|
136
|
+
--hs-color-bg-go-strong: #2b13c7;
|
128
137
|
--hs-color-bg-neutral-backdrop: #f1f2f7;
|
129
|
-
--hs-color-bg-neutral-dark-default: #
|
138
|
+
--hs-color-bg-neutral-dark-default: #1e1e21;
|
130
139
|
--hs-color-bg-neutral-edge: #e3e4e9;
|
131
140
|
--hs-color-bg-neutral-inverted-backdrop: #161619;
|
132
|
-
--hs-color-bg-neutral-inverted-top: #
|
141
|
+
--hs-color-bg-neutral-inverted-top: #242427;
|
133
142
|
--hs-color-bg-neutral-top: white;
|
134
143
|
--hs-color-bg-neutral-top-rgb: 255, 255, 255;
|
135
144
|
--hs-color-bg-no-default: #ac1b18;
|
136
145
|
--hs-color-bg-no-default-rgb: 172, 27, 24;
|
137
146
|
--hs-color-bg-no-soft: #c83a31;
|
138
|
-
--hs-color-bg-no-strong: #
|
139
|
-
--hs-color-bg-success-default: #
|
140
|
-
--hs-color-bg-supplementary-default: #
|
141
|
-
--hs-color-bg-supplementary-default-rgb:
|
147
|
+
--hs-color-bg-no-strong: #850609;
|
148
|
+
--hs-color-bg-success-default: #18661e;
|
149
|
+
--hs-color-bg-supplementary-default: #365b85;
|
150
|
+
--hs-color-bg-supplementary-default-rgb: 54, 91, 133;
|
142
151
|
--hs-color-bg-supplementary-soft: #5177a2;
|
143
|
-
--hs-color-bg-supplementary-strong: #
|
144
|
-
--hs-color-border-
|
145
|
-
--hs-color-border-neutral-inverted-
|
146
|
-
--hs-color-border-neutral-
|
147
|
-
--hs-color-border-neutral-
|
148
|
-
--hs-color-
|
149
|
-
--hs-color-
|
152
|
+
--hs-color-bg-supplementary-strong: #193f66;
|
153
|
+
--hs-color-border-go-default: #4142fd;
|
154
|
+
--hs-color-border-neutral-inverted-soft: #3d3d41;
|
155
|
+
--hs-color-border-neutral-inverted-strong: #525256;
|
156
|
+
--hs-color-border-neutral-soft: #c9cacf;
|
157
|
+
--hs-color-border-neutral-strong: #98989c;
|
158
|
+
--hs-color-border-no-default: #ba2c25;
|
159
|
+
--hs-color-border-success-default: #257429;
|
160
|
+
--hs-color-fg-go-default: #3217e3;
|
161
|
+
--hs-color-fg-neutral-default: #1e1e21;
|
150
162
|
--hs-color-fg-neutral-inverted-default: white;
|
151
163
|
--hs-color-fg-neutral-ondark-default: white;
|
152
|
-
--hs-color-fg-no-default: #
|
153
|
-
--hs-color-fg-success-default: #
|
154
|
-
--hs-color-fg-supplementary-default: #
|
155
|
-
--hs-color-overlay-
|
156
|
-
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%
|
164
|
+
--hs-color-fg-no-default: #990108;
|
165
|
+
--hs-color-fg-success-default: #06560f;
|
166
|
+
--hs-color-fg-supplementary-default: #264b73;
|
167
|
+
--hs-color-overlay-neutral-strong: rgba(0, 0, 0, 0.5019607843);
|
168
|
+
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%231E1E21" points="10,0 0,10 20,10"/><polygon fill="%231E1E21" points="0,36 20,36 10,46 "/></svg>');
|
157
169
|
}
|
158
170
|
|
159
171
|
.vd-theme--dark {
|
@@ -179,10 +191,13 @@
|
|
179
191
|
--hs-color-bg-supplementary-default-rgb: 91, 131, 172;
|
180
192
|
--hs-color-bg-supplementary-soft: #3c6996;
|
181
193
|
--hs-color-bg-supplementary-strong: #284563;
|
194
|
+
--hs-color-border-go-default: #477bff;
|
182
195
|
--hs-color-border-neutral-inverted-soft: #e7e5e8;
|
183
196
|
--hs-color-border-neutral-inverted-strong: #c9c7ca;
|
184
197
|
--hs-color-border-neutral-soft: #27252a;
|
185
198
|
--hs-color-border-neutral-strong: #37353a;
|
199
|
+
--hs-color-border-no-default: #eb4f29;
|
200
|
+
--hs-color-border-success-default: #15bf20;
|
186
201
|
--hs-color-fg-go-default: #477bff;
|
187
202
|
--hs-color-fg-neutral-default: #e7e5e8;
|
188
203
|
--hs-color-fg-neutral-inverted-default: #0b0b0b;
|
@@ -190,44 +205,47 @@
|
|
190
205
|
--hs-color-fg-no-default: #eb4f29;
|
191
206
|
--hs-color-fg-success-default: #15bf20;
|
192
207
|
--hs-color-fg-supplementary-default: #5b83ac;
|
193
|
-
--hs-color-overlay-
|
208
|
+
--hs-color-overlay-neutral-strong: rgba(43, 54, 61, 0.6509803922);
|
194
209
|
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%23E7E5E8" points="10,0 0,10 20,10"/><polygon fill="%23E7E5E8" points="0,36 20,36 10,46 "/></svg>');
|
195
210
|
}
|
196
211
|
.vd-theme--dark.vd-theme--unified {
|
197
|
-
--hs-color-bg-go-default: #
|
198
|
-
--hs-color-bg-go-default-rgb:
|
199
|
-
--hs-color-bg-go-highlight-default: rgba(
|
200
|
-
--hs-color-bg-go-soft: #
|
201
|
-
--hs-color-bg-go-strong: #
|
212
|
+
--hs-color-bg-go-default: #3a1afe;
|
213
|
+
--hs-color-bg-go-default-rgb: 58, 26, 254;
|
214
|
+
--hs-color-bg-go-highlight-default: rgba(134, 157, 255, 0.1607843137);
|
215
|
+
--hs-color-bg-go-soft: #4b59fd;
|
216
|
+
--hs-color-bg-go-strong: #2b13c7;
|
202
217
|
--hs-color-bg-neutral-backdrop: #161619;
|
203
218
|
--hs-color-bg-neutral-dark-default: black;
|
204
|
-
--hs-color-bg-neutral-edge: #
|
219
|
+
--hs-color-bg-neutral-edge: #1e1e21;
|
205
220
|
--hs-color-bg-neutral-inverted-backdrop: #f1f2f7;
|
206
221
|
--hs-color-bg-neutral-inverted-top: white;
|
207
222
|
--hs-color-bg-neutral-top: #242427;
|
208
223
|
--hs-color-bg-neutral-top-rgb: 36, 36, 39;
|
209
|
-
--hs-color-bg-no-default: #
|
210
|
-
--hs-color-bg-no-default-rgb:
|
211
|
-
--hs-color-bg-no-soft: #
|
212
|
-
--hs-color-bg-no-strong: #
|
213
|
-
--hs-color-bg-success-default: #
|
214
|
-
--hs-color-bg-supplementary-default: #
|
215
|
-
--hs-color-bg-supplementary-default-rgb:
|
216
|
-
--hs-color-bg-supplementary-soft: #
|
217
|
-
--hs-color-bg-supplementary-strong: #
|
224
|
+
--hs-color-bg-no-default: #ac1b18;
|
225
|
+
--hs-color-bg-no-default-rgb: 172, 27, 24;
|
226
|
+
--hs-color-bg-no-soft: #c83a31;
|
227
|
+
--hs-color-bg-no-strong: #850609;
|
228
|
+
--hs-color-bg-success-default: #18661e;
|
229
|
+
--hs-color-bg-supplementary-default: #365b85;
|
230
|
+
--hs-color-bg-supplementary-default-rgb: 54, 91, 133;
|
231
|
+
--hs-color-bg-supplementary-soft: #5177a2;
|
232
|
+
--hs-color-bg-supplementary-strong: #193f66;
|
233
|
+
--hs-color-border-go-default: #869dff;
|
218
234
|
--hs-color-border-neutral-inverted-soft: #e3e4e9;
|
219
|
-
--hs-color-border-neutral-inverted-strong: #
|
220
|
-
--hs-color-border-neutral-soft: #
|
221
|
-
--hs-color-border-neutral-strong: #
|
222
|
-
--hs-color-
|
223
|
-
--hs-color-
|
235
|
+
--hs-color-border-neutral-inverted-strong: #a4a4a8;
|
236
|
+
--hs-color-border-neutral-soft: #525256;
|
237
|
+
--hs-color-border-neutral-strong: #747478;
|
238
|
+
--hs-color-border-no-default: #f67a6c;
|
239
|
+
--hs-color-border-success-default: #6abb6a;
|
240
|
+
--hs-color-fg-go-default: #a9bbfc;
|
241
|
+
--hs-color-fg-neutral-default: #e3e4e9;
|
224
242
|
--hs-color-fg-neutral-inverted-default: #29292c;
|
225
243
|
--hs-color-fg-neutral-ondark-default: white;
|
226
244
|
--hs-color-fg-no-default: #fda396;
|
227
245
|
--hs-color-fg-success-default: #86d586;
|
228
246
|
--hs-color-fg-supplementary-default: #99c2f1;
|
229
|
-
--hs-color-overlay-
|
230
|
-
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%
|
247
|
+
--hs-color-overlay-neutral-strong: rgba(0, 0, 0, 0.5019607843);
|
248
|
+
--hs-color-select-arrows-bg: url('data:image/svg+xml,<svg width="20" height="46" xmlns="http://www.w3.org/2000/svg"><polygon fill="%23E3E4E9" points="10,0 0,10 20,10"/><polygon fill="%23E3E4E9" points="0,36 20,36 10,46 "/></svg>');
|
231
249
|
}
|
232
250
|
|
233
251
|
body {
|
@@ -1154,10 +1172,10 @@ details,
|
|
1154
1172
|
position: relative;
|
1155
1173
|
}
|
1156
1174
|
.vd-select-container.vd-error .vd-select {
|
1157
|
-
border-color: var(--hs-color-
|
1175
|
+
border-color: var(--hs-color-border-no-default);
|
1158
1176
|
}
|
1159
1177
|
.vd-select-container.vd-error .vd-select:focus {
|
1160
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1178
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1161
1179
|
}
|
1162
1180
|
|
1163
1181
|
.vd-select {
|
@@ -1185,7 +1203,7 @@ details,
|
|
1185
1203
|
background-image: var(--hs-color-select-arrows-bg);
|
1186
1204
|
}
|
1187
1205
|
.vd-select::placeholder {
|
1188
|
-
color: var(--hs-color-
|
1206
|
+
color: var(--hs-color-fg-supplementary-default);
|
1189
1207
|
opacity: 1;
|
1190
1208
|
}
|
1191
1209
|
.vd-select:placeholder-shown {
|
@@ -1201,14 +1219,14 @@ details,
|
|
1201
1219
|
}
|
1202
1220
|
}
|
1203
1221
|
.vd-select:focus, .vd-select.vd-focus {
|
1204
|
-
border-color: var(--hs-color-
|
1205
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1222
|
+
border-color: var(--hs-color-border-go-default);
|
1223
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
1206
1224
|
}
|
1207
1225
|
.vd-select.vd-input--error, .vd-select.vd-error, .vd-select.ng-invalid.ng-dirty, .ng-submitted .vd-select.ng-invalid {
|
1208
|
-
border-color: var(--hs-color-
|
1226
|
+
border-color: var(--hs-color-border-no-default);
|
1209
1227
|
}
|
1210
1228
|
.vd-select.vd-input--error:focus, .vd-select.vd-input--error.vd-focus, .vd-select.vd-error:focus, .vd-select.vd-error.vd-focus, .vd-select.ng-invalid.ng-dirty:focus, .vd-select.ng-invalid.ng-dirty.vd-focus, .ng-submitted .vd-select.ng-invalid:focus, .ng-submitted .vd-select.ng-invalid.vd-focus {
|
1211
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1229
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1212
1230
|
}
|
1213
1231
|
|
1214
1232
|
.vd-select-group {
|
@@ -1316,7 +1334,7 @@ details,
|
|
1316
1334
|
transition-property: border-color, box-shadow;
|
1317
1335
|
}
|
1318
1336
|
.vd-input::placeholder {
|
1319
|
-
color: var(--hs-color-
|
1337
|
+
color: var(--hs-color-fg-supplementary-default);
|
1320
1338
|
opacity: 1;
|
1321
1339
|
}
|
1322
1340
|
.vd-input:placeholder-shown {
|
@@ -1332,14 +1350,14 @@ details,
|
|
1332
1350
|
}
|
1333
1351
|
}
|
1334
1352
|
.vd-input:focus, .vd-input.vd-focus {
|
1335
|
-
border-color: var(--hs-color-
|
1336
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1353
|
+
border-color: var(--hs-color-border-go-default);
|
1354
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
1337
1355
|
}
|
1338
1356
|
.vd-input.vd-input--error, .vd-input.vd-error, .vd-input.ng-invalid.ng-dirty, .ng-submitted .vd-input.ng-invalid {
|
1339
|
-
border-color: var(--hs-color-
|
1357
|
+
border-color: var(--hs-color-border-no-default);
|
1340
1358
|
}
|
1341
1359
|
.vd-input.vd-input--error:focus, .vd-input.vd-input--error.vd-focus, .vd-input.vd-error:focus, .vd-input.vd-error.vd-focus, .vd-input.ng-invalid.ng-dirty:focus, .vd-input.ng-invalid.ng-dirty.vd-focus, .ng-submitted .vd-input.ng-invalid:focus, .ng-submitted .vd-input.ng-invalid.vd-focus {
|
1342
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1360
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1343
1361
|
}
|
1344
1362
|
|
1345
1363
|
.vd-input-error-message-section {
|
@@ -1403,10 +1421,10 @@ details,
|
|
1403
1421
|
display: flex;
|
1404
1422
|
}
|
1405
1423
|
.vd-autocomplete-input-container.vd-input--error .vd-autocomplete-input, .vd-autocomplete-input-container.vd-error .vd-autocomplete-input, .vd-autocomplete-input-container.ng-invalid.ng-dirty .vd-autocomplete-input, .ng-submitted .vd-autocomplete-input-container.ng-invalid .vd-autocomplete-input {
|
1406
|
-
border-color: var(--hs-color-
|
1424
|
+
border-color: var(--hs-color-border-no-default);
|
1407
1425
|
}
|
1408
1426
|
.vd-autocomplete-input-container.vd-input--error .vd-autocomplete-input:focus, .vd-autocomplete-input-container.vd-input--error .vd-autocomplete-input.vd-focus, .vd-autocomplete-input-container.vd-error .vd-autocomplete-input:focus, .vd-autocomplete-input-container.vd-error .vd-autocomplete-input.vd-focus, .vd-autocomplete-input-container.ng-invalid.ng-dirty .vd-autocomplete-input:focus, .vd-autocomplete-input-container.ng-invalid.ng-dirty .vd-autocomplete-input.vd-focus, .ng-submitted .vd-autocomplete-input-container.ng-invalid .vd-autocomplete-input:focus, .ng-submitted .vd-autocomplete-input-container.ng-invalid .vd-autocomplete-input.vd-focus {
|
1409
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1427
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1410
1428
|
}
|
1411
1429
|
|
1412
1430
|
.vd-autocomplete-input-typeahead {
|
@@ -1432,7 +1450,7 @@ details,
|
|
1432
1450
|
white-space: nowrap;
|
1433
1451
|
}
|
1434
1452
|
.vd-autocomplete-input-typeahead::placeholder {
|
1435
|
-
color: var(--hs-color-
|
1453
|
+
color: var(--hs-color-fg-supplementary-default);
|
1436
1454
|
opacity: 1;
|
1437
1455
|
}
|
1438
1456
|
.vd-autocomplete-input-typeahead:placeholder-shown {
|
@@ -1459,10 +1477,10 @@ details,
|
|
1459
1477
|
display: block;
|
1460
1478
|
}
|
1461
1479
|
.vd-autocomplete-filter.vd-input--error vd-autocomplete-multi, .vd-autocomplete-filter.vd-error vd-autocomplete-multi, .vd-autocomplete-filter.ng-invalid.ng-dirty vd-autocomplete-multi, .ng-submitted .vd-autocomplete-filter.ng-invalid vd-autocomplete-multi {
|
1462
|
-
border-color: var(--hs-color-
|
1480
|
+
border-color: var(--hs-color-border-no-default);
|
1463
1481
|
}
|
1464
1482
|
.vd-autocomplete-filter.vd-input--error vd-autocomplete-multi:focus, .vd-autocomplete-filter.vd-input--error vd-autocomplete-multi.vd-focus, .vd-autocomplete-filter.vd-error vd-autocomplete-multi:focus, .vd-autocomplete-filter.vd-error vd-autocomplete-multi.vd-focus, .vd-autocomplete-filter.ng-invalid.ng-dirty vd-autocomplete-multi:focus, .vd-autocomplete-filter.ng-invalid.ng-dirty vd-autocomplete-multi.vd-focus, .ng-submitted .vd-autocomplete-filter.ng-invalid vd-autocomplete-multi:focus, .ng-submitted .vd-autocomplete-filter.ng-invalid vd-autocomplete-multi.vd-focus {
|
1465
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1483
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1466
1484
|
}
|
1467
1485
|
|
1468
1486
|
.vd-autocomplete-filter-input-container {
|
@@ -1507,14 +1525,14 @@ details,
|
|
1507
1525
|
text-transform: capitalize;
|
1508
1526
|
}
|
1509
1527
|
.vd-autocomplete-select-placeholder:focus, .vd-autocomplete-select-placeholder.vd-focus {
|
1510
|
-
border-color: var(--hs-color-
|
1511
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1528
|
+
border-color: var(--hs-color-border-go-default);
|
1529
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
1512
1530
|
}
|
1513
1531
|
.vd-autocomplete-select-placeholder.vd-input--error, .vd-autocomplete-select-placeholder.vd-error, .vd-autocomplete-select-placeholder.ng-invalid.ng-dirty, .ng-submitted .vd-autocomplete-select-placeholder.ng-invalid {
|
1514
|
-
border-color: var(--hs-color-
|
1532
|
+
border-color: var(--hs-color-border-no-default);
|
1515
1533
|
}
|
1516
1534
|
.vd-autocomplete-select-placeholder.vd-input--error:focus, .vd-autocomplete-select-placeholder.vd-input--error.vd-focus, .vd-autocomplete-select-placeholder.vd-error:focus, .vd-autocomplete-select-placeholder.vd-error.vd-focus, .vd-autocomplete-select-placeholder.ng-invalid.ng-dirty:focus, .vd-autocomplete-select-placeholder.ng-invalid.ng-dirty.vd-focus, .ng-submitted .vd-autocomplete-select-placeholder.ng-invalid:focus, .ng-submitted .vd-autocomplete-select-placeholder.ng-invalid.vd-focus {
|
1517
|
-
box-shadow: 0 0 3px var(--hs-color-
|
1535
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
1518
1536
|
}
|
1519
1537
|
|
1520
1538
|
.vd-autocomplete-filter-icon {
|
@@ -1534,7 +1552,7 @@ details,
|
|
1534
1552
|
align-items: center;
|
1535
1553
|
justify-content: space-between;
|
1536
1554
|
min-height: 45px;
|
1537
|
-
background-color: var(--hs-color-
|
1555
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
1538
1556
|
}
|
1539
1557
|
@media only screen and (max-width: 768px) {
|
1540
1558
|
.vd-action-bar {
|
@@ -1565,7 +1583,7 @@ details,
|
|
1565
1583
|
}
|
1566
1584
|
|
1567
1585
|
.vd-avatar {
|
1568
|
-
background-color: var(--hs-color-
|
1586
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
1569
1587
|
background-repeat: no-repeat;
|
1570
1588
|
background-size: cover;
|
1571
1589
|
background-position: center;
|
@@ -1664,7 +1682,7 @@ details,
|
|
1664
1682
|
background-repeat: no-repeat;
|
1665
1683
|
background-size: cover;
|
1666
1684
|
background-position: center center;
|
1667
|
-
background-color: var(--hs-color-
|
1685
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
1668
1686
|
position: relative;
|
1669
1687
|
}
|
1670
1688
|
.vd-avatar-multi-tile[vd-lazy-load*="placeholder.svg"] {
|
@@ -2213,7 +2231,7 @@ a.vd-btn.disabled {
|
|
2213
2231
|
filter: grayscale(100%);
|
2214
2232
|
}
|
2215
2233
|
.vd-btn-panel:focus {
|
2216
|
-
border-color: var(--hs-color-
|
2234
|
+
border-color: var(--hs-color-border-go-default);
|
2217
2235
|
box-shadow: 0 0 3px 2px rgba(var(--hs-color-bg-go-default-rgb), 0.35);
|
2218
2236
|
}
|
2219
2237
|
.vd-btn-panel:hover {
|
@@ -2225,7 +2243,7 @@ a.vd-btn.disabled {
|
|
2225
2243
|
}
|
2226
2244
|
|
2227
2245
|
.vd-btn-panel--selected {
|
2228
|
-
border-color: var(--hs-color-
|
2246
|
+
border-color: var(--hs-color-border-go-default);
|
2229
2247
|
}
|
2230
2248
|
.vd-btn-panel--selected:focus, .vd-btn-panel--selected:hover {
|
2231
2249
|
border-color: var(--hs-color-bg-go-soft);
|
@@ -2276,7 +2294,7 @@ a.vd-btn.disabled {
|
|
2276
2294
|
right: 1em;
|
2277
2295
|
content: "";
|
2278
2296
|
bottom: 0;
|
2279
|
-
box-shadow: 0 0.1em 4em 0 var(--hs-color-overlay-
|
2297
|
+
box-shadow: 0 0.1em 4em 0 var(--hs-color-overlay-neutral-strong);
|
2280
2298
|
}
|
2281
2299
|
|
2282
2300
|
vd-carousel {
|
@@ -2512,7 +2530,7 @@ vd-carousel-frame {
|
|
2512
2530
|
.vd-checkbox-input:checked + .vd-checkbox-tick {
|
2513
2531
|
transition: background-color 0.8s;
|
2514
2532
|
background-color: var(--hs-color-bg-go-default);
|
2515
|
-
border-color: var(--hs-color-
|
2533
|
+
border-color: var(--hs-color-bg-go-default);
|
2516
2534
|
}
|
2517
2535
|
.vd-checkbox-input:checked + .vd-checkbox-tick:after {
|
2518
2536
|
opacity: 1;
|
@@ -2542,7 +2560,7 @@ vd-carousel-frame {
|
|
2542
2560
|
}
|
2543
2561
|
|
2544
2562
|
.vd-checkbox--mixed .vd-checkbox-tick {
|
2545
|
-
border: 2px solid var(--hs-color-
|
2563
|
+
border: 2px solid var(--hs-color-bg-go-default);
|
2546
2564
|
}
|
2547
2565
|
|
2548
2566
|
.vd-checkbox--mixed .vd-checkbox-input:not(:checked) + .vd-checkbox-tick:after {
|
@@ -2815,7 +2833,7 @@ vd-carousel-frame {
|
|
2815
2833
|
}
|
2816
2834
|
.vd-datepicker .pika-title .pika-select::placeholder,
|
2817
2835
|
.vd-datepicker-range .pika-title .pika-select::placeholder {
|
2818
|
-
color: var(--hs-color-
|
2836
|
+
color: var(--hs-color-fg-supplementary-default);
|
2819
2837
|
opacity: 1;
|
2820
2838
|
}
|
2821
2839
|
.vd-datepicker .pika-title .pika-select:placeholder-shown,
|
@@ -2836,15 +2854,15 @@ vd-carousel-frame {
|
|
2836
2854
|
.vd-datepicker .pika-title .pika-select:focus, .vd-datepicker .pika-title .pika-select.vd-focus,
|
2837
2855
|
.vd-datepicker-range .pika-title .pika-select:focus,
|
2838
2856
|
.vd-datepicker-range .pika-title .pika-select.vd-focus {
|
2839
|
-
border-color: var(--hs-color-
|
2840
|
-
box-shadow: 0 0 3px var(--hs-color-
|
2857
|
+
border-color: var(--hs-color-border-go-default);
|
2858
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
2841
2859
|
}
|
2842
2860
|
.vd-datepicker .pika-title .pika-select.vd-input--error, .vd-datepicker .pika-title .pika-select.vd-error, .vd-datepicker .pika-title .pika-select.ng-invalid.ng-dirty, .ng-submitted .vd-datepicker .pika-title .pika-select.ng-invalid,
|
2843
2861
|
.vd-datepicker-range .pika-title .pika-select.vd-input--error,
|
2844
2862
|
.vd-datepicker-range .pika-title .pika-select.vd-error,
|
2845
2863
|
.vd-datepicker-range .pika-title .pika-select.ng-invalid.ng-dirty,
|
2846
2864
|
.ng-submitted .vd-datepicker-range .pika-title .pika-select.ng-invalid {
|
2847
|
-
border-color: var(--hs-color-
|
2865
|
+
border-color: var(--hs-color-border-no-default);
|
2848
2866
|
}
|
2849
2867
|
.vd-datepicker .pika-title .pika-select.vd-input--error:focus, .vd-datepicker .pika-title .pika-select.vd-input--error.vd-focus, .vd-datepicker .pika-title .pika-select.vd-error:focus, .vd-datepicker .pika-title .pika-select.vd-error.vd-focus, .vd-datepicker .pika-title .pika-select.ng-invalid.ng-dirty:focus, .vd-datepicker .pika-title .pika-select.ng-invalid.ng-dirty.vd-focus, .ng-submitted .vd-datepicker .pika-title .pika-select.ng-invalid:focus, .ng-submitted .vd-datepicker .pika-title .pika-select.ng-invalid.vd-focus,
|
2850
2868
|
.vd-datepicker-range .pika-title .pika-select.vd-input--error:focus,
|
@@ -2855,7 +2873,7 @@ vd-carousel-frame {
|
|
2855
2873
|
.vd-datepicker-range .pika-title .pika-select.ng-invalid.ng-dirty.vd-focus,
|
2856
2874
|
.ng-submitted .vd-datepicker-range .pika-title .pika-select.ng-invalid:focus,
|
2857
2875
|
.ng-submitted .vd-datepicker-range .pika-title .pika-select.ng-invalid.vd-focus {
|
2858
|
-
box-shadow: 0 0 3px var(--hs-color-
|
2876
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
2859
2877
|
}
|
2860
2878
|
.vd-datepicker .pika-title .pika-select-month,
|
2861
2879
|
.vd-datepicker-range .pika-title .pika-select-month {
|
@@ -3345,13 +3363,13 @@ vd-dott,
|
|
3345
3363
|
|
3346
3364
|
.vd-dott-border:not(.vd-input--error):not(.vd-error) {
|
3347
3365
|
border: initial;
|
3348
|
-
border-top: 2px solid var(--hs-color-
|
3349
|
-
border-bottom: 2px solid var(--hs-color-
|
3350
|
-
background-image: linear-gradient(var(--hs-color-
|
3366
|
+
border-top: 2px solid var(--hs-color-border-go-default);
|
3367
|
+
border-bottom: 2px solid var(--hs-color-border-success-default);
|
3368
|
+
background-image: linear-gradient(var(--hs-color-border-go-default), var(--hs-color-border-success-default)), linear-gradient(var(--hs-color-border-go-default), var(--hs-color-border-success-default));
|
3351
3369
|
background-size: 2px 100%;
|
3352
3370
|
background-position: 0 0, 100% 0;
|
3353
3371
|
background-repeat: no-repeat;
|
3354
|
-
box-shadow: 0 0 4px 0 var(--hs-color-
|
3372
|
+
box-shadow: 0 0 4px 0 var(--hs-color-border-go-default);
|
3355
3373
|
}
|
3356
3374
|
|
3357
3375
|
.vd-dropdown-input {
|
@@ -3362,10 +3380,10 @@ vd-dott,
|
|
3362
3380
|
}
|
3363
3381
|
|
3364
3382
|
.vd-dropdown-input-container.vd-input--error .vd-dropdown-input, .vd-dropdown-input-container.vd-error .vd-dropdown-input, .vd-dropdown-input-container.ng-invalid.ng-dirty .vd-dropdown-input, .ng-submitted .vd-dropdown-input-container.ng-invalid .vd-dropdown-input {
|
3365
|
-
border-color: var(--hs-color-
|
3383
|
+
border-color: var(--hs-color-border-no-default);
|
3366
3384
|
}
|
3367
3385
|
.vd-dropdown-input-container.vd-input--error .vd-dropdown-input:focus, .vd-dropdown-input-container.vd-input--error .vd-dropdown-input.vd-focus, .vd-dropdown-input-container.vd-error .vd-dropdown-input:focus, .vd-dropdown-input-container.vd-error .vd-dropdown-input.vd-focus, .vd-dropdown-input-container.ng-invalid.ng-dirty .vd-dropdown-input:focus, .vd-dropdown-input-container.ng-invalid.ng-dirty .vd-dropdown-input.vd-focus, .ng-submitted .vd-dropdown-input-container.ng-invalid .vd-dropdown-input:focus, .ng-submitted .vd-dropdown-input-container.ng-invalid .vd-dropdown-input.vd-focus {
|
3368
|
-
box-shadow: 0 0 3px var(--hs-color-
|
3386
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
3369
3387
|
}
|
3370
3388
|
|
3371
3389
|
.vd-expandable-content {
|
@@ -3494,7 +3512,7 @@ vd-dott,
|
|
3494
3512
|
font-weight: 900;
|
3495
3513
|
text-transform: uppercase;
|
3496
3514
|
padding: 4px 8px;
|
3497
|
-
background-color: var(--hs-color-
|
3515
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
3498
3516
|
border-radius: 4px;
|
3499
3517
|
display: inline-block;
|
3500
3518
|
vertical-align: text-top;
|
@@ -3884,7 +3902,7 @@ vd-dott,
|
|
3884
3902
|
font-weight: 400;
|
3885
3903
|
padding: 6px 10px;
|
3886
3904
|
color: var(--hs-color-fg-supplementary-default);
|
3887
|
-
background-color: var(--hs-color-
|
3905
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
3888
3906
|
border-radius: 4px;
|
3889
3907
|
display: inline-block;
|
3890
3908
|
margin-right: 4px;
|
@@ -3947,18 +3965,18 @@ vd-dott,
|
|
3947
3965
|
transition-property: border-color, box-shadow;
|
3948
3966
|
}
|
3949
3967
|
.vd-lozenge-group:focus, .vd-lozenge-group.vd-focus {
|
3950
|
-
border-color: var(--hs-color-
|
3951
|
-
box-shadow: 0 0 3px var(--hs-color-
|
3968
|
+
border-color: var(--hs-color-border-go-default);
|
3969
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
3952
3970
|
}
|
3953
3971
|
.vd-lozenge-group.vd-input--error, .vd-lozenge-group.vd-error, .vd-lozenge-group.ng-invalid.ng-dirty, .ng-submitted .vd-lozenge-group.ng-invalid {
|
3954
|
-
border-color: var(--hs-color-
|
3972
|
+
border-color: var(--hs-color-border-no-default);
|
3955
3973
|
}
|
3956
3974
|
.vd-lozenge-group.vd-input--error:focus, .vd-lozenge-group.vd-input--error.vd-focus, .vd-lozenge-group.vd-error:focus, .vd-lozenge-group.vd-error.vd-focus, .vd-lozenge-group.ng-invalid.ng-dirty:focus, .vd-lozenge-group.ng-invalid.ng-dirty.vd-focus, .ng-submitted .vd-lozenge-group.ng-invalid:focus, .ng-submitted .vd-lozenge-group.ng-invalid.vd-focus {
|
3957
|
-
box-shadow: 0 0 3px var(--hs-color-
|
3975
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
3958
3976
|
}
|
3959
3977
|
.vd-lozenge-group:focus-within {
|
3960
|
-
border-color: var(--hs-color-
|
3961
|
-
box-shadow: 0 0 3px var(--hs-color-
|
3978
|
+
border-color: var(--hs-color-border-go-default);
|
3979
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
3962
3980
|
}
|
3963
3981
|
.vd-lozenge-group .vd-lozenge {
|
3964
3982
|
margin-left: 4px;
|
@@ -3986,7 +4004,7 @@ vd-dott,
|
|
3986
4004
|
flex-grow: 1;
|
3987
4005
|
}
|
3988
4006
|
.vd-lozenge-group .vd-lozenge-group-input::placeholder {
|
3989
|
-
color: var(--hs-color-
|
4007
|
+
color: var(--hs-color-fg-supplementary-default);
|
3990
4008
|
opacity: 1;
|
3991
4009
|
}
|
3992
4010
|
.vd-lozenge-group .vd-lozenge-group-input:placeholder-shown {
|
@@ -4113,7 +4131,7 @@ vd-dott,
|
|
4113
4131
|
|
4114
4132
|
.vd-overlay--visible {
|
4115
4133
|
visibility: visible;
|
4116
|
-
background-color: var(--hs-color-overlay-
|
4134
|
+
background-color: var(--hs-color-overlay-neutral-strong);
|
4117
4135
|
pointer-events: auto;
|
4118
4136
|
}
|
4119
4137
|
|
@@ -4212,7 +4230,7 @@ vd-dott,
|
|
4212
4230
|
.vd-popover {
|
4213
4231
|
position: relative;
|
4214
4232
|
border-radius: 5px;
|
4215
|
-
filter: drop-shadow(0 4px 5px var(--hs-color-overlay-
|
4233
|
+
filter: drop-shadow(0 4px 5px var(--hs-color-overlay-neutral-strong));
|
4216
4234
|
background-color: var(--hs-color-bg-neutral-top);
|
4217
4235
|
}
|
4218
4236
|
.vd-popover-tether-pinned-bottom .vd-popover {
|
@@ -4251,7 +4269,7 @@ vd-dott,
|
|
4251
4269
|
transform: rotate(45deg);
|
4252
4270
|
}
|
4253
4271
|
.vd-popover-tether-element-attached-bottom.vd-popover-tether-target-attached-top .vd-popover-actions:not(:empty) ~ .vd-popover-beak {
|
4254
|
-
background-color: var(--hs-color-
|
4272
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
4255
4273
|
}
|
4256
4274
|
.vd-popover-tether-pinned .vd-popover-beak {
|
4257
4275
|
display: none;
|
@@ -4309,10 +4327,10 @@ vd-dott,
|
|
4309
4327
|
color: var(--hs-color-fg-neutral-default);
|
4310
4328
|
}
|
4311
4329
|
.vd-multiselect-popover-container.vd-input--error .vd-multiselect-popover-input, .vd-multiselect-popover-container.vd-error .vd-multiselect-popover-input, .vd-multiselect-popover-container.ng-invalid.ng-dirty .vd-multiselect-popover-input, .ng-submitted .vd-multiselect-popover-container.ng-invalid .vd-multiselect-popover-input {
|
4312
|
-
border-color: var(--hs-color-
|
4330
|
+
border-color: var(--hs-color-border-no-default);
|
4313
4331
|
}
|
4314
4332
|
.vd-multiselect-popover-container.vd-input--error .vd-multiselect-popover-input:focus, .vd-multiselect-popover-container.vd-input--error .vd-multiselect-popover-input.vd-focus, .vd-multiselect-popover-container.vd-error .vd-multiselect-popover-input:focus, .vd-multiselect-popover-container.vd-error .vd-multiselect-popover-input.vd-focus, .vd-multiselect-popover-container.ng-invalid.ng-dirty .vd-multiselect-popover-input:focus, .vd-multiselect-popover-container.ng-invalid.ng-dirty .vd-multiselect-popover-input.vd-focus, .ng-submitted .vd-multiselect-popover-container.ng-invalid .vd-multiselect-popover-input:focus, .ng-submitted .vd-multiselect-popover-container.ng-invalid .vd-multiselect-popover-input.vd-focus {
|
4315
|
-
box-shadow: 0 0 3px var(--hs-color-
|
4333
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
4316
4334
|
}
|
4317
4335
|
|
4318
4336
|
.vd-multiselect-popover-content-container {
|
@@ -4712,7 +4730,7 @@ vd-dott,
|
|
4712
4730
|
.vd-radio-input:checked + .vd-radio-tick {
|
4713
4731
|
transition: background-color 0.8s;
|
4714
4732
|
background-color: var(--hs-color-bg-go-default);
|
4715
|
-
border-color: var(--hs-color-
|
4733
|
+
border-color: var(--hs-color-bg-go-default);
|
4716
4734
|
}
|
4717
4735
|
.vd-radio-input:checked + .vd-radio-tick:after {
|
4718
4736
|
opacity: 1;
|
@@ -4779,7 +4797,7 @@ vd-dott,
|
|
4779
4797
|
}
|
4780
4798
|
.vd-scrollable-indicator::before {
|
4781
4799
|
content: "";
|
4782
|
-
box-shadow: 0 0 30px var(--hs-color-overlay-
|
4800
|
+
box-shadow: 0 0 30px var(--hs-color-overlay-neutral-strong);
|
4783
4801
|
border-radius: 100%;
|
4784
4802
|
width: 100%;
|
4785
4803
|
height: 100%;
|
@@ -4861,7 +4879,7 @@ vd-section .vd-section,
|
|
4861
4879
|
|
4862
4880
|
.vd-section--secondary,
|
4863
4881
|
.vd-section--secondary .vd-section-container {
|
4864
|
-
background-color: var(--hs-color-
|
4882
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
4865
4883
|
}
|
4866
4884
|
|
4867
4885
|
.vd-section--tertiary,
|
@@ -4893,7 +4911,7 @@ vd-section .vd-section,
|
|
4893
4911
|
right: 1em;
|
4894
4912
|
content: "";
|
4895
4913
|
bottom: 0;
|
4896
|
-
box-shadow: 0 0.1em 4em 0 var(--hs-color-overlay-
|
4914
|
+
box-shadow: 0 0.1em 4em 0 var(--hs-color-overlay-neutral-strong);
|
4897
4915
|
}
|
4898
4916
|
.vd-section--fixed::after {
|
4899
4917
|
animation: vd-fade-in 0.2s ease-in-out;
|
@@ -4907,7 +4925,7 @@ vd-section .vd-section,
|
|
4907
4925
|
|
4908
4926
|
.vd-section--action-bar,
|
4909
4927
|
.vd-section--action-bar .vd-section-container {
|
4910
|
-
background-color: var(--hs-color-
|
4928
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
4911
4929
|
}
|
4912
4930
|
.vd-section--action-bar .vd-section-wrap {
|
4913
4931
|
min-height: 45px;
|
@@ -4986,7 +5004,7 @@ vd-section .vd-section,
|
|
4986
5004
|
}
|
4987
5005
|
|
4988
5006
|
.vd-segcontrol--selected .vd-segcontrol-button {
|
4989
|
-
border-color: var(--hs-color-
|
5007
|
+
border-color: var(--hs-color-border-go-default) !important;
|
4990
5008
|
z-index: 3;
|
4991
5009
|
}
|
4992
5010
|
|
@@ -5042,7 +5060,7 @@ vd-section .vd-section,
|
|
5042
5060
|
}
|
5043
5061
|
|
5044
5062
|
.vd-splash-fullscreen-container {
|
5045
|
-
border: 20px solid var(--hs-color-overlay-
|
5063
|
+
border: 20px solid var(--hs-color-overlay-neutral-strong);
|
5046
5064
|
box-sizing: border-box;
|
5047
5065
|
display: block;
|
5048
5066
|
position: fixed;
|
@@ -5190,7 +5208,7 @@ vd-section .vd-section,
|
|
5190
5208
|
height: 36px;
|
5191
5209
|
border-radius: 36px;
|
5192
5210
|
box-sizing: border-box;
|
5193
|
-
border: 2px solid var(--hs-color-
|
5211
|
+
border: 2px solid var(--hs-color-bg-go-default);
|
5194
5212
|
background-color: var(--hs-color-bg-neutral-top);
|
5195
5213
|
transition: background-color 0.5s ease-in-out;
|
5196
5214
|
}
|
@@ -5235,7 +5253,7 @@ vd-section .vd-section,
|
|
5235
5253
|
float: left;
|
5236
5254
|
border-radius: inherit;
|
5237
5255
|
box-sizing: border-box;
|
5238
|
-
border: 2px solid var(--hs-color-
|
5256
|
+
border: 2px solid var(--hs-color-bg-go-default);
|
5239
5257
|
background-color: var(--hs-color-bg-neutral-top);
|
5240
5258
|
pointer-events: none;
|
5241
5259
|
width: 36px;
|
@@ -5474,7 +5492,7 @@ table {
|
|
5474
5492
|
top: -1px;
|
5475
5493
|
left: 0;
|
5476
5494
|
width: 4px;
|
5477
|
-
background-color: var(--hs-color-
|
5495
|
+
background-color: var(--hs-color-border-go-default);
|
5478
5496
|
bottom: 0;
|
5479
5497
|
z-index: 1;
|
5480
5498
|
position: absolute;
|
@@ -5997,7 +6015,7 @@ td.vd-show-print {
|
|
5997
6015
|
background-color: var(--hs-color-bg-go-highlight-default);
|
5998
6016
|
}
|
5999
6017
|
.vd-id-badge.vd-id-badge--current {
|
6000
|
-
border-color: var(--hs-color-
|
6018
|
+
border-color: var(--hs-color-border-go-default);
|
6001
6019
|
}
|
6002
6020
|
.vd-id-badge.vd-id-badge--small .vd-id-badge__content {
|
6003
6021
|
padding: 8px;
|
@@ -6100,7 +6118,7 @@ td.vd-show-print {
|
|
6100
6118
|
}
|
6101
6119
|
|
6102
6120
|
.vd-id-badge__image {
|
6103
|
-
background-color: var(--hs-color-
|
6121
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
6104
6122
|
background-repeat: no-repeat;
|
6105
6123
|
background-size: contain;
|
6106
6124
|
background-position: center;
|
@@ -6715,11 +6733,11 @@ td.vd-show-print {
|
|
6715
6733
|
border-bottom: 1px solid var(--hs-color-border-neutral-strong);
|
6716
6734
|
}
|
6717
6735
|
.vd-datatable-row--header-sections:nth-child(odd), .vd-datatable-row--header-sections:nth-child(even) {
|
6718
|
-
background-color: var(--hs-color-
|
6736
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
6719
6737
|
}
|
6720
6738
|
|
6721
6739
|
.vd-datatable-row--footer:nth-child(odd), .vd-datatable-row--footer:nth-child(even) {
|
6722
|
-
background-color: var(--hs-color-
|
6740
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
6723
6741
|
}
|
6724
6742
|
|
6725
6743
|
.vd-datatable-foot.vd-sticky .vd-datatable-row--footer:last-of-type .vd-datatable-cell {
|
@@ -6741,7 +6759,7 @@ td.vd-show-print {
|
|
6741
6759
|
left: 0;
|
6742
6760
|
width: 100%;
|
6743
6761
|
height: 30px;
|
6744
|
-
box-shadow: inset 0 -30px 40px -48px var(--hs-color-overlay-
|
6762
|
+
box-shadow: inset 0 -30px 40px -48px var(--hs-color-overlay-neutral-strong);
|
6745
6763
|
}
|
6746
6764
|
|
6747
6765
|
.vd-datatable-cell {
|
@@ -6986,7 +7004,7 @@ td.vd-show-print {
|
|
6986
7004
|
}
|
6987
7005
|
.react-datepicker__month-select::placeholder,
|
6988
7006
|
.react-datepicker__year-select::placeholder {
|
6989
|
-
color: var(--hs-color-
|
7007
|
+
color: var(--hs-color-fg-supplementary-default);
|
6990
7008
|
opacity: 1;
|
6991
7009
|
}
|
6992
7010
|
.react-datepicker__month-select:placeholder-shown,
|
@@ -7007,15 +7025,15 @@ td.vd-show-print {
|
|
7007
7025
|
.react-datepicker__month-select:focus, .react-datepicker__month-select.vd-focus,
|
7008
7026
|
.react-datepicker__year-select:focus,
|
7009
7027
|
.react-datepicker__year-select.vd-focus {
|
7010
|
-
border-color: var(--hs-color-
|
7011
|
-
box-shadow: 0 0 3px var(--hs-color-
|
7028
|
+
border-color: var(--hs-color-border-go-default);
|
7029
|
+
box-shadow: 0 0 3px var(--hs-color-border-go-default);
|
7012
7030
|
}
|
7013
7031
|
.react-datepicker__month-select.vd-input--error, .react-datepicker__month-select.vd-error, .react-datepicker__month-select.ng-invalid.ng-dirty, .ng-submitted .react-datepicker__month-select.ng-invalid,
|
7014
7032
|
.react-datepicker__year-select.vd-input--error,
|
7015
7033
|
.react-datepicker__year-select.vd-error,
|
7016
7034
|
.react-datepicker__year-select.ng-invalid.ng-dirty,
|
7017
7035
|
.ng-submitted .react-datepicker__year-select.ng-invalid {
|
7018
|
-
border-color: var(--hs-color-
|
7036
|
+
border-color: var(--hs-color-border-no-default);
|
7019
7037
|
}
|
7020
7038
|
.react-datepicker__month-select.vd-input--error:focus, .react-datepicker__month-select.vd-input--error.vd-focus, .react-datepicker__month-select.vd-error:focus, .react-datepicker__month-select.vd-error.vd-focus, .react-datepicker__month-select.ng-invalid.ng-dirty:focus, .react-datepicker__month-select.ng-invalid.ng-dirty.vd-focus, .ng-submitted .react-datepicker__month-select.ng-invalid:focus, .ng-submitted .react-datepicker__month-select.ng-invalid.vd-focus,
|
7021
7039
|
.react-datepicker__year-select.vd-input--error:focus,
|
@@ -7026,7 +7044,7 @@ td.vd-show-print {
|
|
7026
7044
|
.react-datepicker__year-select.ng-invalid.ng-dirty.vd-focus,
|
7027
7045
|
.ng-submitted .react-datepicker__year-select.ng-invalid:focus,
|
7028
7046
|
.ng-submitted .react-datepicker__year-select.ng-invalid.vd-focus {
|
7029
|
-
box-shadow: 0 0 3px var(--hs-color-
|
7047
|
+
box-shadow: 0 0 3px var(--hs-color-border-no-default);
|
7030
7048
|
}
|
7031
7049
|
|
7032
7050
|
.react-datepicker__month-select {
|
@@ -7158,7 +7176,7 @@ td.vd-show-print {
|
|
7158
7176
|
height: 10px;
|
7159
7177
|
width: 100%;
|
7160
7178
|
border-radius: 5px;
|
7161
|
-
background-color: var(--hs-color-
|
7179
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
7162
7180
|
overflow: hidden;
|
7163
7181
|
}
|
7164
7182
|
|
@@ -7582,14 +7600,14 @@ td.vd-show-print {
|
|
7582
7600
|
|
7583
7601
|
.vd-table-list-row--expanded {
|
7584
7602
|
background: var(--hs-color-bg-neutral-top);
|
7585
|
-
box-shadow: 0 10px 12px -2px var(--hs-color-overlay-
|
7603
|
+
box-shadow: 0 10px 12px -2px var(--hs-color-overlay-neutral-strong);
|
7586
7604
|
}
|
7587
7605
|
.vd-table-list-row--expanded .vd-table-list-cell:first-child::before {
|
7588
7606
|
content: "";
|
7589
7607
|
top: -1px;
|
7590
7608
|
left: 0;
|
7591
7609
|
width: 4px;
|
7592
|
-
background-color: var(--hs-color-
|
7610
|
+
background-color: var(--hs-color-border-go-default);
|
7593
7611
|
bottom: 0;
|
7594
7612
|
z-index: 1;
|
7595
7613
|
position: absolute;
|
@@ -7599,7 +7617,7 @@ td.vd-show-print {
|
|
7599
7617
|
}
|
7600
7618
|
|
7601
7619
|
.vd-table-list-row--actions {
|
7602
|
-
background-color: var(--hs-color-
|
7620
|
+
background-color: var(--hs-color-bg-neutral-edge);
|
7603
7621
|
border-bottom: 1px solid var(--hs-color-border-neutral-strong);
|
7604
7622
|
}
|
7605
7623
|
|
@@ -7615,7 +7633,7 @@ td.vd-show-print {
|
|
7615
7633
|
top: -1px;
|
7616
7634
|
left: 0;
|
7617
7635
|
width: 4px;
|
7618
|
-
background-color: var(--hs-color-
|
7636
|
+
background-color: var(--hs-color-border-go-default);
|
7619
7637
|
bottom: 0;
|
7620
7638
|
z-index: 1;
|
7621
7639
|
position: absolute;
|
@@ -7623,7 +7641,7 @@ td.vd-show-print {
|
|
7623
7641
|
.vd-table-list-row--expanded-content > .vd-table-list-cell:first-child::after {
|
7624
7642
|
content: "";
|
7625
7643
|
pointer-events: none;
|
7626
|
-
box-shadow: 0 10px 12px -2px var(--hs-color-overlay-
|
7644
|
+
box-shadow: 0 10px 12px -2px var(--hs-color-overlay-neutral-strong);
|
7627
7645
|
position: absolute;
|
7628
7646
|
left: 0;
|
7629
7647
|
top: 0;
|
@@ -7998,14 +8016,14 @@ td.vd-show-print {
|
|
7998
8016
|
top: 0;
|
7999
8017
|
}
|
8000
8018
|
.vd-sticky--top.vd-sticky--stuck {
|
8001
|
-
box-shadow: 0 20px 40px -20px var(--hs-color-overlay-
|
8019
|
+
box-shadow: 0 20px 40px -20px var(--hs-color-overlay-neutral-strong);
|
8002
8020
|
}
|
8003
8021
|
|
8004
8022
|
.vd-sticky--bottom {
|
8005
8023
|
bottom: 0;
|
8006
8024
|
}
|
8007
8025
|
.vd-sticky--bottom.vd-sticky--stuck {
|
8008
|
-
box-shadow: 0 -20px 40px -20px var(--hs-color-overlay-
|
8026
|
+
box-shadow: 0 -20px 40px -20px var(--hs-color-overlay-neutral-strong);
|
8009
8027
|
}
|
8010
8028
|
|
8011
8029
|
.vd-sticky--stuck {
|