diff --git a/packages/theme/src/upload-list/index.less b/packages/theme/src/upload-list/index.less index 54e329e846..00e26dc428 100644 --- a/packages/theme/src/upload-list/index.less +++ b/packages/theme/src/upload-list/index.less @@ -211,6 +211,10 @@ > &-delete > .@{svg-prefix-cls}.@{svg-prefix-cls}-size.icon-delete { fill: var(--ti-upload-list-svg-close-icon-color); + + &:hover { + fill: var(--ti-upload-list-svg-close-hover-icon-color); + } } .@{svg-prefix-cls} { @@ -220,26 +224,18 @@ } &.icon-close { - display: none; - position: absolute; - top: 50%; right: var(--ti-upload-list-svg-close-position-right); - transform: translateY(-50%); - fill: var(--ti-upload-list-svg-close-icon-color); - font-size: var(--ti-upload-list-svg-icon-font-size); - opacity: 0.75; - cursor: pointer; + } - &:hover { - opacity: 1; - } + &.icon-refres { + right: var(--ti-upload-list-svg-refresh-position-right); } + &.icon-close, &.icon-refres { display: none; position: absolute; top: 50%; - right: var(--ti-upload-list-svg-refresh-position-right); transform: translateY(-50%); fill: var(--ti-upload-list-svg-close-icon-color); font-size: var(--ti-upload-list-svg-icon-font-size); @@ -247,6 +243,7 @@ cursor: pointer; &:hover { + fill: var(--ti-upload-list-svg-close-hover-icon-color); opacity: 1; } } @@ -294,8 +291,8 @@ &__icon-operationfaild { fill: #f23030; - margin-right: 9px; - padding-left: 4px; + margin-right: 8px; + margin-left: 4px; font-size: 16px; } @@ -399,7 +396,7 @@ background-color: #fce3e1; & span .tiny-svg { - fill: #191919; + fill: var(--ti-upload-list-svg-close-hover-icon-color); } } } @@ -480,7 +477,7 @@ cursor: pointer; & + span { - margin-left: 15px; + margin-left: 16px; } } diff --git a/packages/theme/src/upload-list/smb-theme.js b/packages/theme/src/upload-list/smb-theme.js index a0924074e6..211d91400d 100644 --- a/packages/theme/src/upload-list/smb-theme.js +++ b/packages/theme/src/upload-list/smb-theme.js @@ -8,9 +8,10 @@ export const tinyUploadListSmbTheme = { 'ti-upload-list-picture-card-item-margin-right': 'var(--ti-common-space-4x)', 'ti-upload-list-item-border-radius': 'var(--ti-common-border-radius-4)', 'ti-upload-picture-card-border-radius': 'var(--ti-common-border-radius-4)', - 'ti-upload-list-item-hover-background-color': 'var(--ti-common-bg-color-disabled-transparent-5)', + 'ti-upload-list-item-hover-background-color': 'var(--ti-common-color-bg-normal)', 'ti-upload-list-svg-icon-font-size': 'var(--ti-common-font-size-2)', 'ti-upload-list-svg-refresh-position-right': 'var(--ti-common-space-8x)', 'ti-upload-list-picture-card-item-hover-bg-color': 'var(--ti-common-bg-color-hover-40)', - 'ti-upload-list-picture-success-border-weight': '0' + 'ti-upload-list-picture-success-border-weight': '0', + 'ti-upload-list-item-text-color': 'var(--ti-common-color-text-secondary)' } diff --git a/packages/theme/src/upload-list/vars.less b/packages/theme/src/upload-list/vars.less index 2bff03f959..af1e613218 100644 --- a/packages/theme/src/upload-list/vars.less +++ b/packages/theme/src/upload-list/vars.less @@ -27,8 +27,10 @@ --ti-upload-list-item-name-icon-color: var(--ti-common-color-info, #252b3a); // 上传文件列表项前置图标尺寸 --ti-upload-list-item-name-icon-font-size: var(--ti-common-font-size-2, 16px); - // 上传文件列表项删除图标色 - --ti-upload-list-svg-close-icon-color: var(--ti-common-color-icon-normal); + // 上传文件列表项右侧图标色 + --ti-upload-list-svg-close-icon-color: var(--ti-common-color-icon-normal, #575d6c); + // 上传文件列表项右侧悬浮图标色 + --ti-upload-list-svg-close-hover-icon-color: var(--ti-common-color-icon-hover, #5e7ce0); // 上传文件列表项图标尺寸 --ti-upload-list-svg-icon-font-size: var(--ti-common-font-size-base, 12px); // 上传文件列表项成功图标尺寸