142 lines
2.1 KiB
Stylus
142 lines
2.1 KiB
Stylus
@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
|
|
|
|
&.clickable
|
|
cursor pointer
|
|
.message
|
|
cursor pointer
|
|
*
|
|
cursor default
|
|
|
|
.message
|
|
opacity 1
|
|
|
|
&.drag-hover
|
|
border-color rgba(0, 0, 0, 0.15)
|
|
background rgba(0, 0, 0, 0.04)
|
|
|
|
&.started
|
|
.message
|
|
display none
|
|
|
|
.dropzone
|
|
.dropzone-previews
|
|
.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 28px 6px
|
|
|
|
.details
|
|
width 100px
|
|
height @width
|
|
position relative
|
|
background #ebebeb
|
|
padding 5px
|
|
|
|
.filename
|
|
overflow hidden
|
|
height 100%
|
|
|
|
|
|
img
|
|
absolute top left
|
|
width @width
|
|
height @width
|
|
|
|
.size
|
|
absolute bottom -28px left 3px
|
|
height 28px
|
|
line-height @height
|
|
|
|
|
|
&.error
|
|
.error-mark
|
|
display block
|
|
&.success
|
|
.success-mark
|
|
display block
|
|
|
|
|
|
&:hover
|
|
.details
|
|
img
|
|
display none
|
|
.success-mark
|
|
.error-mark
|
|
display none
|
|
|
|
|
|
.success-mark
|
|
.error-mark
|
|
display none
|
|
position absolute
|
|
|
|
width 40px
|
|
height 40px
|
|
|
|
font-size 30px
|
|
text-align center
|
|
right -10px
|
|
top -10px
|
|
|
|
.success-mark
|
|
color #8CC657
|
|
.error-mark
|
|
color #EE162D
|
|
|
|
|
|
.progress
|
|
position absolute
|
|
top 100px
|
|
left 6px
|
|
right 6px
|
|
height 6px
|
|
background #d7d7d7
|
|
display none
|
|
|
|
.upload
|
|
position absolute
|
|
top 0
|
|
bottom 0
|
|
left 0
|
|
width 0%
|
|
background-color #8CC657
|
|
|
|
|
|
&.processing
|
|
.progress
|
|
display block
|
|
|
|
|
|
.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.error
|
|
.error-message
|
|
display block
|