a#uploadswitcher, a.underline { text-decoration: underline; } .upload-container { label { @extend %button-defaults; text-align: center; width: 80px; } input { display: none } } #dropbox { display: inline-block; background: $medium-gray; border: $default-border; @extend %rounded-border; padding: $default-padding 2*$default-padding; text-align: center; line-height: 19px; width: 364px; margin-left: 4px; &.dragover { background: $dark-gray; color: $light-gray; border-color: $light-gray; } } .overall-upload { display: none; overflow: hidden; @include border-radius($default-border-radius); background-color: $medium-gray; border: $default-border; margin-bottom: 2*$default-margin; .progress { width: 0%; height: 24px; line-height: 24px; color: $text-color; background-color: $success_background_color; text-indent: 2*$default-padding; overflow: visible; white-space: nowrap; } } #uploadProgressContainer { overflow-x: hidden; overflow-y: auto; height: 234px; } #uploadProgressContainer .progressWrapper { padding: 2*$default-padding; background-color: $medium-gray; position: relative; margin-bottom: 8px; border: 1px solid #9e9e9e; @extend %rounded-border; } #uploadProgressContainer .progressName, #uploadProgressContainer .progressBarStatus { margin-bottom: 4px; } #uploadProgressContainer .progressBarStatus { font-size: 10px; } #uploadProgressContainer .progressName { text-shadow: 0 1px 2px #ffffff; } #uploadProgressContainer .progressBarContainer { background-color: #f9f9f9; border: 1px solid #9e9e9e; @extend %rounded-border; height: 16px; overflow: hidden; width: 100%; } #uploadProgressContainer .progressBarInProgress { background-color: $info_background_color; height: 16px; width: 0; } #uploadProgressContainer .progressBarComplete { background-color: $success_background_color; height: 16px; width: 0; } #uploadProgressContainer .progressBarError { background-color: $error_background_color; height: 16px; width: 0; } #uploadProgressContainer .progressBarCanceled { background-color: #c9c9c9; height: 16px; width: 0; } #uploadProgressContainer .progressCancel { @extend .icon-cross; width: 16px; height: 16px; position: absolute; top: 8px; right: 4px; }