@import "../styles/mixins/index.less"; @import "../styles/themes/index.less"; .@{wux-prefix}-upload { position: relative; display: block; .clearfix(); &--disabled { opacity: @disabled-opacity; } &--picture-card { .@{wux-prefix}-upload__select { .square(@upload-size); border: @border-width-base @upload-normal-border-style @upload-normal-border-color; border-radius: @upload-border-radius; margin: 0 8px 8px 0; background-color: @upload-bg; transition: border-color .3s ease; box-sizing: border-box; float: left; } .@{wux-prefix}-upload__button { width: 100%; height: 100%; display: flex; text-align: center; justify-content: center; align-items: center; vertical-align: middle; padding: 4px; box-sizing: border-box; image { width: 100%; height: 100%; display: inline-block; overflow: hidden; } } .@{wux-prefix}-upload__files { position: relative; display: block; float: left; .clearfix(); } .@{wux-prefix}-upload__file { .square(@upload-size); float: left; margin: 0 8px 8px 0; padding: 4px; border-radius: @upload-border-radius; border: @border-width-base @upload-success-border-style @upload-normal-border-color; position: relative; box-sizing: border-box; &--uploading { border-style: @upload-normal-border-style; } &--error { border-color: @upload-error-border-color; } } .@{wux-prefix}-upload__thumb { width: 100%; height: 100%; display: inline-block; overflow: hidden; } .@{wux-prefix}-upload__remove { .square(@upload-icon-size); position: absolute; right: 6px; top: 6px; text-align: right; vertical-align: top; z-index: 2; background-repeat: no-repeat; background-size: @upload-icon-size auto; .encoded-svg-background(upload_delete); } } }