|
3 | 3 | * dropify v0.2.0 - Override your input files with style. |
4 | 4 | * https://github.com/JeremyFagis/dropify |
5 | 5 | * |
6 | | - * (c) 2015 - Jeremy FAGIS <[email protected]> (http://fagis.fr) |
| 6 | + * (c) 2016 - Jeremy FAGIS <[email protected]> (http://fagis.fr) |
7 | 7 | * ============================================================= |
8 | 8 | */ |
9 | 9 |
|
|
54 | 54 | text-align: center; |
55 | 55 | border: 2px solid #E5E5E5; |
56 | 56 | -webkit-transition: border-color 0.15s linear; |
57 | | - transition: border-color 0.15s linear; } |
| 57 | + transition: border-color 0.15s linear; } |
58 | 58 | .dropify-wrapper:hover { |
59 | 59 | background-size: 30px 30px; |
60 | 60 | background-image: -webkit-linear-gradient(135deg, #F6F6F6 25%, transparent 25%, transparent 50%, #F6F6F6 50%, #F6F6F6 75%, transparent 75%, transparent); |
|
98 | 98 | position: relative; |
99 | 99 | top: 50%; |
100 | 100 | -webkit-transform: translateY(-50%); |
101 | | - -ms-transform: translateY(-50%); |
102 | 101 | transform: translateY(-50%); } |
103 | 102 | .dropify-wrapper .dropify-message span.file-icon { |
104 | 103 | font-size: 50px; |
|
125 | 124 | font-weight: bold; |
126 | 125 | color: #FFF; |
127 | 126 | -webkit-transition: all 0.15s linear; |
128 | | - transition: all 0.15s linear; } |
| 127 | + transition: all 0.15s linear; } |
129 | 128 | .dropify-wrapper .dropify-clear:hover { |
130 | 129 | background: rgba(255, 255, 255, 0.2); } |
131 | 130 | .dropify-wrapper .dropify-preview { |
|
145 | 144 | .dropify-wrapper .dropify-preview .dropify-render img { |
146 | 145 | top: 50%; |
147 | 146 | -webkit-transform: translate(0, -50%); |
148 | | - -ms-transform: translate(0, -50%); |
149 | 147 | transform: translate(0, -50%); |
150 | 148 | position: relative; |
151 | 149 | max-width: 100%; |
152 | 150 | max-height: 100%; |
153 | 151 | background-color: #FFF; |
154 | 152 | -webkit-transition: border-color 0.15s linear; |
155 | | - transition: border-color 0.15s linear; } |
| 153 | + transition: border-color 0.15s linear; } |
156 | 154 | .dropify-wrapper .dropify-preview .dropify-render i { |
157 | 155 | font-size: 70px; |
158 | 156 | top: 50%; |
159 | 157 | left: 50%; |
160 | 158 | -webkit-transform: translate(-50%, -50%); |
161 | | - -ms-transform: translate(-50%, -50%); |
162 | 159 | transform: translate(-50%, -50%); |
163 | 160 | position: absolute; |
164 | 161 | color: #777; } |
|
167 | 164 | top: 50%; |
168 | 165 | left: 50%; |
169 | 166 | -webkit-transform: translate(-50%, -50%); |
170 | | - -ms-transform: translate(-50%, -50%); |
171 | 167 | transform: translate(-50%, -50%); |
172 | 168 | margin-top: 10px; |
173 | 169 | text-transform: uppercase; |
|
188 | 184 | background: rgba(0, 0, 0, 0.7); |
189 | 185 | opacity: 0; |
190 | 186 | -webkit-transition: opacity 0.15s linear; |
191 | | - transition: opacity 0.15s linear; } |
| 187 | + transition: opacity 0.15s linear; } |
192 | 188 | .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner { |
193 | 189 | position: absolute; |
194 | 190 | top: 50%; |
195 | 191 | -webkit-transform: translate(0, -40%); |
196 | | - -ms-transform: translate(0, -40%); |
197 | 192 | transform: translate(0, -40%); |
198 | 193 | -webkit-backface-visibility: hidden; |
199 | 194 | backface-visibility: hidden; |
200 | 195 | width: 100%; |
201 | 196 | padding: 0 20px; |
202 | 197 | -webkit-transition: all 0.2s ease; |
203 | | - transition: all 0.2s ease; } |
| 198 | + transition: all 0.2s ease; } |
204 | 199 | .dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p { |
205 | 200 | padding: 0; |
206 | 201 | margin: 0; |
|
227 | 222 | top: 0; |
228 | 223 | left: 50%; |
229 | 224 | -webkit-transform: translate(-50%, 0); |
230 | | - -ms-transform: translate(-50%, 0); |
231 | 225 | transform: translate(-50%, 0); |
232 | 226 | background: #FFF; |
233 | 227 | width: 30px; |
|
253 | 247 | .dropify-wrapper.touch-fallback .dropify-preview .dropify-render .dropify-font-file { |
254 | 248 | position: relative; |
255 | 249 | -webkit-transform: translate(0, 0); |
256 | | - -ms-transform: translate(0, 0); |
257 | 250 | transform: translate(0, 0); |
258 | 251 | top: 0; |
259 | 252 | left: 0; } |
|
263 | 256 | .dropify-wrapper.touch-fallback .dropify-preview .dropify-render img { |
264 | 257 | position: relative; |
265 | 258 | -webkit-transform: translate(0, 0); |
266 | | - -ms-transform: translate(0, 0); |
267 | 259 | transform: translate(0, 0); } |
268 | 260 | .dropify-wrapper.touch-fallback .dropify-preview .dropify-infos { |
269 | 261 | position: relative; |
|
273 | 265 | position: relative; |
274 | 266 | top: 0; |
275 | 267 | -webkit-transform: translate(0, 0); |
276 | | - -ms-transform: translate(0, 0); |
277 | 268 | transform: translate(0, 0); |
278 | 269 | padding: 5px 90px 5px 0; } |
279 | 270 | .dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p { |
|
299 | 290 | display: none; } |
300 | 291 | .dropify-wrapper.touch-fallback .dropify-message { |
301 | 292 | -webkit-transform: translate(0, 0); |
302 | | - -ms-transform: translate(0, 0); |
303 | 293 | transform: translate(0, 0); |
304 | 294 | padding: 40px 0; } |
305 | 295 | .dropify-wrapper.touch-fallback .dropify-clear { |
|
343 | 333 | visibility: hidden; |
344 | 334 | opacity: 0; |
345 | 335 | -webkit-transition: visibility 0s linear 0.15s,opacity 0.15s linear; |
346 | | - transition: visibility 0s linear 0.15s,opacity 0.15s linear; } |
| 336 | + transition: visibility 0s linear 0.15s,opacity 0.15s linear; } |
347 | 337 | .dropify-wrapper .dropify-errors-container ul { |
348 | 338 | padding: 10px 20px; |
349 | 339 | margin: 0; |
350 | 340 | position: absolute; |
351 | 341 | left: 0; |
352 | 342 | top: 50%; |
353 | 343 | -webkit-transform: translateY(-50%); |
354 | | - -ms-transform: translateY(-50%); |
355 | 344 | transform: translateY(-50%); } |
356 | 345 | .dropify-wrapper .dropify-errors-container ul li { |
357 | 346 | margin-left: 20px; |
|
0 commit comments