filepond-rails 0.1.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.
- checksums.yaml +7 -0
- data/MIT-LICENSE +20 -0
- data/README.md +81 -0
- data/Rakefile +8 -0
- data/app/assets/config/filepond_rails_manifest.js +1 -0
- data/app/assets/javascripts/filepond-rails.js +69 -0
- data/app/assets/stylesheets/filepond.css +1047 -0
- data/app/assets/stylesheets/filepond.min.css +8 -0
- data/app/controllers/filepond/rails/application_controller.rb +6 -0
- data/app/controllers/filepond/rails/ingress_controller.rb +61 -0
- data/app/helpers/filepond/rails/application_helper.rb +6 -0
- data/app/jobs/filepond/rails/application_job.rb +6 -0
- data/app/mailers/filepond/rails/application_mailer.rb +8 -0
- data/app/models/filepond/rails/application_record.rb +7 -0
- data/app/views/layouts/filepond/rails/application.html.erb +15 -0
- data/config/importmap.rb +4 -0
- data/config/routes.rb +11 -0
- data/lib/filepond/rails/engine.rb +18 -0
- data/lib/filepond/rails/version.rb +7 -0
- data/lib/filepond/rails.rb +9 -0
- data/lib/tasks/filepond/rails_tasks.rake +5 -0
- metadata +107 -0
|
@@ -0,0 +1,1047 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* FilePond 4.30.4
|
|
3
|
+
* Licensed under MIT, https://opensource.org/licenses/MIT/
|
|
4
|
+
* Please visit https://pqina.nl/filepond/ for details.
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
/* eslint-disable */
|
|
8
|
+
.filepond--assistant {
|
|
9
|
+
position: absolute;
|
|
10
|
+
overflow: hidden;
|
|
11
|
+
height: 1px;
|
|
12
|
+
width: 1px;
|
|
13
|
+
padding: 0;
|
|
14
|
+
border: 0;
|
|
15
|
+
clip: rect(1px, 1px, 1px, 1px);
|
|
16
|
+
-webkit-clip-path: inset(50%);
|
|
17
|
+
clip-path: inset(50%);
|
|
18
|
+
white-space: nowrap;
|
|
19
|
+
}
|
|
20
|
+
/* Hard to override styles */
|
|
21
|
+
.filepond--browser.filepond--browser {
|
|
22
|
+
/* is positioned absolute so it is focusable for form validation errors */
|
|
23
|
+
position: absolute;
|
|
24
|
+
margin: 0;
|
|
25
|
+
padding: 0;
|
|
26
|
+
|
|
27
|
+
/* is positioned ~behind drop label */
|
|
28
|
+
left: 1em;
|
|
29
|
+
top: 1.75em;
|
|
30
|
+
width: calc(100% - 2em);
|
|
31
|
+
|
|
32
|
+
/* hide visually */
|
|
33
|
+
opacity: 0;
|
|
34
|
+
font-size: 0; /* removes text cursor in Internet Explorer 11 */
|
|
35
|
+
}
|
|
36
|
+
.filepond--data {
|
|
37
|
+
position: absolute;
|
|
38
|
+
width: 0;
|
|
39
|
+
height: 0;
|
|
40
|
+
padding: 0;
|
|
41
|
+
margin: 0;
|
|
42
|
+
border: none;
|
|
43
|
+
visibility: hidden;
|
|
44
|
+
pointer-events: none;
|
|
45
|
+
contain: strict;
|
|
46
|
+
}
|
|
47
|
+
.filepond--drip {
|
|
48
|
+
position: absolute;
|
|
49
|
+
top: 0;
|
|
50
|
+
left: 0;
|
|
51
|
+
right: 0;
|
|
52
|
+
bottom: 0;
|
|
53
|
+
overflow: hidden;
|
|
54
|
+
opacity: 0.1;
|
|
55
|
+
|
|
56
|
+
/* can't interact with this element */
|
|
57
|
+
pointer-events: none;
|
|
58
|
+
|
|
59
|
+
/* inherit border radius from parent (needed for drip-blob cut of) */
|
|
60
|
+
border-radius: 0.5em;
|
|
61
|
+
|
|
62
|
+
/* this seems to prevent Chrome from redrawing this layer constantly */
|
|
63
|
+
background: rgba(0, 0, 0, 0.01);
|
|
64
|
+
}
|
|
65
|
+
.filepond--drip-blob {
|
|
66
|
+
position: absolute;
|
|
67
|
+
-webkit-transform-origin: center center;
|
|
68
|
+
transform-origin: center center;
|
|
69
|
+
top: 0;
|
|
70
|
+
left: 0;
|
|
71
|
+
width: 8em;
|
|
72
|
+
height: 8em;
|
|
73
|
+
margin-left: -4em;
|
|
74
|
+
margin-top: -4em;
|
|
75
|
+
background: #292625;
|
|
76
|
+
border-radius: 50%;
|
|
77
|
+
|
|
78
|
+
/* will be animated */
|
|
79
|
+
will-change: transform, opacity;
|
|
80
|
+
}
|
|
81
|
+
.filepond--drop-label {
|
|
82
|
+
position: absolute;
|
|
83
|
+
left: 0;
|
|
84
|
+
right: 0;
|
|
85
|
+
top: 0;
|
|
86
|
+
margin: 0;
|
|
87
|
+
color: #4f4f4f;
|
|
88
|
+
|
|
89
|
+
/* center contents */
|
|
90
|
+
display: flex;
|
|
91
|
+
justify-content: center;
|
|
92
|
+
align-items: center;
|
|
93
|
+
|
|
94
|
+
/* fixes IE11 centering problems (is overruled by label min-height) */
|
|
95
|
+
height: 0px;
|
|
96
|
+
|
|
97
|
+
/* dont allow selection */
|
|
98
|
+
-webkit-user-select: none;
|
|
99
|
+
-moz-user-select: none;
|
|
100
|
+
-ms-user-select: none;
|
|
101
|
+
user-select: none;
|
|
102
|
+
|
|
103
|
+
/* will be animated */
|
|
104
|
+
will-change: transform, opacity;
|
|
105
|
+
}
|
|
106
|
+
/* Hard to override styles on purpose */
|
|
107
|
+
.filepond--drop-label.filepond--drop-label label {
|
|
108
|
+
display: block;
|
|
109
|
+
margin: 0;
|
|
110
|
+
padding: 0.5em; /* use padding instead of margin so click area is not impacted */
|
|
111
|
+
}
|
|
112
|
+
.filepond--drop-label label {
|
|
113
|
+
cursor: default;
|
|
114
|
+
font-size: 0.875em;
|
|
115
|
+
font-weight: normal;
|
|
116
|
+
text-align: center;
|
|
117
|
+
line-height: 1.5;
|
|
118
|
+
}
|
|
119
|
+
.filepond--label-action {
|
|
120
|
+
text-decoration: underline;
|
|
121
|
+
-webkit-text-decoration-skip: ink;
|
|
122
|
+
text-decoration-skip-ink: auto;
|
|
123
|
+
-webkit-text-decoration-color: #a7a4a4;
|
|
124
|
+
text-decoration-color: #a7a4a4;
|
|
125
|
+
cursor: pointer;
|
|
126
|
+
}
|
|
127
|
+
.filepond--root[data-disabled] .filepond--drop-label label {
|
|
128
|
+
opacity: 0.5;
|
|
129
|
+
}
|
|
130
|
+
/* Hard to override styles */
|
|
131
|
+
.filepond--file-action-button.filepond--file-action-button {
|
|
132
|
+
font-size: 1em;
|
|
133
|
+
width: 1.625em;
|
|
134
|
+
height: 1.625em;
|
|
135
|
+
|
|
136
|
+
font-family: inherit;
|
|
137
|
+
line-height: inherit;
|
|
138
|
+
|
|
139
|
+
margin: 0;
|
|
140
|
+
padding: 0;
|
|
141
|
+
border: none;
|
|
142
|
+
outline: none;
|
|
143
|
+
|
|
144
|
+
will-change: transform, opacity;
|
|
145
|
+
|
|
146
|
+
/* hidden label */
|
|
147
|
+
}
|
|
148
|
+
.filepond--file-action-button.filepond--file-action-button span {
|
|
149
|
+
position: absolute;
|
|
150
|
+
overflow: hidden;
|
|
151
|
+
height: 1px;
|
|
152
|
+
width: 1px;
|
|
153
|
+
padding: 0;
|
|
154
|
+
border: 0;
|
|
155
|
+
clip: rect(1px, 1px, 1px, 1px);
|
|
156
|
+
-webkit-clip-path: inset(50%);
|
|
157
|
+
clip-path: inset(50%);
|
|
158
|
+
white-space: nowrap;
|
|
159
|
+
}
|
|
160
|
+
.filepond--file-action-button.filepond--file-action-button {
|
|
161
|
+
/* scale SVG to fill button */
|
|
162
|
+
}
|
|
163
|
+
.filepond--file-action-button.filepond--file-action-button svg {
|
|
164
|
+
width: 100%;
|
|
165
|
+
height: 100%;
|
|
166
|
+
}
|
|
167
|
+
.filepond--file-action-button.filepond--file-action-button {
|
|
168
|
+
/* bigger touch area */
|
|
169
|
+
}
|
|
170
|
+
.filepond--file-action-button.filepond--file-action-button::after {
|
|
171
|
+
position: absolute;
|
|
172
|
+
left: -0.75em;
|
|
173
|
+
right: -0.75em;
|
|
174
|
+
top: -0.75em;
|
|
175
|
+
bottom: -0.75em;
|
|
176
|
+
content: '';
|
|
177
|
+
}
|
|
178
|
+
/* Soft styles */
|
|
179
|
+
.filepond--file-action-button {
|
|
180
|
+
/* use default arrow cursor */
|
|
181
|
+
cursor: auto;
|
|
182
|
+
|
|
183
|
+
/* reset default button styles */
|
|
184
|
+
color: #fff;
|
|
185
|
+
|
|
186
|
+
/* set default look n feel */
|
|
187
|
+
border-radius: 50%;
|
|
188
|
+
background-color: rgba(0, 0, 0, 0.5);
|
|
189
|
+
background-image: none;
|
|
190
|
+
|
|
191
|
+
/* we animate box shadow on focus */
|
|
192
|
+
/* it's only slightly slower than animating */
|
|
193
|
+
/* a pseudo-element with transforms and renders */
|
|
194
|
+
/* a lot better on chrome */
|
|
195
|
+
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
|
|
196
|
+
transition: box-shadow 0.25s ease-in;
|
|
197
|
+
}
|
|
198
|
+
.filepond--file-action-button:hover,
|
|
199
|
+
.filepond--file-action-button:focus {
|
|
200
|
+
box-shadow: 0 0 0 0.125em rgba(255, 255, 255, 0.9);
|
|
201
|
+
}
|
|
202
|
+
.filepond--file-action-button[disabled] {
|
|
203
|
+
color: rgba(255, 255, 255, 0.5);
|
|
204
|
+
background-color: rgba(0, 0, 0, 0.25);
|
|
205
|
+
}
|
|
206
|
+
.filepond--file-action-button[hidden] {
|
|
207
|
+
display: none;
|
|
208
|
+
}
|
|
209
|
+
/* edit button */
|
|
210
|
+
.filepond--action-edit-item.filepond--action-edit-item {
|
|
211
|
+
width: 2em;
|
|
212
|
+
height: 2em;
|
|
213
|
+
padding: 0.1875em;
|
|
214
|
+
}
|
|
215
|
+
.filepond--action-edit-item.filepond--action-edit-item[data-align*='center'] {
|
|
216
|
+
margin-left: -0.1875em;
|
|
217
|
+
}
|
|
218
|
+
.filepond--action-edit-item.filepond--action-edit-item[data-align*='bottom'] {
|
|
219
|
+
margin-bottom: -0.1875em;
|
|
220
|
+
}
|
|
221
|
+
.filepond--action-edit-item-alt {
|
|
222
|
+
border: none;
|
|
223
|
+
line-height: inherit;
|
|
224
|
+
background: transparent;
|
|
225
|
+
font-family: inherit;
|
|
226
|
+
color: inherit;
|
|
227
|
+
outline: none;
|
|
228
|
+
padding: 0;
|
|
229
|
+
margin: 0 0 0 0.25em;
|
|
230
|
+
pointer-events: all;
|
|
231
|
+
position: absolute;
|
|
232
|
+
}
|
|
233
|
+
.filepond--action-edit-item-alt svg {
|
|
234
|
+
width: 1.3125em;
|
|
235
|
+
height: 1.3125em;
|
|
236
|
+
}
|
|
237
|
+
.filepond--action-edit-item-alt span {
|
|
238
|
+
font-size: 0;
|
|
239
|
+
opacity: 0;
|
|
240
|
+
}
|
|
241
|
+
.filepond--file-info {
|
|
242
|
+
position: static;
|
|
243
|
+
display: flex;
|
|
244
|
+
flex-direction: column;
|
|
245
|
+
align-items: flex-start;
|
|
246
|
+
flex: 1;
|
|
247
|
+
margin: 0 0.5em 0 0;
|
|
248
|
+
min-width: 0;
|
|
249
|
+
|
|
250
|
+
/* will be animated */
|
|
251
|
+
will-change: transform, opacity;
|
|
252
|
+
|
|
253
|
+
/* can't do anything with this info */
|
|
254
|
+
pointer-events: none;
|
|
255
|
+
-webkit-user-select: none;
|
|
256
|
+
-moz-user-select: none;
|
|
257
|
+
-ms-user-select: none;
|
|
258
|
+
user-select: none;
|
|
259
|
+
|
|
260
|
+
/* no margins on children */
|
|
261
|
+
}
|
|
262
|
+
.filepond--file-info * {
|
|
263
|
+
margin: 0;
|
|
264
|
+
}
|
|
265
|
+
.filepond--file-info {
|
|
266
|
+
/* we don't want to have these overrules so these selectors are a bit more specific */
|
|
267
|
+
}
|
|
268
|
+
.filepond--file-info .filepond--file-info-main {
|
|
269
|
+
font-size: 0.75em;
|
|
270
|
+
line-height: 1.2;
|
|
271
|
+
|
|
272
|
+
/* we want ellipsis if this bar gets too wide */
|
|
273
|
+
text-overflow: ellipsis;
|
|
274
|
+
overflow: hidden;
|
|
275
|
+
white-space: nowrap;
|
|
276
|
+
width: 100%;
|
|
277
|
+
}
|
|
278
|
+
.filepond--file-info .filepond--file-info-sub {
|
|
279
|
+
font-size: 0.625em;
|
|
280
|
+
opacity: 0.5;
|
|
281
|
+
transition: opacity 0.25s ease-in-out;
|
|
282
|
+
white-space: nowrap;
|
|
283
|
+
}
|
|
284
|
+
.filepond--file-info .filepond--file-info-sub:empty {
|
|
285
|
+
display: none;
|
|
286
|
+
}
|
|
287
|
+
.filepond--file-status {
|
|
288
|
+
position: static;
|
|
289
|
+
display: flex;
|
|
290
|
+
flex-direction: column;
|
|
291
|
+
align-items: flex-end;
|
|
292
|
+
flex-grow: 0;
|
|
293
|
+
flex-shrink: 0;
|
|
294
|
+
|
|
295
|
+
margin: 0;
|
|
296
|
+
min-width: 2.25em;
|
|
297
|
+
text-align: right;
|
|
298
|
+
|
|
299
|
+
/* will be animated */
|
|
300
|
+
will-change: transform, opacity;
|
|
301
|
+
|
|
302
|
+
/* can't do anything with this info */
|
|
303
|
+
pointer-events: none;
|
|
304
|
+
-webkit-user-select: none;
|
|
305
|
+
-moz-user-select: none;
|
|
306
|
+
-ms-user-select: none;
|
|
307
|
+
user-select: none;
|
|
308
|
+
|
|
309
|
+
/* no margins on children */
|
|
310
|
+
}
|
|
311
|
+
.filepond--file-status * {
|
|
312
|
+
margin: 0;
|
|
313
|
+
white-space: nowrap;
|
|
314
|
+
}
|
|
315
|
+
.filepond--file-status {
|
|
316
|
+
/* font sizes */
|
|
317
|
+
}
|
|
318
|
+
.filepond--file-status .filepond--file-status-main {
|
|
319
|
+
font-size: 0.75em;
|
|
320
|
+
line-height: 1.2;
|
|
321
|
+
}
|
|
322
|
+
.filepond--file-status .filepond--file-status-sub {
|
|
323
|
+
font-size: 0.625em;
|
|
324
|
+
opacity: 0.5;
|
|
325
|
+
transition: opacity 0.25s ease-in-out;
|
|
326
|
+
}
|
|
327
|
+
/* Hard to override styles */
|
|
328
|
+
.filepond--file-wrapper.filepond--file-wrapper {
|
|
329
|
+
border: none;
|
|
330
|
+
margin: 0;
|
|
331
|
+
padding: 0;
|
|
332
|
+
min-width: 0;
|
|
333
|
+
height: 100%;
|
|
334
|
+
|
|
335
|
+
/* hide legend for visual users */
|
|
336
|
+
}
|
|
337
|
+
.filepond--file-wrapper.filepond--file-wrapper > legend {
|
|
338
|
+
position: absolute;
|
|
339
|
+
overflow: hidden;
|
|
340
|
+
height: 1px;
|
|
341
|
+
width: 1px;
|
|
342
|
+
padding: 0;
|
|
343
|
+
border: 0;
|
|
344
|
+
clip: rect(1px, 1px, 1px, 1px);
|
|
345
|
+
-webkit-clip-path: inset(50%);
|
|
346
|
+
clip-path: inset(50%);
|
|
347
|
+
white-space: nowrap;
|
|
348
|
+
}
|
|
349
|
+
.filepond--file {
|
|
350
|
+
position: static;
|
|
351
|
+
display: flex;
|
|
352
|
+
height: 100%;
|
|
353
|
+
align-items: flex-start;
|
|
354
|
+
|
|
355
|
+
padding: 0.5625em 0.5625em;
|
|
356
|
+
|
|
357
|
+
color: #fff;
|
|
358
|
+
border-radius: 0.5em;
|
|
359
|
+
|
|
360
|
+
/* control positions */
|
|
361
|
+
}
|
|
362
|
+
.filepond--file .filepond--file-status {
|
|
363
|
+
margin-left: auto;
|
|
364
|
+
margin-right: 2.25em;
|
|
365
|
+
}
|
|
366
|
+
.filepond--file .filepond--processing-complete-indicator {
|
|
367
|
+
pointer-events: none;
|
|
368
|
+
-webkit-user-select: none;
|
|
369
|
+
-moz-user-select: none;
|
|
370
|
+
-ms-user-select: none;
|
|
371
|
+
user-select: none;
|
|
372
|
+
z-index: 3;
|
|
373
|
+
}
|
|
374
|
+
.filepond--file .filepond--processing-complete-indicator,
|
|
375
|
+
.filepond--file .filepond--progress-indicator,
|
|
376
|
+
.filepond--file .filepond--file-action-button {
|
|
377
|
+
position: absolute;
|
|
378
|
+
}
|
|
379
|
+
.filepond--file {
|
|
380
|
+
/* .filepond--file-action-button */
|
|
381
|
+
}
|
|
382
|
+
.filepond--file [data-align*='left'] {
|
|
383
|
+
left: 0.5625em;
|
|
384
|
+
}
|
|
385
|
+
.filepond--file [data-align*='right'] {
|
|
386
|
+
right: 0.5625em;
|
|
387
|
+
}
|
|
388
|
+
.filepond--file [data-align*='center'] {
|
|
389
|
+
left: calc(50% - 0.8125em); /* .8125 is half of button width */
|
|
390
|
+
}
|
|
391
|
+
.filepond--file [data-align*='bottom'] {
|
|
392
|
+
bottom: 1.125em;
|
|
393
|
+
}
|
|
394
|
+
.filepond--file [data-align='center'] {
|
|
395
|
+
top: calc(50% - 0.8125em);
|
|
396
|
+
}
|
|
397
|
+
.filepond--file .filepond--progress-indicator {
|
|
398
|
+
margin-top: 0.1875em;
|
|
399
|
+
}
|
|
400
|
+
.filepond--file .filepond--progress-indicator[data-align*='right'] {
|
|
401
|
+
margin-right: 0.1875em;
|
|
402
|
+
}
|
|
403
|
+
.filepond--file .filepond--progress-indicator[data-align*='left'] {
|
|
404
|
+
margin-left: 0.1875em;
|
|
405
|
+
}
|
|
406
|
+
/* make sure text does not overlap */
|
|
407
|
+
[data-filepond-item-state='cancelled'] .filepond--file-info,
|
|
408
|
+
[data-filepond-item-state*='invalid'] .filepond--file-info,
|
|
409
|
+
[data-filepond-item-state*='error'] .filepond--file-info {
|
|
410
|
+
margin-right: 2.25em;
|
|
411
|
+
}
|
|
412
|
+
[data-filepond-item-state~='processing'] .filepond--file-status-sub {
|
|
413
|
+
opacity: 0;
|
|
414
|
+
}
|
|
415
|
+
[data-filepond-item-state~='processing']
|
|
416
|
+
.filepond--action-abort-item-processing
|
|
417
|
+
~ .filepond--file-status
|
|
418
|
+
.filepond--file-status-sub {
|
|
419
|
+
opacity: 0.5;
|
|
420
|
+
}
|
|
421
|
+
[data-filepond-item-state='processing-error'] .filepond--file-status-sub {
|
|
422
|
+
opacity: 0;
|
|
423
|
+
}
|
|
424
|
+
[data-filepond-item-state='processing-error']
|
|
425
|
+
.filepond--action-retry-item-processing
|
|
426
|
+
~ .filepond--file-status
|
|
427
|
+
.filepond--file-status-sub {
|
|
428
|
+
opacity: 0.5;
|
|
429
|
+
}
|
|
430
|
+
[data-filepond-item-state='processing-complete'] {
|
|
431
|
+
/* busy state */
|
|
432
|
+
}
|
|
433
|
+
[data-filepond-item-state='processing-complete'] .filepond--action-revert-item-processing svg {
|
|
434
|
+
-webkit-animation: fall 0.5s 0.125s linear both;
|
|
435
|
+
animation: fall 0.5s 0.125s linear both;
|
|
436
|
+
}
|
|
437
|
+
[data-filepond-item-state='processing-complete'] {
|
|
438
|
+
/* hide details by default, only show when can revert */
|
|
439
|
+
}
|
|
440
|
+
[data-filepond-item-state='processing-complete'] .filepond--file-status-sub {
|
|
441
|
+
opacity: 0.5;
|
|
442
|
+
}
|
|
443
|
+
[data-filepond-item-state='processing-complete']
|
|
444
|
+
.filepond--processing-complete-indicator:not([style*='hidden'])
|
|
445
|
+
~ .filepond--file-status
|
|
446
|
+
.filepond--file-status-sub {
|
|
447
|
+
opacity: 0;
|
|
448
|
+
}
|
|
449
|
+
[data-filepond-item-state='processing-complete'] .filepond--file-info-sub {
|
|
450
|
+
opacity: 0;
|
|
451
|
+
}
|
|
452
|
+
[data-filepond-item-state='processing-complete']
|
|
453
|
+
.filepond--action-revert-item-processing
|
|
454
|
+
~ .filepond--file-info
|
|
455
|
+
.filepond--file-info-sub {
|
|
456
|
+
opacity: 0.5;
|
|
457
|
+
}
|
|
458
|
+
/* file state can be invalid or error, both are visually similar but */
|
|
459
|
+
/* having them as separate states might be useful */
|
|
460
|
+
[data-filepond-item-state*='invalid'] .filepond--panel,
|
|
461
|
+
[data-filepond-item-state*='invalid'] .filepond--file-wrapper,
|
|
462
|
+
[data-filepond-item-state*='error'] .filepond--panel,
|
|
463
|
+
[data-filepond-item-state*='error'] .filepond--file-wrapper {
|
|
464
|
+
-webkit-animation: shake 0.65s linear both;
|
|
465
|
+
animation: shake 0.65s linear both;
|
|
466
|
+
}
|
|
467
|
+
/* spins progress indicator when file is marked as busy */
|
|
468
|
+
[data-filepond-item-state*='busy'] .filepond--progress-indicator svg {
|
|
469
|
+
-webkit-animation: spin 1s linear infinite;
|
|
470
|
+
animation: spin 1s linear infinite;
|
|
471
|
+
}
|
|
472
|
+
/**
|
|
473
|
+
* States
|
|
474
|
+
*/
|
|
475
|
+
@-webkit-keyframes spin {
|
|
476
|
+
0% {
|
|
477
|
+
-webkit-transform: rotateZ(0deg);
|
|
478
|
+
transform: rotateZ(0deg);
|
|
479
|
+
}
|
|
480
|
+
|
|
481
|
+
100% {
|
|
482
|
+
-webkit-transform: rotateZ(360deg);
|
|
483
|
+
transform: rotateZ(360deg);
|
|
484
|
+
}
|
|
485
|
+
}
|
|
486
|
+
@keyframes spin {
|
|
487
|
+
0% {
|
|
488
|
+
-webkit-transform: rotateZ(0deg);
|
|
489
|
+
transform: rotateZ(0deg);
|
|
490
|
+
}
|
|
491
|
+
|
|
492
|
+
100% {
|
|
493
|
+
-webkit-transform: rotateZ(360deg);
|
|
494
|
+
transform: rotateZ(360deg);
|
|
495
|
+
}
|
|
496
|
+
}
|
|
497
|
+
@-webkit-keyframes shake {
|
|
498
|
+
10%,
|
|
499
|
+
90% {
|
|
500
|
+
-webkit-transform: translateX(-0.0625em);
|
|
501
|
+
transform: translateX(-0.0625em);
|
|
502
|
+
}
|
|
503
|
+
|
|
504
|
+
20%,
|
|
505
|
+
80% {
|
|
506
|
+
-webkit-transform: translateX(0.125em);
|
|
507
|
+
transform: translateX(0.125em);
|
|
508
|
+
}
|
|
509
|
+
|
|
510
|
+
30%,
|
|
511
|
+
50%,
|
|
512
|
+
70% {
|
|
513
|
+
-webkit-transform: translateX(-0.25em);
|
|
514
|
+
transform: translateX(-0.25em);
|
|
515
|
+
}
|
|
516
|
+
|
|
517
|
+
40%,
|
|
518
|
+
60% {
|
|
519
|
+
-webkit-transform: translateX(0.25em);
|
|
520
|
+
transform: translateX(0.25em);
|
|
521
|
+
}
|
|
522
|
+
}
|
|
523
|
+
@keyframes shake {
|
|
524
|
+
10%,
|
|
525
|
+
90% {
|
|
526
|
+
-webkit-transform: translateX(-0.0625em);
|
|
527
|
+
transform: translateX(-0.0625em);
|
|
528
|
+
}
|
|
529
|
+
|
|
530
|
+
20%,
|
|
531
|
+
80% {
|
|
532
|
+
-webkit-transform: translateX(0.125em);
|
|
533
|
+
transform: translateX(0.125em);
|
|
534
|
+
}
|
|
535
|
+
|
|
536
|
+
30%,
|
|
537
|
+
50%,
|
|
538
|
+
70% {
|
|
539
|
+
-webkit-transform: translateX(-0.25em);
|
|
540
|
+
transform: translateX(-0.25em);
|
|
541
|
+
}
|
|
542
|
+
|
|
543
|
+
40%,
|
|
544
|
+
60% {
|
|
545
|
+
-webkit-transform: translateX(0.25em);
|
|
546
|
+
transform: translateX(0.25em);
|
|
547
|
+
}
|
|
548
|
+
}
|
|
549
|
+
@-webkit-keyframes fall {
|
|
550
|
+
0% {
|
|
551
|
+
opacity: 0;
|
|
552
|
+
-webkit-transform: scale(0.5);
|
|
553
|
+
transform: scale(0.5);
|
|
554
|
+
-webkit-animation-timing-function: ease-out;
|
|
555
|
+
animation-timing-function: ease-out;
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
70% {
|
|
559
|
+
opacity: 1;
|
|
560
|
+
-webkit-transform: scale(1.1);
|
|
561
|
+
transform: scale(1.1);
|
|
562
|
+
-webkit-animation-timing-function: ease-in-out;
|
|
563
|
+
animation-timing-function: ease-in-out;
|
|
564
|
+
}
|
|
565
|
+
|
|
566
|
+
100% {
|
|
567
|
+
-webkit-transform: scale(1);
|
|
568
|
+
transform: scale(1);
|
|
569
|
+
-webkit-animation-timing-function: ease-out;
|
|
570
|
+
animation-timing-function: ease-out;
|
|
571
|
+
}
|
|
572
|
+
}
|
|
573
|
+
@keyframes fall {
|
|
574
|
+
0% {
|
|
575
|
+
opacity: 0;
|
|
576
|
+
-webkit-transform: scale(0.5);
|
|
577
|
+
transform: scale(0.5);
|
|
578
|
+
-webkit-animation-timing-function: ease-out;
|
|
579
|
+
animation-timing-function: ease-out;
|
|
580
|
+
}
|
|
581
|
+
|
|
582
|
+
70% {
|
|
583
|
+
opacity: 1;
|
|
584
|
+
-webkit-transform: scale(1.1);
|
|
585
|
+
transform: scale(1.1);
|
|
586
|
+
-webkit-animation-timing-function: ease-in-out;
|
|
587
|
+
animation-timing-function: ease-in-out;
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
100% {
|
|
591
|
+
-webkit-transform: scale(1);
|
|
592
|
+
transform: scale(1);
|
|
593
|
+
-webkit-animation-timing-function: ease-out;
|
|
594
|
+
animation-timing-function: ease-out;
|
|
595
|
+
}
|
|
596
|
+
}
|
|
597
|
+
/* ignore all other interaction elements while dragging a file */
|
|
598
|
+
.filepond--hopper[data-hopper-state='drag-over'] > * {
|
|
599
|
+
pointer-events: none;
|
|
600
|
+
}
|
|
601
|
+
/* capture all hit tests using a hidden layer, this speeds up the event flow */
|
|
602
|
+
.filepond--hopper[data-hopper-state='drag-over']::after {
|
|
603
|
+
content: '';
|
|
604
|
+
position: absolute;
|
|
605
|
+
left: 0;
|
|
606
|
+
top: 0;
|
|
607
|
+
right: 0;
|
|
608
|
+
bottom: 0;
|
|
609
|
+
z-index: 100;
|
|
610
|
+
}
|
|
611
|
+
.filepond--progress-indicator {
|
|
612
|
+
z-index: 103;
|
|
613
|
+
}
|
|
614
|
+
.filepond--file-action-button {
|
|
615
|
+
z-index: 102;
|
|
616
|
+
}
|
|
617
|
+
.filepond--file-status {
|
|
618
|
+
z-index: 101;
|
|
619
|
+
}
|
|
620
|
+
.filepond--file-info {
|
|
621
|
+
z-index: 100;
|
|
622
|
+
}
|
|
623
|
+
.filepond--item {
|
|
624
|
+
position: absolute;
|
|
625
|
+
top: 0;
|
|
626
|
+
left: 0;
|
|
627
|
+
right: 0;
|
|
628
|
+
z-index: 1;
|
|
629
|
+
|
|
630
|
+
padding: 0;
|
|
631
|
+
margin: 0.25em;
|
|
632
|
+
|
|
633
|
+
will-change: transform, opacity;
|
|
634
|
+
|
|
635
|
+
/* item children order */
|
|
636
|
+
}
|
|
637
|
+
.filepond--item > .filepond--panel {
|
|
638
|
+
z-index: -1;
|
|
639
|
+
}
|
|
640
|
+
/* has a slight shadow */
|
|
641
|
+
.filepond--item > .filepond--panel .filepond--panel-bottom {
|
|
642
|
+
box-shadow: 0 0.0625em 0.125em -0.0625em rgba(0, 0, 0, 0.25);
|
|
643
|
+
}
|
|
644
|
+
.filepond--item {
|
|
645
|
+
/* drag related */
|
|
646
|
+
}
|
|
647
|
+
.filepond--item > .filepond--file-wrapper,
|
|
648
|
+
.filepond--item > .filepond--panel {
|
|
649
|
+
transition: opacity 0.15s ease-out;
|
|
650
|
+
}
|
|
651
|
+
.filepond--item[data-drag-state] {
|
|
652
|
+
cursor: -webkit-grab;
|
|
653
|
+
cursor: grab;
|
|
654
|
+
}
|
|
655
|
+
.filepond--item[data-drag-state] > .filepond--panel {
|
|
656
|
+
transition: box-shadow 0.125s ease-in-out;
|
|
657
|
+
box-shadow: 0 0 0 rgba(0, 0, 0, 0);
|
|
658
|
+
}
|
|
659
|
+
.filepond--item[data-drag-state='drag'] {
|
|
660
|
+
cursor: -webkit-grabbing;
|
|
661
|
+
cursor: grabbing;
|
|
662
|
+
}
|
|
663
|
+
.filepond--item[data-drag-state='drag'] > .filepond--panel {
|
|
664
|
+
box-shadow: 0 0.125em 0.3125em rgba(0, 0, 0, 0.325);
|
|
665
|
+
}
|
|
666
|
+
.filepond--item[data-drag-state]:not([data-drag-state='idle']) {
|
|
667
|
+
z-index: 2;
|
|
668
|
+
}
|
|
669
|
+
/* states */
|
|
670
|
+
.filepond--item-panel {
|
|
671
|
+
background-color: #64605e;
|
|
672
|
+
}
|
|
673
|
+
[data-filepond-item-state='processing-complete'] .filepond--item-panel {
|
|
674
|
+
background-color: #369763;
|
|
675
|
+
}
|
|
676
|
+
[data-filepond-item-state*='invalid'] .filepond--item-panel,
|
|
677
|
+
[data-filepond-item-state*='error'] .filepond--item-panel {
|
|
678
|
+
background-color: #c44e47;
|
|
679
|
+
}
|
|
680
|
+
/* style of item panel */
|
|
681
|
+
.filepond--item-panel {
|
|
682
|
+
border-radius: 0.5em;
|
|
683
|
+
transition: background-color 0.25s;
|
|
684
|
+
}
|
|
685
|
+
/* normal mode */
|
|
686
|
+
.filepond--list-scroller {
|
|
687
|
+
position: absolute;
|
|
688
|
+
top: 0;
|
|
689
|
+
left: 0;
|
|
690
|
+
right: 0;
|
|
691
|
+
margin: 0;
|
|
692
|
+
will-change: transform;
|
|
693
|
+
}
|
|
694
|
+
/* scroll mode */
|
|
695
|
+
.filepond--list-scroller[data-state='overflow'] .filepond--list {
|
|
696
|
+
bottom: 0;
|
|
697
|
+
right: 0;
|
|
698
|
+
}
|
|
699
|
+
.filepond--list-scroller[data-state='overflow'] {
|
|
700
|
+
overflow-y: scroll;
|
|
701
|
+
overflow-x: hidden;
|
|
702
|
+
-webkit-overflow-scrolling: touch;
|
|
703
|
+
-webkit-mask: linear-gradient(to bottom, #000 calc(100% - 0.5em), transparent 100%);
|
|
704
|
+
mask: linear-gradient(to bottom, #000 calc(100% - 0.5em), transparent 100%);
|
|
705
|
+
}
|
|
706
|
+
/* style scrollbar */
|
|
707
|
+
.filepond--list-scroller::-webkit-scrollbar {
|
|
708
|
+
background: transparent;
|
|
709
|
+
}
|
|
710
|
+
.filepond--list-scroller::-webkit-scrollbar:vertical {
|
|
711
|
+
width: 1em;
|
|
712
|
+
}
|
|
713
|
+
.filepond--list-scroller::-webkit-scrollbar:horizontal {
|
|
714
|
+
height: 0;
|
|
715
|
+
}
|
|
716
|
+
.filepond--list-scroller::-webkit-scrollbar-thumb {
|
|
717
|
+
background-color: rgba(0, 0, 0, 0.3);
|
|
718
|
+
border-radius: 99999px;
|
|
719
|
+
border: 0.3125em solid transparent;
|
|
720
|
+
background-clip: content-box;
|
|
721
|
+
}
|
|
722
|
+
/* hard to overide styles on purpose */
|
|
723
|
+
.filepond--list.filepond--list {
|
|
724
|
+
position: absolute;
|
|
725
|
+
top: 0;
|
|
726
|
+
margin: 0;
|
|
727
|
+
padding: 0;
|
|
728
|
+
list-style-type: none;
|
|
729
|
+
|
|
730
|
+
/* prevents endless paint calls on filepond--list-scroller */
|
|
731
|
+
will-change: transform;
|
|
732
|
+
}
|
|
733
|
+
/* used for padding so allowed to be restyled */
|
|
734
|
+
.filepond--list {
|
|
735
|
+
left: 0.75em;
|
|
736
|
+
right: 0.75em;
|
|
737
|
+
}
|
|
738
|
+
.filepond--root[data-style-panel-layout~='integrated'] {
|
|
739
|
+
width: 100%;
|
|
740
|
+
height: 100%;
|
|
741
|
+
max-width: none;
|
|
742
|
+
margin: 0;
|
|
743
|
+
}
|
|
744
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--panel-root,
|
|
745
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--panel-root {
|
|
746
|
+
border-radius: 0;
|
|
747
|
+
}
|
|
748
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--panel-root > *,
|
|
749
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--panel-root > * {
|
|
750
|
+
display: none;
|
|
751
|
+
}
|
|
752
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--drop-label,
|
|
753
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--drop-label {
|
|
754
|
+
bottom: 0;
|
|
755
|
+
height: auto;
|
|
756
|
+
display: flex;
|
|
757
|
+
justify-content: center;
|
|
758
|
+
align-items: center;
|
|
759
|
+
z-index: 7;
|
|
760
|
+
}
|
|
761
|
+
.filepond--root[data-style-panel-layout~='circle'],
|
|
762
|
+
.filepond--root[data-style-panel-layout~='integrated'] {
|
|
763
|
+
/* we're only loading one item, this makes the intro animation a bit nicer */
|
|
764
|
+
}
|
|
765
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--item-panel,
|
|
766
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--item-panel {
|
|
767
|
+
display: none;
|
|
768
|
+
}
|
|
769
|
+
.filepond--root[data-style-panel-layout~='compact'] .filepond--list-scroller,
|
|
770
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--list-scroller {
|
|
771
|
+
overflow: hidden;
|
|
772
|
+
height: 100%;
|
|
773
|
+
margin-top: 0;
|
|
774
|
+
margin-bottom: 0;
|
|
775
|
+
}
|
|
776
|
+
.filepond--root[data-style-panel-layout~='compact'] .filepond--list,
|
|
777
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--list {
|
|
778
|
+
left: 0;
|
|
779
|
+
right: 0;
|
|
780
|
+
height: 100%;
|
|
781
|
+
}
|
|
782
|
+
.filepond--root[data-style-panel-layout~='compact'] .filepond--item,
|
|
783
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--item {
|
|
784
|
+
margin: 0;
|
|
785
|
+
}
|
|
786
|
+
.filepond--root[data-style-panel-layout~='compact'] .filepond--file-wrapper,
|
|
787
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--file-wrapper {
|
|
788
|
+
height: 100%;
|
|
789
|
+
}
|
|
790
|
+
.filepond--root[data-style-panel-layout~='compact'] .filepond--drop-label,
|
|
791
|
+
.filepond--root[data-style-panel-layout~='integrated'] .filepond--drop-label {
|
|
792
|
+
z-index: 7;
|
|
793
|
+
}
|
|
794
|
+
.filepond--root[data-style-panel-layout~='circle'] {
|
|
795
|
+
border-radius: 99999rem;
|
|
796
|
+
overflow: hidden;
|
|
797
|
+
}
|
|
798
|
+
.filepond--root[data-style-panel-layout~='circle'] > .filepond--panel {
|
|
799
|
+
border-radius: inherit;
|
|
800
|
+
}
|
|
801
|
+
.filepond--root[data-style-panel-layout~='circle'] > .filepond--panel > * {
|
|
802
|
+
display: none;
|
|
803
|
+
}
|
|
804
|
+
.filepond--root[data-style-panel-layout~='circle'] {
|
|
805
|
+
/* circle cuts of this info, so best to hide it */
|
|
806
|
+
}
|
|
807
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--file-info {
|
|
808
|
+
display: none;
|
|
809
|
+
}
|
|
810
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--file-status {
|
|
811
|
+
display: none;
|
|
812
|
+
}
|
|
813
|
+
.filepond--root[data-style-panel-layout~='circle'] .filepond--action-edit-item {
|
|
814
|
+
opacity: 1 !important;
|
|
815
|
+
visibility: visible !important;
|
|
816
|
+
}
|
|
817
|
+
/* dirfty way to fix circular overflow issue on safari 11+ */
|
|
818
|
+
@media not all and (min-resolution: 0.001dpcm) {
|
|
819
|
+
@supports (-webkit-appearance: none) and (stroke-color: transparent) {
|
|
820
|
+
.filepond--root[data-style-panel-layout~='circle'] {
|
|
821
|
+
will-change: transform;
|
|
822
|
+
}
|
|
823
|
+
}
|
|
824
|
+
}
|
|
825
|
+
.filepond--panel-root {
|
|
826
|
+
border-radius: 0.5em;
|
|
827
|
+
background-color: #f1f0ef;
|
|
828
|
+
}
|
|
829
|
+
.filepond--panel {
|
|
830
|
+
position: absolute;
|
|
831
|
+
left: 0;
|
|
832
|
+
top: 0;
|
|
833
|
+
right: 0;
|
|
834
|
+
margin: 0;
|
|
835
|
+
|
|
836
|
+
/* defaults to 100% height (fixed height mode) this fixes problem with panel height in IE11 */
|
|
837
|
+
height: 100% !important;
|
|
838
|
+
|
|
839
|
+
/* no interaction possible with panel */
|
|
840
|
+
pointer-events: none;
|
|
841
|
+
}
|
|
842
|
+
.filepond-panel:not([data-scalable='false']) {
|
|
843
|
+
height: auto !important;
|
|
844
|
+
}
|
|
845
|
+
.filepond--panel[data-scalable='false'] > div {
|
|
846
|
+
display: none;
|
|
847
|
+
}
|
|
848
|
+
.filepond--panel[data-scalable='true'] {
|
|
849
|
+
/* this seems to fix Chrome performance issues */
|
|
850
|
+
/* - when box-shadow is enabled */
|
|
851
|
+
/* - when multiple ponds are active on the same page */
|
|
852
|
+
-webkit-transform-style: preserve-3d;
|
|
853
|
+
transform-style: preserve-3d;
|
|
854
|
+
|
|
855
|
+
/* prevent borders and backgrounds */
|
|
856
|
+
background-color: transparent !important;
|
|
857
|
+
border: none !important;
|
|
858
|
+
}
|
|
859
|
+
.filepond--panel-top,
|
|
860
|
+
.filepond--panel-bottom,
|
|
861
|
+
.filepond--panel-center {
|
|
862
|
+
position: absolute;
|
|
863
|
+
left: 0;
|
|
864
|
+
top: 0;
|
|
865
|
+
right: 0;
|
|
866
|
+
margin: 0;
|
|
867
|
+
padding: 0;
|
|
868
|
+
}
|
|
869
|
+
.filepond--panel-top,
|
|
870
|
+
.filepond--panel-bottom {
|
|
871
|
+
height: 0.5em;
|
|
872
|
+
}
|
|
873
|
+
.filepond--panel-top {
|
|
874
|
+
border-bottom-left-radius: 0 !important;
|
|
875
|
+
border-bottom-right-radius: 0 !important;
|
|
876
|
+
border-bottom: none !important;
|
|
877
|
+
|
|
878
|
+
/* fixes tiny transparant line between top and center panel */
|
|
879
|
+
}
|
|
880
|
+
.filepond--panel-top::after {
|
|
881
|
+
content: '';
|
|
882
|
+
position: absolute;
|
|
883
|
+
height: 2px;
|
|
884
|
+
left: 0;
|
|
885
|
+
right: 0;
|
|
886
|
+
bottom: -1px;
|
|
887
|
+
background-color: inherit;
|
|
888
|
+
}
|
|
889
|
+
.filepond--panel-center,
|
|
890
|
+
.filepond--panel-bottom {
|
|
891
|
+
will-change: transform;
|
|
892
|
+
-webkit-backface-visibility: hidden;
|
|
893
|
+
backface-visibility: hidden;
|
|
894
|
+
-webkit-transform-origin: left top;
|
|
895
|
+
transform-origin: left top;
|
|
896
|
+
-webkit-transform: translate3d(0, 0.5em, 0);
|
|
897
|
+
transform: translate3d(0, 0.5em, 0);
|
|
898
|
+
}
|
|
899
|
+
.filepond--panel-bottom {
|
|
900
|
+
border-top-left-radius: 0 !important;
|
|
901
|
+
border-top-right-radius: 0 !important;
|
|
902
|
+
border-top: none !important;
|
|
903
|
+
|
|
904
|
+
/* fixes tiny transparant line between bottom and center of panel */
|
|
905
|
+
}
|
|
906
|
+
.filepond--panel-bottom::before {
|
|
907
|
+
content: '';
|
|
908
|
+
position: absolute;
|
|
909
|
+
height: 2px;
|
|
910
|
+
left: 0;
|
|
911
|
+
right: 0;
|
|
912
|
+
top: -1px;
|
|
913
|
+
background-color: inherit;
|
|
914
|
+
}
|
|
915
|
+
.filepond--panel-center {
|
|
916
|
+
/* the center panel is scaled using scale3d to fit the correct height */
|
|
917
|
+
/* we use 100px instead of 1px as scaling 1px to a huge height is really laggy on chrome */
|
|
918
|
+
height: 100px !important;
|
|
919
|
+
border-top: none !important;
|
|
920
|
+
border-bottom: none !important;
|
|
921
|
+
border-radius: 0 !important;
|
|
922
|
+
|
|
923
|
+
/* hide if not transformed, prevents a little flash when the panel is at 100px height while attached for first time */
|
|
924
|
+
}
|
|
925
|
+
.filepond--panel-center:not([style]) {
|
|
926
|
+
visibility: hidden;
|
|
927
|
+
}
|
|
928
|
+
.filepond--progress-indicator {
|
|
929
|
+
position: static;
|
|
930
|
+
width: 1.25em;
|
|
931
|
+
height: 1.25em;
|
|
932
|
+
|
|
933
|
+
color: #fff;
|
|
934
|
+
|
|
935
|
+
/* can't have margins */
|
|
936
|
+
margin: 0;
|
|
937
|
+
|
|
938
|
+
/* no interaction possible with progress indicator */
|
|
939
|
+
pointer-events: none;
|
|
940
|
+
|
|
941
|
+
/* will be animated */
|
|
942
|
+
will-change: transform, opacity;
|
|
943
|
+
}
|
|
944
|
+
.filepond--progress-indicator svg {
|
|
945
|
+
width: 100%;
|
|
946
|
+
height: 100%;
|
|
947
|
+
vertical-align: top;
|
|
948
|
+
transform-box: fill-box; /* should center the animation correctly when zoomed in */
|
|
949
|
+
}
|
|
950
|
+
.filepond--progress-indicator path {
|
|
951
|
+
fill: none;
|
|
952
|
+
stroke: currentColor;
|
|
953
|
+
}
|
|
954
|
+
.filepond--list-scroller {
|
|
955
|
+
z-index: 6;
|
|
956
|
+
}
|
|
957
|
+
.filepond--drop-label {
|
|
958
|
+
z-index: 5;
|
|
959
|
+
}
|
|
960
|
+
.filepond--drip {
|
|
961
|
+
z-index: 3;
|
|
962
|
+
}
|
|
963
|
+
.filepond--root > .filepond--panel {
|
|
964
|
+
z-index: 2;
|
|
965
|
+
}
|
|
966
|
+
.filepond--browser {
|
|
967
|
+
z-index: 1;
|
|
968
|
+
}
|
|
969
|
+
.filepond--root {
|
|
970
|
+
/* layout*/
|
|
971
|
+
box-sizing: border-box;
|
|
972
|
+
position: relative;
|
|
973
|
+
margin-bottom: 1em;
|
|
974
|
+
|
|
975
|
+
/* base font size for whole component */
|
|
976
|
+
font-size: 1rem;
|
|
977
|
+
|
|
978
|
+
/* base line height */
|
|
979
|
+
line-height: normal;
|
|
980
|
+
|
|
981
|
+
/* up uses default system font family */
|
|
982
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif,
|
|
983
|
+
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
|
|
984
|
+
|
|
985
|
+
/* will increase font weight a bit on Safari */
|
|
986
|
+
font-weight: 450;
|
|
987
|
+
|
|
988
|
+
/* default text alignment */
|
|
989
|
+
text-align: left;
|
|
990
|
+
|
|
991
|
+
/* better text rendering on Safari */
|
|
992
|
+
text-rendering: optimizeLegibility;
|
|
993
|
+
|
|
994
|
+
/* text direction is ltr for now */
|
|
995
|
+
direction: ltr;
|
|
996
|
+
|
|
997
|
+
/* optimize rendering */
|
|
998
|
+
/* https://developer.mozilla.org/en-US/docs/Web/CSS/contain */
|
|
999
|
+
contain: layout style size;
|
|
1000
|
+
|
|
1001
|
+
/* correct box sizing, line-height and positioning on child elements */
|
|
1002
|
+
}
|
|
1003
|
+
.filepond--root * {
|
|
1004
|
+
box-sizing: inherit;
|
|
1005
|
+
line-height: inherit;
|
|
1006
|
+
}
|
|
1007
|
+
.filepond--root *:not(text) {
|
|
1008
|
+
font-size: inherit;
|
|
1009
|
+
}
|
|
1010
|
+
.filepond--root {
|
|
1011
|
+
/* block everything */
|
|
1012
|
+
}
|
|
1013
|
+
.filepond--root[data-disabled] {
|
|
1014
|
+
pointer-events: none;
|
|
1015
|
+
}
|
|
1016
|
+
.filepond--root[data-disabled] .filepond--list-scroller {
|
|
1017
|
+
pointer-events: all;
|
|
1018
|
+
}
|
|
1019
|
+
.filepond--root[data-disabled] .filepond--list {
|
|
1020
|
+
pointer-events: none;
|
|
1021
|
+
}
|
|
1022
|
+
/**
|
|
1023
|
+
* Root element children layout
|
|
1024
|
+
*/
|
|
1025
|
+
.filepond--root .filepond--drop-label {
|
|
1026
|
+
min-height: 4.75em;
|
|
1027
|
+
}
|
|
1028
|
+
.filepond--root .filepond--list-scroller {
|
|
1029
|
+
margin-top: 1em;
|
|
1030
|
+
margin-bottom: 1em;
|
|
1031
|
+
}
|
|
1032
|
+
.filepond--root .filepond--credits {
|
|
1033
|
+
position: absolute;
|
|
1034
|
+
right: 0;
|
|
1035
|
+
opacity: 0.175;
|
|
1036
|
+
line-height: 0.85;
|
|
1037
|
+
font-size: 11px;
|
|
1038
|
+
color: inherit;
|
|
1039
|
+
text-decoration: none;
|
|
1040
|
+
z-index: 3;
|
|
1041
|
+
bottom: -14px;
|
|
1042
|
+
}
|
|
1043
|
+
.filepond--root .filepond--credits[style] {
|
|
1044
|
+
top: 0;
|
|
1045
|
+
bottom: auto;
|
|
1046
|
+
margin-top: 14px;
|
|
1047
|
+
}
|