/* The MIT License */
|
// Copyright (c) 2012 Matias Meno <m@tias.me>
|
// Permission is hereby granted, free of charge, to any person obtaining a copy of
|
// this software and associated documentation files (the "Software"), to deal in
|
// the Software without restriction, including without limitation the rights to
|
// use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
|
// of the Software, and to permit persons to whom the Software is furnished to do
|
// so, subject to the following conditions:
|
|
// The above copyright notice and this permission notice shall be included in all
|
// copies or substantial portions of the Software.
|
|
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
// SOFTWARE.
|
|
@import "nib"
|
|
.dropzone
|
.dropzone *
|
.dropzone-previews
|
.dropzone-previews *
|
box-sizing border-box
|
|
|
.dropzone
|
position relative
|
border 1px solid rgba(0, 0, 0, 0.08)
|
background rgba(0, 0, 0, 0.02)
|
padding 1em
|
|
&.dz-clickable
|
cursor pointer
|
.dz-message
|
.dz-message span
|
cursor pointer
|
*
|
cursor default
|
|
.dz-message
|
opacity 1
|
|
&.dz-drag-hover
|
border-color rgba(0, 0, 0, 0.15)
|
background rgba(0, 0, 0, 0.04)
|
|
&.dz-started
|
.dz-message
|
display none
|
|
.dropzone
|
.dropzone-previews
|
.dz-preview
|
background rgba(255, 255, 255, 0.8)
|
position relative
|
display inline-block
|
margin 17px
|
|
vertical-align top
|
|
border 1px solid #acacac
|
|
padding 6px 6px 6px 6px
|
|
&.dz-file-preview
|
[data-dz-thumbnail]
|
display none
|
|
.dz-details
|
width 100px
|
height @width
|
position relative
|
background #ebebeb
|
padding 5px
|
margin-bottom 22px
|
|
.dz-filename
|
overflow hidden
|
height 100%
|
|
|
img
|
absolute top left
|
width @width
|
height @width
|
|
.dz-size
|
absolute bottom -28px left 3px
|
height 28px
|
line-height @height
|
|
|
&.dz-error
|
.dz-error-mark
|
display block
|
&.dz-success
|
.dz-success-mark
|
display block
|
|
|
&:hover
|
.dz-details
|
img
|
display none
|
|
|
.dz-success-mark
|
.dz-error-mark
|
display none
|
position absolute
|
|
width 40px
|
height 40px
|
|
font-size 30px
|
text-align center
|
right -10px
|
top -10px
|
|
.dz-success-mark
|
color #8CC657
|
.dz-error-mark
|
color #EE162D
|
|
|
.dz-progress
|
position absolute
|
top 100px
|
left 6px
|
right 6px
|
height 6px
|
background #d7d7d7
|
display none
|
|
.dz-upload
|
position absolute
|
top 0
|
bottom 0
|
left 0
|
width 0%
|
background-color #8CC657
|
|
|
&.dz-processing
|
.dz-progress
|
display block
|
|
|
.dz-error-message
|
display none
|
absolute top -5px left -20px
|
background rgba(245, 245, 245, 0.8)
|
padding 8px 10px
|
color #800
|
min-width 140px
|
max-width 500px
|
z-index 500
|
&:hover.dz-error
|
.dz-error-message
|
display block
|
