@import-once 'variables'; .uploader { h1 { margin: 10px 0px; } .dropzone { border: 2px dotted @pfm-purple; background: lighten(@pfm-purple, 25%); padding: 10px; color: darken(@pfm-purple, 25%); margin-bottom: 10px; p { padding: 0px; margin: 0px; } &.file-over { background: lighten(@pfm-purple, 5%); } } .close-button { .border-radius(0px); width: auto; margin-bottom: 10px; float: none; display: block; } .uploads { margin: 0px; padding: 0px; list-style: none; li { margin-bottom: 5px; background: #eee; font-size: 9pt; position: relative; z-index: 1; color: #444; border: 2px solid #aaa; p { margin: 5px; padding: 0px; height: 26px; line-height: 26px; a { } } .bar { position: absolute; bottom: 0px; left: 0px; height: 10px; z-index: -1; background: @pfm-purple; display: none; } &.has-error { border-color: @red; .bar { display: none; } } &.uploading { .bar { display: block; } } &.is-processing { border-color: @blue; .bar { display: none; } } } } }