diff --git a/style/web/components/upload/_index.less b/style/web/components/upload/_index.less index 590c3c6a51..f1254d7741 100644 --- a/style/web/components/upload/_index.less +++ b/style/web/components/upload/_index.less @@ -205,17 +205,23 @@ border-radius: @upload-card-img-wrap-border-radius; .hover-transition(border); - &:hover { + &:hover:not(.@{prefix}-is-disabled) { border-color: @upload-card-item-bg-border-color-hover; .hover-transition(border-color); } + + > .t-icon { + color: @upload-icon-color; + } + > .t-icon, .@{prefix}-loading { font-size: @upload-icon-size-large; margin-bottom: @upload-card-container-icon-add-margin-bottom; } - > p { + > p, + .@{prefix}-upload__add-text { color: @text-color-placeholder; margin: 0; } @@ -683,3 +689,15 @@ display: flex; align-items: center; } + +.@{prefix}-upload__card-container.@{prefix}-is-disabled { + cursor: not-allowed; + + .@{prefix}-upload__add-text { + color: @upload-text-disabled-color; + } + + .t-icon { + color: @upload-icon-disabled-color; + } +} diff --git a/style/web/components/upload/_var.less b/style/web/components/upload/_var.less index 05a61a7bf7..3c7b442634 100644 --- a/style/web/components/upload/_var.less +++ b/style/web/components/upload/_var.less @@ -15,6 +15,7 @@ @upload-z-index: 2; // 颜色 +@upload-text-disabled-color: @text-color-disabled; @upload-icon-check-circle-filled-color: @success-color; @upload-icon-error-circle-filled-color: @error-color; @upload-icon-loading-color: @brand-color; @@ -25,6 +26,7 @@ @upload-small-color: @text-color-placeholder; @upload-placeholder-color: @text-color-placeholder; @upload-icon-color: @text-color-placeholder; +@upload-icon-disabled-color: @text-color-disabled; @upload-icon-color-hover: @text-color-secondary; @upload-list-file-icon-color: @brand-color; @upload-list-item-error-color: @error-color;