Browse Source

Upload: fix icons in list type

Leopoldthecoder 7 years ago
parent
commit
5d6a7b6f9c
2 changed files with 9 additions and 4 deletions
  1. 6 1
      packages/theme-chalk/src/upload.scss
  2. 3 3
      packages/upload/src/upload-list.vue

+ 6 - 1
packages/theme-chalk/src/upload.scss

@@ -330,7 +330,12 @@
       font-size: 20px;
       background-color: rgba(0, 0, 0, .5);
       transition: opacity .3s;
-      @include utils-vertical-center;
+      &::after {
+        display: inline-block;
+        content: "";
+        height: 100%;
+        vertical-align: middle
+      }
 
       span {
         display: none;

+ 3 - 3
packages/upload/src/upload-list.vue

@@ -41,20 +41,20 @@
         :stroke-width="listType === 'picture-card' ? 6 : 2"
         :percentage="parsePercentage(file.percentage)">
       </el-progress>
-        <span class="el-upload-list__item-actions" v-if="listType === 'picture-card'">
+      <span class="el-upload-list__item-actions" v-if="listType === 'picture-card'">
         <span
           class="el-upload-list__item-preview"
           v-if="handlePreview && listType === 'picture-card'"
           @click="handlePreview(file)"
         >
-          <i class="el-icon-view"></i>
+          <i class="el-icon-zoom-in"></i>
         </span>
         <span
           v-if="!disabled"
           class="el-upload-list__item-delete"
           @click="$emit('remove', file)"
         >
-          <i class="el-icon-delete2"></i>
+          <i class="el-icon-delete"></i>
         </span>
       </span>
     </li>