1 | @import '@uppy/core/src/_utils.scss';
|
2 | @import '@uppy/core/src/_variables.scss';
|
3 | @import '@uppy/informer/src/style.scss';
|
4 | @import '@uppy/status-bar/src/style.scss';
|
5 | @import '@uppy/provider-views/src/style.scss';
|
6 |
|
7 |
|
8 | @import './components/FileItem/index.scss';
|
9 | @import './components/FileCard/index.scss';
|
10 |
|
11 |
|
12 |
|
13 | .uppy-transition-slideDownUp-enter {
|
14 | opacity: 0.01;
|
15 | transform: translate3d(0, -105%, 0);
|
16 | transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
|
17 | }
|
18 |
|
19 | .uppy-transition-slideDownUp-enter.uppy-transition-slideDownUp-enter-active {
|
20 | opacity: 1;
|
21 | transform: translate3d(0, 0, 0);
|
22 | }
|
23 |
|
24 | .uppy-transition-slideDownUp-leave {
|
25 | opacity: 1;
|
26 | transform: translate3d(0, 0, 0);
|
27 | transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
|
28 | }
|
29 |
|
30 | .uppy-transition-slideDownUp-leave.uppy-transition-slideDownUp-leave-active {
|
31 | opacity: 0.01;
|
32 | transform: translate3d(0, -105%, 0);
|
33 | }
|
34 |
|
35 |
|
36 |
|
37 | @keyframes uppy-Dashboard-fadeIn {
|
38 | from { opacity: 0; }
|
39 | to { opacity: 1; }
|
40 | }
|
41 |
|
42 | @keyframes uppy-Dashboard-fadeOut {
|
43 | from { opacity: 1; }
|
44 | to { opacity: 0; }
|
45 | }
|
46 |
|
47 | @keyframes uppy-Dashboard-slideDownAndFadeIn {
|
48 | from { transform: translate3d(-50%, -70%, 0); opacity: 0; }
|
49 | to { transform: translate3d(-50%, -50%, 0); opacity: 1; }
|
50 | }
|
51 |
|
52 | @keyframes uppy-Dashboard-slideDownAndFadeIn--small {
|
53 | from { transform: translate3d(0, -20%, 0); opacity: 0; }
|
54 | to { transform: translate3d(0, 0, 0); opacity: 1; }
|
55 | }
|
56 |
|
57 | @keyframes uppy-Dashboard-slideUpFadeOut {
|
58 | from { transform: translate3d(-50%, -50%, 0); opacity: 1; }
|
59 | to { transform: translate3d(-50%, -70%, 0); opacity: 0; }
|
60 | }
|
61 |
|
62 | @keyframes uppy-Dashboard-slideUpFadeOut--small {
|
63 | from { transform: translate3d(0, 0, 0); opacity: 1; }
|
64 | to { transform: translate3d(0, -20%, 0); opacity: 0; }
|
65 | }
|
66 |
|
67 |
|
68 |
|
69 | .uppy-Dashboard--modal {
|
70 | z-index: $zIndex-2;
|
71 | }
|
72 |
|
73 | .uppy-Dashboard--modal[aria-hidden=true] {
|
74 | display: none;
|
75 | }
|
76 |
|
77 | .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose > .uppy-Dashboard-inner {
|
78 | animation: uppy-Dashboard-slideDownAndFadeIn--small 0.3s cubic-bezier(0, 0, .2, 1);
|
79 |
|
80 | @media #{$screen-medium} {
|
81 | animation: uppy-Dashboard-slideDownAndFadeIn 0.3s cubic-bezier(0, 0, .2, 1);
|
82 | }
|
83 | }
|
84 |
|
85 | .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose > .uppy-Dashboard-overlay {
|
86 | animation: uppy-Dashboard-fadeIn 0.3s cubic-bezier(0, 0, .2, 1);
|
87 | }
|
88 |
|
89 | .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose.uppy-Dashboard--isClosing > .uppy-Dashboard-inner {
|
90 | animation: uppy-Dashboard-slideUpFadeOut--small 0.3s cubic-bezier(0, 0, .2, 1);
|
91 |
|
92 | @media #{$screen-medium} {
|
93 | animation: uppy-Dashboard-slideUpFadeOut 0.3s cubic-bezier(0, 0, .2, 1);
|
94 | }
|
95 | }
|
96 |
|
97 | .uppy-Dashboard--modal.uppy-Dashboard--animateOpenClose.uppy-Dashboard--isClosing > .uppy-Dashboard-overlay {
|
98 | animation: uppy-Dashboard-fadeOut 0.3s cubic-bezier(0, 0, .2, 1);
|
99 | }
|
100 |
|
101 |
|
102 | .uppy-Dashboard-isFixed {
|
103 | overflow: hidden;
|
104 | height: 100vh;
|
105 | }
|
106 |
|
107 | .uppy-Dashboard--modal .uppy-Dashboard-overlay {
|
108 | position: fixed;
|
109 | top: 0;
|
110 | left: 0;
|
111 | right: 0;
|
112 | bottom: 0;
|
113 | background-color: rgba($black, 0.5);
|
114 | z-index: $zIndex-2;
|
115 | }
|
116 |
|
117 | .uppy-Dashboard-inner {
|
118 | position: relative;
|
119 | background-color: $gray-50;
|
120 | max-width: 100%;
|
121 | max-height: 100%;
|
122 | outline: none;
|
123 | border: 1px solid $gray-200;
|
124 | border-radius: 5px;
|
125 |
|
126 | .uppy-size--md & {
|
127 | min-height: auto;
|
128 | }
|
129 |
|
130 | @media #{$screen-medium} {
|
131 | width: 750px;
|
132 | height: 550px;
|
133 | }
|
134 |
|
135 | .uppy-Dashboard--modal & {
|
136 | z-index: $zIndex-3;
|
137 | }
|
138 |
|
139 | [data-uppy-theme="dark"] & {
|
140 | background-color: $gray-900;
|
141 | }
|
142 |
|
143 | .uppy-Dashboard--isDisabled & {
|
144 | cursor: not-allowed;
|
145 | }
|
146 | }
|
147 |
|
148 | .uppy-Dashboard-innerWrap {
|
149 | display: flex;
|
150 | flex-direction: column;
|
151 | height: 100%;
|
152 | overflow: hidden;
|
153 | position: relative;
|
154 | border-radius: 5px;
|
155 | opacity: 0;
|
156 |
|
157 | .uppy-Dashboard--isInnerWrapVisible & {
|
158 | opacity: 1;
|
159 | }
|
160 |
|
161 | .uppy-Dashboard--isDisabled & {
|
162 | pointer-events: none;
|
163 | opacity: 0.6;
|
164 | filter: grayscale(100%);
|
165 | user-select: none;
|
166 | }
|
167 | }
|
168 |
|
169 | .uppy-Dashboard--isDisabled .uppy-ProviderIconBg {
|
170 | fill: #9f9f9f;
|
171 | }
|
172 |
|
173 | .uppy-Dashboard--modal .uppy-Dashboard-inner {
|
174 | position: fixed;
|
175 | top: 35px;
|
176 | left: 15px;
|
177 | right: 15px;
|
178 | bottom: 15px;
|
179 | border: none;
|
180 |
|
181 | @media #{$screen-medium} {
|
182 | top: 50%;
|
183 | left: 50%;
|
184 | right: auto;
|
185 | transform: translate(-50%, -50%);
|
186 | box-shadow: 0 5px 15px 4px rgba($black, 0.15);
|
187 | }
|
188 | }
|
189 |
|
190 | .uppy-Dashboard-close {
|
191 | @include clear-focus;
|
192 | display: block;
|
193 | position: absolute;
|
194 | top: -33px;
|
195 | inset-inline-end: -2px;
|
196 | cursor: pointer;
|
197 | color: rgba($white, 0.9);
|
198 | font-size: 27px;
|
199 | z-index: $zIndex-5;
|
200 |
|
201 | &:focus{
|
202 | color: lighten($blue, 25%);
|
203 | }
|
204 |
|
205 | @media #{$screen-medium} {
|
206 | font-size: 35px;
|
207 | top: -10px;
|
208 | inset-inline-end: -35px;
|
209 | }
|
210 | }
|
211 |
|
212 | .uppy-Dashboard-AddFiles {
|
213 | display: flex;
|
214 | justify-content: center;
|
215 | align-items: center;
|
216 | flex-direction: column;
|
217 | height: 100%;
|
218 | position: relative;
|
219 | text-align: center;
|
220 |
|
221 | [data-uppy-drag-drop-supported="true"] & {
|
222 | margin: 7px;
|
223 | height: calc(100% - 14px);
|
224 | border-radius: 3px;
|
225 | border: 1px dashed $gray-250;
|
226 | }
|
227 |
|
228 | .uppy-Dashboard-AddFilesPanel & {
|
229 | border: none;
|
230 | height: calc(100% - 14px - 40px);
|
231 | }
|
232 |
|
233 | .uppy-Dashboard--modal & {
|
234 | border-color: $gray-300;
|
235 | }
|
236 |
|
237 | [data-uppy-theme="dark"] & {
|
238 | border-color: $gray-600;
|
239 | }
|
240 | }
|
241 |
|
242 | .uppy-Dashboard-AddFiles-info {
|
243 | padding-top: 15px;
|
244 | padding-bottom: 15px;
|
245 | margin-top: auto;
|
246 |
|
247 |
|
248 |
|
249 | display: none;
|
250 |
|
251 | .uppy-size--height-md & {
|
252 | display: block;
|
253 | }
|
254 |
|
255 | .uppy-size--md & {
|
256 | position: absolute;
|
257 | bottom: 25px;
|
258 | left: 0;
|
259 | right: 0;
|
260 | padding-top: 30px;
|
261 | padding-bottom: 0;
|
262 | }
|
263 |
|
264 | [data-uppy-num-acquirers="0"] & {
|
265 | margin-top: 0;
|
266 | }
|
267 | }
|
268 |
|
269 | .uppy-Dashboard-browse {
|
270 | @include clear-focus;
|
271 | cursor: pointer;
|
272 | color: rgba($blue, 0.9);
|
273 |
|
274 | &:hover, &:focus {
|
275 | border-bottom: 1px solid $blue;
|
276 | }
|
277 |
|
278 | [data-uppy-theme="dark"] & {
|
279 | color: rgba($highlight--dark, 0.9);
|
280 | }
|
281 |
|
282 | [data-uppy-theme="dark"] &:hover,
|
283 | [data-uppy-theme="dark"] &:focus {
|
284 | border-bottom: 1px solid $highlight--dark;
|
285 | }
|
286 | }
|
287 |
|
288 | .uppy-Dashboard-browseBtn {
|
289 | display: block;
|
290 | font-size: 14px;
|
291 | font-weight: 500;
|
292 | margin-top: 8px;
|
293 | margin-bottom: 5px;
|
294 | width: 100%;
|
295 |
|
296 | .uppy-size--md & {
|
297 | font-size: 15px;
|
298 | width: auto;
|
299 | margin: auto;
|
300 | margin-top: 15px;
|
301 | margin-bottom: 15px;
|
302 | padding: 13px 44px;
|
303 | }
|
304 | }
|
305 |
|
306 | .uppy-Dashboard-AddFiles-list {
|
307 | display: flex;
|
308 | flex-direction: column;
|
309 | flex: 1;
|
310 | overflow-y: auto;
|
311 | -webkit-overflow-scrolling: touch;
|
312 | margin-top: 2px;
|
313 | padding: 2px 0;
|
314 | width: 100%;
|
315 |
|
316 | .uppy-size--md & {
|
317 | flex-direction: row;
|
318 | flex-wrap: wrap;
|
319 | justify-content: center;
|
320 | max-width: 600px;
|
321 | overflow-y: visible;
|
322 | margin-top: 15px;
|
323 | padding-top: 0;
|
324 | flex: none;
|
325 | }
|
326 | }
|
327 |
|
328 | .uppy-DashboardTab {
|
329 | width: 100%;
|
330 | text-align: center;
|
331 | border-bottom: 1px solid $gray-200;
|
332 |
|
333 | [data-uppy-theme="dark"] & {
|
334 | border-bottom: 1px solid $gray-800;
|
335 | }
|
336 |
|
337 | .uppy-size--md & {
|
338 | display: inline-block;
|
339 | width: initial;
|
340 | margin-bottom: 10px;
|
341 | border-bottom: none;
|
342 | }
|
343 | }
|
344 |
|
345 | .uppy-DashboardTab-btn {
|
346 | @include clear-focus;
|
347 | width: 100%;
|
348 | height: 100%;
|
349 | cursor: pointer;
|
350 | border: 0;
|
351 | background-color: transparent;
|
352 | -webkit-appearance: none;
|
353 | appearance: none;
|
354 | color: $gray-700;
|
355 | display: flex;
|
356 | flex-direction: row;
|
357 | align-items: center;
|
358 | padding: 12px 15px;
|
359 | line-height: 1;
|
360 | text-align: center;
|
361 |
|
362 | .uppy-size--md & {
|
363 | width: 86px;
|
364 | margin-inline-end: 1px;
|
365 | flex-direction: column;
|
366 | padding: 10px 3px;
|
367 | border-radius: 5px;
|
368 | }
|
369 |
|
370 | [data-uppy-theme="dark"] & {
|
371 | color: $gray-200;
|
372 | }
|
373 | }
|
374 |
|
375 | .uppy-DashboardTab-btn::-moz-focus-inner {
|
376 | border: 0;
|
377 | }
|
378 |
|
379 | .uppy-DashboardTab-btn:hover {
|
380 | background-color: $gray-100--highlighted;
|
381 |
|
382 | [data-uppy-theme="dark"] & {
|
383 | background-color: $gray-800;
|
384 | }
|
385 | }
|
386 |
|
387 | .uppy-DashboardTab-btn:active,
|
388 | .uppy-DashboardTab-btn:focus {
|
389 | background-color: $highlight;
|
390 |
|
391 | [data-uppy-theme="dark"] & {
|
392 | background-color: $gray-700;
|
393 | }
|
394 | }
|
395 |
|
396 |
|
397 | .uppy-DashboardTab-btn svg {
|
398 | max-width: 100%;
|
399 | max-height: 100%;
|
400 | display: inline-block;
|
401 | vertical-align: text-top;
|
402 | overflow: hidden;
|
403 | transition: transform ease-in-out .15s;
|
404 | margin-inline-end: 10px;
|
405 |
|
406 | .uppy-size--md & {
|
407 | margin-inline-end: 0;
|
408 | }
|
409 | }
|
410 |
|
411 | .uppy-DashboardTab-name {
|
412 | font-size: 14px;
|
413 | font-weight: 500;
|
414 |
|
415 | .uppy-size--md & {
|
416 | font-size: 11px;
|
417 | line-height: 15px;
|
418 | margin-top: 8px;
|
419 | margin-bottom: 0;
|
420 | }
|
421 | }
|
422 |
|
423 |
|
424 | .uppy-DashboardTab svg {
|
425 | width: 23px;
|
426 | height: 23px;
|
427 | vertical-align: middle;
|
428 |
|
429 | .uppy-size--md & {
|
430 | width: 30px;
|
431 | height: 30px;
|
432 | }
|
433 | }
|
434 |
|
435 | .uppy-Dashboard-input {
|
436 | width: 0.1px;
|
437 | height: 0.1px;
|
438 | opacity: 0;
|
439 | overflow: hidden;
|
440 | position: absolute;
|
441 | z-index: -1;
|
442 | }
|
443 |
|
444 | .uppy-DashboardContent-bar {
|
445 | flex-shrink: 0;
|
446 | height: 40px;
|
447 | width: 100%;
|
448 | padding: 0 10px;
|
449 | z-index: $zIndex-4;
|
450 |
|
451 | display: flex;
|
452 | align-items: center;
|
453 | justify-content: space-between;
|
454 |
|
455 |
|
456 | position: relative;
|
457 |
|
458 | border-bottom: 1px solid $gray-200;
|
459 | background-color: $gray-50;
|
460 |
|
461 | .uppy-size--md & {
|
462 | height: 50px;
|
463 | padding: 0 15px;
|
464 | }
|
465 |
|
466 | [data-uppy-theme="dark"] & {
|
467 | background-color: $gray-900;
|
468 | border-bottom: 1px solid $gray-800;
|
469 | }
|
470 | }
|
471 |
|
472 | .uppy-DashboardContent-title {
|
473 | position: absolute;
|
474 | top: 0;
|
475 | left: 0;
|
476 | right: 0;
|
477 | text-align: center;
|
478 | font-size: 12px;
|
479 | line-height: 40px;
|
480 | font-weight: 500;
|
481 |
|
482 | width: 100%;
|
483 | max-width: 170px;
|
484 | text-overflow: ellipsis;
|
485 | white-space: nowrap;
|
486 | overflow-x: hidden;
|
487 | margin: auto;
|
488 |
|
489 | .uppy-size--md & {
|
490 | font-size: 14px;
|
491 | line-height: 50px;
|
492 | max-width: 300px;
|
493 | }
|
494 |
|
495 | [data-uppy-theme="dark"] & {
|
496 | color: $gray-200;
|
497 | }
|
498 | }
|
499 |
|
500 | .uppy-DashboardContent-back {
|
501 | @include reset-button;
|
502 | @include highlight-focus;
|
503 | border-radius: 3px;
|
504 | font-size: 12px;
|
505 | font-weight: 400;
|
506 | cursor: pointer;
|
507 | color: $blue;
|
508 | padding: 7px 6px;
|
509 | margin-inline-start: -6px;
|
510 |
|
511 | .uppy-size--md & {
|
512 | font-size: 14px;
|
513 | }
|
514 |
|
515 | [data-uppy-theme="dark"] & {
|
516 | color: $highlight--dark;
|
517 | }
|
518 | }
|
519 |
|
520 | .uppy-DashboardContent-addMore {
|
521 | @include reset-button;
|
522 | @include highlight-focus;
|
523 | border-radius: 3px;
|
524 | font-weight: 500;
|
525 | cursor: pointer;
|
526 | color: $blue;
|
527 | width: 29px;
|
528 | height: 29px;
|
529 | padding: 7px 8px;
|
530 | margin-inline-end: -5px;
|
531 |
|
532 | .uppy-size--md & {
|
533 | font-size: 14px;
|
534 | width: auto;
|
535 | height: auto;
|
536 | margin-inline-end: -8px;
|
537 | }
|
538 |
|
539 | [data-uppy-theme="dark"] & {
|
540 | color: $highlight--dark;
|
541 | }
|
542 | }
|
543 |
|
544 | .uppy-DashboardContent-addMore svg {
|
545 | vertical-align: baseline;
|
546 | margin-inline-end: 4px;
|
547 |
|
548 | .uppy-size--md & {
|
549 | width: 11px;
|
550 | height: 11px;
|
551 | }
|
552 | }
|
553 |
|
554 | .uppy-DashboardContent-addMoreCaption {
|
555 | display: none;
|
556 |
|
557 | .uppy-size--md & {
|
558 | display: inline;
|
559 | }
|
560 | }
|
561 |
|
562 |
|
563 |
|
564 | .uppy-DashboardContent-panel {
|
565 | position: absolute;
|
566 | top: 0;
|
567 | bottom: 0;
|
568 | left: 0;
|
569 | right: 0;
|
570 | background-color: darken($white, 4%);
|
571 | overflow: hidden;
|
572 | z-index: $zIndex-5;
|
573 | border-radius: 5px;
|
574 | display: flex;
|
575 | flex-direction: column;
|
576 | flex: 1;
|
577 | }
|
578 |
|
579 | .uppy-Dashboard-AddFilesPanel {
|
580 | position: absolute;
|
581 | top: 0;
|
582 | bottom: 0;
|
583 | left: 0;
|
584 | right: 0;
|
585 | background: $gray-50;
|
586 | background: linear-gradient(0deg, $gray-50 35%, rgba($gray-50, 0.85) 100%);
|
587 | box-shadow: 0 0 10px 5px rgba($black, 0.15);
|
588 | overflow: hidden;
|
589 | z-index: $zIndex-5;
|
590 | border-radius: 5px;
|
591 | display: flex;
|
592 | flex-direction: column;
|
593 |
|
594 | [data-uppy-theme="dark"] & {
|
595 | background-color: $gray-800;
|
596 | background: linear-gradient(0deg, $gray-900 35%, rgba($gray-900, 0.85) 100%);
|
597 | }
|
598 | }
|
599 |
|
600 | .uppy-Dashboard--isAddFilesPanelVisible .uppy-Dashboard-files {
|
601 | filter: blur(2px);
|
602 | }
|
603 |
|
604 |
|
605 |
|
606 | .uppy-Dashboard-progress {
|
607 | position: absolute;
|
608 | bottom: 0;
|
609 | left: 0;
|
610 | width: 100%;
|
611 | height: 12%;
|
612 | }
|
613 |
|
614 | .uppy-Dashboard-progressBarContainer.is-active {
|
615 | z-index: $zIndex-4;
|
616 | position: absolute;
|
617 | top: 0;
|
618 | left: 0;
|
619 | width: 100%;
|
620 | height: 100%;
|
621 | }
|
622 |
|
623 |
|
624 | .uppy-Dashboard:not(.uppy-size--md) .uppy-StatusBar-additionalInfo {
|
625 | display: none;
|
626 | }
|
627 |
|
628 | .uppy-Dashboard-filesContainer {
|
629 | @include clearfix;
|
630 | position: relative;
|
631 | overflow-y: hidden;
|
632 | margin: 0;
|
633 | flex: 1;
|
634 | }
|
635 |
|
636 | .uppy-Dashboard-files {
|
637 | margin: 0;
|
638 | padding: 0 0 10px 0;
|
639 | overflow-y: auto;
|
640 | -webkit-overflow-scrolling: touch;
|
641 | flex: 1;
|
642 |
|
643 | .uppy-size--md & {
|
644 | padding-top: 10px;
|
645 | }
|
646 | }
|
647 |
|
648 | .uppy-Dashboard-dropFilesHereHint {
|
649 | display: flex;
|
650 | align-items: center;
|
651 | justify-content: center;
|
652 | visibility: hidden;
|
653 | position: absolute;
|
654 | top: 7px;
|
655 | right: 7px;
|
656 | bottom: 7px;
|
657 | left: 7px;
|
658 | padding-top: 90px;
|
659 | border: 1px dashed $blue;
|
660 | border-radius: 3px;
|
661 | z-index: 2000;
|
662 | text-align: center;
|
663 | background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 1v1C11.85 2 2 11.85 2 24s9.85 22 22 22 22-9.85 22-22S36.15 2 24 2V1zm0 0V0c13.254 0 24 10.746 24 24S37.254 48 24 48 0 37.254 0 24 10.746 0 24 0v1zm7.707 19.293a.999.999 0 1 1-1.414 1.414L25 16.414V34a1 1 0 1 1-2 0V16.414l-5.293 5.293a.999.999 0 1 1-1.414-1.414l7-7a.999.999 0 0 1 1.414 0l7 7z' fill='%232275D7' fill-rule='nonzero'/%3E%3C/svg%3E");
|
664 | background-position: 50% 50%;
|
665 | background-repeat: no-repeat;
|
666 | color: $gray-600;
|
667 | font-size: 16px;
|
668 |
|
669 | [data-uppy-theme="dark"] & {
|
670 | color: $gray-400;
|
671 | border-color: $highlight--dark;
|
672 | background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M24 1v1C11.85 2 2 11.85 2 24s9.85 22 22 22 22-9.85 22-22S36.15 2 24 2V1zm0 0V0c13.254 0 24 10.746 24 24S37.254 48 24 48 0 37.254 0 24 10.746 0 24 0v1zm7.707 19.293a.999.999 0 1 1-1.414 1.414L25 16.414V34a1 1 0 1 1-2 0V16.414l-5.293 5.293a.999.999 0 1 1-1.414-1.414l7-7a.999.999 0 0 1 1.414 0l7 7z' fill='%2302BAF2' fill-rule='nonzero'/%3E%3C/svg%3E");
|
673 | }
|
674 | }
|
675 |
|
676 | .uppy-Dashboard.uppy-Dashboard--isDraggingOver {
|
677 | .uppy-Dashboard-dropFilesHereHint {
|
678 | visibility: visible;
|
679 | }
|
680 | .uppy-DashboardContent-bar,
|
681 | .uppy-Dashboard-files,
|
682 | .uppy-Dashboard-progressindicators {
|
683 | opacity: 0.15;
|
684 | }
|
685 | .uppy-Dashboard-AddFiles {
|
686 | opacity: 0.03;
|
687 | }
|
688 | }
|
689 |
|
690 | .uppy-Dashboard-dropFilesIcon {
|
691 | display: none;
|
692 | margin-bottom: 15px;
|
693 |
|
694 | .uppy-size--md.uppy-size--height-md & {
|
695 | display: block;
|
696 | }
|
697 | }
|
698 |
|
699 | .uppy-Dashboard-AddFiles-title {
|
700 | font-size: 17px;
|
701 | line-height: 1.35;
|
702 | font-weight: 500;
|
703 | color: $black;
|
704 | margin-top: 15px;
|
705 | margin-bottom: 5px;
|
706 | text-align: inline-start;
|
707 | padding: 0 15px;
|
708 | width: 100%;
|
709 |
|
710 | .uppy-size--md & {
|
711 | font-size: 25px;
|
712 | margin-top: 5px;
|
713 | font-weight: 400;
|
714 | text-align: center;
|
715 | max-width: 480px;
|
716 | }
|
717 |
|
718 | [data-uppy-num-acquirers="0"] & {
|
719 | text-align: center;
|
720 | }
|
721 |
|
722 | [data-uppy-theme="dark"] & {
|
723 | color: $gray-200;
|
724 | }
|
725 |
|
726 | button {
|
727 | font-weight: 500;
|
728 | }
|
729 |
|
730 | .uppy-size--md & button {
|
731 | font-weight: 400;
|
732 | }
|
733 | }
|
734 |
|
735 | .uppy-Dashboard-note {
|
736 | font-size: 14px;
|
737 | line-height: 1.25;
|
738 | text-align: center;
|
739 | color: $gray-600;
|
740 | max-width: 350px;
|
741 | margin: auto;
|
742 | padding: 0 15px;
|
743 |
|
744 | .uppy-size--md & {
|
745 | font-size: 15px;
|
746 | line-height: 1.35;
|
747 | max-width: 600px;
|
748 | }
|
749 |
|
750 | [data-uppy-theme="dark"] & {
|
751 | color: $gray-300;
|
752 | }
|
753 | }
|
754 |
|
755 | a.uppy-Dashboard-poweredBy {
|
756 | display: inline-block;
|
757 | text-align: center;
|
758 | font-size: 11px;
|
759 | color: $gray-500;
|
760 | text-decoration: none;
|
761 | margin-top: 8px;
|
762 | }
|
763 |
|
764 | .uppy-Dashboard-poweredByIcon {
|
765 | stroke: $gray-500;
|
766 | fill: none;
|
767 | margin-left: 1px;
|
768 | margin-right: 1px;
|
769 | position: relative;
|
770 | top: 1px;
|
771 | opacity: 0.9;
|
772 | vertical-align: text-top;
|
773 | }
|
774 |
|
775 | .uppy-Dashboard-Item-previewIcon {
|
776 | width: 25px;
|
777 | height: 25px;
|
778 | z-index: $zIndex-1;
|
779 | position: absolute;
|
780 | top: 50%;
|
781 | left: 50%;
|
782 | transform: translate(-50%, -50%);
|
783 |
|
784 | .uppy-size--md & {
|
785 | width: 38px;
|
786 | height: 38px;
|
787 | }
|
788 |
|
789 | svg {
|
790 | width: 100%;
|
791 | height: 100%;
|
792 | }
|
793 | }
|
794 |
|
795 | .uppy-Dashboard-Item-previewIconWrap {
|
796 | height: 76px;
|
797 | max-height: 75%;
|
798 | position: relative;
|
799 | }
|
800 |
|
801 | .uppy-Dashboard-Item-previewIconBg {
|
802 | width: 100%;
|
803 | height: 100%;
|
804 | filter: drop-shadow(rgba($black, 0.1) 0px 1px 1px);
|
805 | }
|
806 |
|
807 | .uppy-Dashboard-upload {
|
808 | position: relative;
|
809 | width: 50px;
|
810 | height: 50px;
|
811 |
|
812 | .uppy-size--md & {
|
813 | width: 60px;
|
814 | height: 60px;
|
815 | }
|
816 | }
|
817 |
|
818 | .uppy-Dashboard-upload .uppy-c-icon {
|
819 | position: relative;
|
820 | top: 1px;
|
821 | width: 50%;
|
822 | }
|
823 |
|
824 | .uppy-Dashboard-uploadCount {
|
825 | position: absolute;
|
826 | top: -12px;
|
827 | inset-inline-end: -12px;
|
828 | background-color: $green;
|
829 | color: $white;
|
830 | border-radius: 50%;
|
831 | width: 16px;
|
832 | height: 16px;
|
833 | line-height: 16px;
|
834 | font-size: 8px;
|
835 |
|
836 | .uppy-size--md & {
|
837 | width: 18px;
|
838 | height: 18px;
|
839 | line-height: 18px;
|
840 | font-size: 9px;
|
841 | }
|
842 | }
|