/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */ /* stylelint-disable no-duplicate-selectors */ /* stylelint-disable */ /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */ .ant-upload { font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 14px; font-variant: tabular-nums; line-height: 1.5; color: rgba(0, 0, 0, 0.65); -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; list-style: none; outline: 0; } .ant-upload p { margin: 0; } .ant-upload-btn { display: block; width: 100%; outline: none; } .ant-upload input[type='file'] { cursor: pointer; } .ant-upload.ant-upload-select { display: inline-block; } .ant-upload.ant-upload-select-picture-card { border: 1px dashed #d9d9d9; width: 104px; height: 104px; border-radius: 4px; background-color: #fafafa; text-align: center; cursor: pointer; -webkit-transition: border-color 0.3s ease; transition: border-color 0.3s ease; vertical-align: top; margin-right: 8px; margin-bottom: 8px; display: table; } .ant-upload.ant-upload-select-picture-card > .ant-upload { width: 100%; height: 100%; display: table-cell; text-align: center; vertical-align: middle; padding: 8px; } .ant-upload.ant-upload-select-picture-card:hover { border-color: #1890ff; } .ant-upload.ant-upload-drag { border: 1px dashed #d9d9d9; -webkit-transition: border-color 0.3s; transition: border-color 0.3s; cursor: pointer; border-radius: 4px; text-align: center; width: 100%; height: 100%; position: relative; background: #fafafa; } .ant-upload.ant-upload-drag .ant-upload { padding: 16px 0; } .ant-upload.ant-upload-drag.ant-upload-drag-hover:not(.ant-upload-disabled) { border: 2px dashed #40a9ff; } .ant-upload.ant-upload-drag.ant-upload-disabled { cursor: not-allowed; } .ant-upload.ant-upload-drag .ant-upload-btn { display: table; height: 100%; } .ant-upload.ant-upload-drag .ant-upload-drag-container { display: table-cell; vertical-align: middle; } .ant-upload.ant-upload-drag:not(.ant-upload-disabled):hover { border-color: #40a9ff; } .ant-upload.ant-upload-drag p.ant-upload-drag-icon { margin-bottom: 20px; } .ant-upload.ant-upload-drag p.ant-upload-drag-icon .anticon { font-size: 48px; color: #40a9ff; } .ant-upload.ant-upload-drag p.ant-upload-text { font-size: 16px; margin: 0 0 4px; color: rgba(0, 0, 0, 0.85); } .ant-upload.ant-upload-drag p.ant-upload-hint { font-size: 14px; color: rgba(0, 0, 0, 0.45); } .ant-upload.ant-upload-drag .anticon-plus { font-size: 30px; -webkit-transition: all 0.3s; transition: all 0.3s; color: rgba(0, 0, 0, 0.25); } .ant-upload.ant-upload-drag .anticon-plus:hover { color: rgba(0, 0, 0, 0.45); } .ant-upload.ant-upload-drag:hover .anticon-plus { color: rgba(0, 0, 0, 0.45); } .ant-upload-list { font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 14px; font-variant: tabular-nums; line-height: 1.5; color: rgba(0, 0, 0, 0.65); -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; list-style: none; zoom: 1; } .ant-upload-list:before, .ant-upload-list:after { content: ''; display: table; } .ant-upload-list:after { clear: both; } .ant-upload-list-item { margin-top: 8px; font-size: 14px; position: relative; height: 22px; } .ant-upload-list-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 22px; width: 100%; display: inline-block; } .ant-upload-list-item-info { height: 100%; padding: 0 12px 0 4px; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .ant-upload-list-item-info > span { display: block; } .ant-upload-list-item-info .anticon-loading, .ant-upload-list-item-info .anticon-paper-clip { font-size: 14px; color: rgba(0, 0, 0, 0.45); position: absolute; top: 5px; } .ant-upload-list-item .anticon-close { display: inline-block; font-size: 12px; font-size: 10px \9; -webkit-transform: scale(0.83333333) rotate(0deg); -ms-transform: scale(0.83333333) rotate(0deg); transform: scale(0.83333333) rotate(0deg); -webkit-transition: all 0.3s; transition: all 0.3s; opacity: 0; cursor: pointer; position: absolute; top: 6px; right: 4px; color: rgba(0, 0, 0, 0.45); line-height: 0; } :root .ant-upload-list-item .anticon-close { font-size: 12px; } .ant-upload-list-item .anticon-close:hover { color: rgba(0, 0, 0, 0.65); } .ant-upload-list-item:hover .ant-upload-list-item-info { background-color: #e6f7ff; } .ant-upload-list-item:hover .anticon-close { opacity: 1; } .ant-upload-list-item-error, .ant-upload-list-item-error .anticon-paper-clip, .ant-upload-list-item-error .ant-upload-list-item-name { color: #f5222d; } .ant-upload-list-item-error .anticon-close { opacity: 1; color: #f5222d !important; } .ant-upload-list-item-progress { line-height: 0; font-size: 14px; position: absolute; width: 100%; bottom: -12px; padding-left: 26px; } .ant-upload-list-picture .ant-upload-list-item, .ant-upload-list-picture-card .ant-upload-list-item { padding: 8px; border-radius: 4px; border: 1px solid #d9d9d9; height: 66px; position: relative; } .ant-upload-list-picture .ant-upload-list-item:hover, .ant-upload-list-picture-card .ant-upload-list-item:hover { background: transparent; } .ant-upload-list-picture .ant-upload-list-item-error, .ant-upload-list-picture-card .ant-upload-list-item-error { border-color: #f5222d; } .ant-upload-list-picture .ant-upload-list-item-info, .ant-upload-list-picture-card .ant-upload-list-item-info { padding: 0; } .ant-upload-list-picture .ant-upload-list-item:hover .ant-upload-list-item-info, .ant-upload-list-picture-card .ant-upload-list-item:hover .ant-upload-list-item-info { background: transparent; } .ant-upload-list-picture .ant-upload-list-item-uploading, .ant-upload-list-picture-card .ant-upload-list-item-uploading { border-style: dashed; } .ant-upload-list-picture .ant-upload-list-item-thumbnail, .ant-upload-list-picture-card .ant-upload-list-item-thumbnail { width: 48px; height: 48px; position: absolute; top: 8px; left: 8px; text-align: center; line-height: 54px; font-size: 26px; opacity: 0.8; } .ant-upload-list-picture .ant-upload-list-item-icon, .ant-upload-list-picture-card .ant-upload-list-item-icon { font-size: 26px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .ant-upload-list-picture .ant-upload-list-item-thumbnail img, .ant-upload-list-picture-card .ant-upload-list-item-thumbnail img { width: 48px; height: 48px; display: block; overflow: hidden; } .ant-upload-list-picture .ant-upload-list-item-name, .ant-upload-list-picture-card .ant-upload-list-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0 0 0 8px; line-height: 44px; -webkit-transition: all 0.3s; transition: all 0.3s; padding-left: 48px; padding-right: 8px; max-width: 100%; display: inline-block; -webkit-box-sizing: border-box; box-sizing: border-box; } .ant-upload-list-picture .ant-upload-list-item-uploading .ant-upload-list-item-name, .ant-upload-list-picture-card .ant-upload-list-item-uploading .ant-upload-list-item-name { line-height: 28px; } .ant-upload-list-picture .ant-upload-list-item-progress, .ant-upload-list-picture-card .ant-upload-list-item-progress { padding-left: 56px; margin-top: 0; bottom: 14px; width: calc(100% - 24px); } .ant-upload-list-picture .anticon-close, .ant-upload-list-picture-card .anticon-close { position: absolute; right: 8px; top: 8px; line-height: 1; opacity: 1; } .ant-upload-list-picture-card { float: left; } .ant-upload-list-picture-card.ant-upload-list:after { display: none; } .ant-upload-list-picture-card .ant-upload-list-item { float: left; width: 104px; height: 104px; margin: 0 8px 8px 0; } .ant-upload-list-picture-card .ant-upload-list-item-info { height: 100%; position: relative; overflow: hidden; } .ant-upload-list-picture-card .ant-upload-list-item-info:before { content: ' '; position: absolute; z-index: 1; background-color: rgba(0, 0, 0, 0.5); -webkit-transition: all 0.3s; transition: all 0.3s; width: 100%; height: 100%; opacity: 0; } .ant-upload-list-picture-card .ant-upload-list-item:hover .ant-upload-list-item-info:before { opacity: 1; } .ant-upload-list-picture-card .ant-upload-list-item-actions { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; white-space: nowrap; opacity: 0; -webkit-transition: all 0.3s; transition: all 0.3s; } .ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-eye-o, .ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-delete { z-index: 10; -webkit-transition: all 0.3s; transition: all 0.3s; cursor: pointer; font-size: 16px; width: 16px; color: rgba(255, 255, 255, 0.85); margin: 0 4px; } .ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-eye-o:hover, .ant-upload-list-picture-card .ant-upload-list-item-actions .anticon-delete:hover { color: #fff; } .ant-upload-list-picture-card .ant-upload-list-item-info:hover + .ant-upload-list-item-actions, .ant-upload-list-picture-card .ant-upload-list-item-actions:hover { opacity: 1; } .ant-upload-list-picture-card .ant-upload-list-item-thumbnail, .ant-upload-list-picture-card .ant-upload-list-item-thumbnail img { display: block; width: 100%; height: 100%; position: static; } .ant-upload-list-picture-card .ant-upload-list-item-name { margin: 8px 0 0; padding: 0; text-align: center; line-height: 1.5; display: none; } .ant-upload-list-picture-card .anticon-picture + .ant-upload-list-item-name { display: block; } .ant-upload-list-picture-card .ant-upload-list-item-uploading.ant-upload-list-item { background-color: #fafafa; } .ant-upload-list-picture-card .ant-upload-list-item-uploading .ant-upload-list-item-info { height: auto; } .ant-upload-list-picture-card .ant-upload-list-item-uploading .ant-upload-list-item-info:before, .ant-upload-list-picture-card .ant-upload-list-item-uploading .ant-upload-list-item-info .anticon-eye-o, .ant-upload-list-picture-card .ant-upload-list-item-uploading .ant-upload-list-item-info .anticon-delete { display: none; } .ant-upload-list-picture-card .ant-upload-list-item-uploading-text { margin-top: 18px; color: rgba(0, 0, 0, 0.45); } .ant-upload-list-picture-card .ant-upload-list-item-progress { padding-left: 0; bottom: 32px; } .ant-upload-list .ant-upload-success-icon { color: #52c41a; font-weight: bold; } .ant-upload-list .ant-upload-animate-enter, .ant-upload-list .ant-upload-animate-leave, .ant-upload-list .ant-upload-animate-inline-enter, .ant-upload-list .ant-upload-animate-inline-leave { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: cubic-bezier(0.78, 0.14, 0.15, 0.86); animation-fill-mode: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .ant-upload-list .ant-upload-animate-enter { -webkit-animation-name: uploadAnimateIn; animation-name: uploadAnimateIn; } .ant-upload-list .ant-upload-animate-leave { -webkit-animation-name: uploadAnimateOut; animation-name: uploadAnimateOut; } .ant-upload-list .ant-upload-animate-inline-enter { -webkit-animation-name: uploadAnimateInlineIn; animation-name: uploadAnimateInlineIn; } .ant-upload-list .ant-upload-animate-inline-leave { -webkit-animation-name: uploadAnimateInlineOut; animation-name: uploadAnimateInlineOut; } @-webkit-keyframes uploadAnimateIn { from { height: 0; margin: 0; opacity: 0; padding: 0; } } @keyframes uploadAnimateIn { from { height: 0; margin: 0; opacity: 0; padding: 0; } } @-webkit-keyframes uploadAnimateOut { to { height: 0; margin: 0; padding: 0; opacity: 0; } } @keyframes uploadAnimateOut { to { height: 0; margin: 0; padding: 0; opacity: 0; } } @-webkit-keyframes uploadAnimateInlineIn { from { width: 0; height: 0; margin: 0; opacity: 0; padding: 0; } } @keyframes uploadAnimateInlineIn { from { width: 0; height: 0; margin: 0; opacity: 0; padding: 0; } } @-webkit-keyframes uploadAnimateInlineOut { to { width: 0; height: 0; margin: 0; padding: 0; opacity: 0; } } @keyframes uploadAnimateInlineOut { to { width: 0; height: 0; margin: 0; padding: 0; opacity: 0; } }