-
Notifications
You must be signed in to change notification settings - Fork 61
/
filedrop.css
40 lines (37 loc) · 1.02 KB
/
filedrop.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
/***
Styles below are only required if you're using <iframe> fallback in
addition to HTML5 drag & drop (only working in Firefox/Chrome/Opera 15+).
You can @import this file and override individual styles. Drag & drop zone
can be styled in absolutely any way you want so there are no defaults.
***/
/* Essential FileDrop zone element configuration: */
.fd-zone {
position: relative;
overflow: hidden;
/***
This way you can create a pretty box that will be both clickable and droppable:
***
width: 15em;
margin: 0 auto;
text-align: center;
*/
}
/* Hides <input type="file"> while simulating "Browse" button: */
.fd-file {
opacity: 0;
font-size: 118px;
position: absolute;
right: 0;
top: 0;
z-index: 1;
padding: 0;
margin: 0;
cursor: pointer;
filter: alpha(opacity=0);
font-family: sans-serif;
}
/***
With .over you can provide feedback when user drags a file over the drop zone:
***
.fd-zone.over { border-color: maroon; background: #eee; }
*/