From e0419b54cb4ef8d25140c3140177656a5aeb47ef Mon Sep 17 00:00:00 2001
From: sheepluo <yaoyanhuoyi@qq.com>
Date: Mon, 18 Dec 2023 16:11:23 +0800
Subject: [PATCH] fix: upload preview (#1681)

Co-authored-by: sheepluo <sheepluo@tencent.com>
---
 style/web/components/image-viewer/_index.less | 65 ++++++++++---------
 style/web/components/upload/_index.less       |  2 +-
 2 files changed, 34 insertions(+), 33 deletions(-)

diff --git a/style/web/components/image-viewer/_index.less b/style/web/components/image-viewer/_index.less
index 54e6695cdc..c825e63554 100644
--- a/style/web/components/image-viewer/_index.less
+++ b/style/web/components/image-viewer/_index.less
@@ -261,39 +261,40 @@
         right: 0;
         background-image: linear-gradient(to right, rgba(255, 255, 255, 0%), @bg-color-container);
       }
+    }
+  }
 
-      .@{prefix}-image-viewer__header-trans {
-        height: 100%;
-        transition: transform @anim-duration-base;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: @spacer-s;
-        margin-left: @image-viewer-header-box-width-margin-left;
-
-        .@{prefix}-image-viewer__header-box {
-          box-sizing: border-box;
-          width: @image-viewer-header-box-width;
-          height: @image-viewer-header-box-height;
-          transition: @anim-duration-base;
-          overflow: hidden;
-          border-radius: @border-radius-default;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          border: 1px solid transparent;
-          background-color: @bg-color-secondarycontainer;
-
-          .@{prefix}-image-viewer__header-img {
-            width: auto;
-            height: 100%;
-          }
-
-          &:hover, &.@{prefix}-is-active {
-            border-color: @brand-color;
-          }
-        }
-      }
+  .@{prefix}-image-viewer__header-trans {
+    height: 100%;
+    transition: transform @anim-duration-base;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: @spacer-s;
+    margin-left: @image-viewer-header-box-width-margin-left;
+  }
+
+  .@{prefix}-image-viewer__header-box {
+    box-sizing: border-box;
+    width: @image-viewer-header-box-width;
+    height: @image-viewer-header-box-height;
+    position: relative;
+    transition: @anim-duration-base;
+    overflow: hidden;
+    border-radius: @border-radius-default;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid transparent;
+    background-color: @bg-color-secondarycontainer;
+
+    .@{prefix}-image-viewer__header-img {
+      width: auto;
+      height: 100%;
+    }
+
+    &:hover, &.@{prefix}-is-active {
+      border-color: @brand-color;
     }
   }
 
diff --git a/style/web/components/upload/_index.less b/style/web/components/upload/_index.less
index 6a4f34bf13..4b1f4b4f67 100644
--- a/style/web/components/upload/_index.less
+++ b/style/web/components/upload/_index.less
@@ -638,7 +638,7 @@
   .hover-transition(color);
 }
 
-.@{prefix}-upload__single-input-clear {
+.t-icon.@{prefix}-upload__single-input-clear {
   display: none;
 }