Sfoglia il codice sorgente

Merge pull request #349 from QingWei-Li/fix/step

Steps: fix icon style
SkyAo 8 anni fa
parent
commit
2162b62fcb
2 ha cambiato i file con 16 aggiunte e 11 eliminazioni
  1. 12 11
      packages/steps/src/step.vue
  2. 4 0
      packages/theme-default/src/step.css

+ 12 - 11
packages/steps/src/step.vue

@@ -12,17 +12,18 @@
         <i class="el-step__line-inner" :style="lineStyle"></i>
       </div>
 
-      <slot
-        v-if="currentStatus !== 'success' && currentStatus !== 'error'"
-        name="icon">
-        <i v-if="icon" :class="['el-step__icon', 'el-icon-' + icon]"></i>
-        <div v-else>{{ index + 1 }}</div>
-      </slot>
-      <i
-        v-else
-        class="el-step__icon"
-        :class="['el-icon-' + (currentStatus === 'success' ? 'check' : 'close')]">
-      </i>
+      <span class="el-step__icon">
+        <slot
+          v-if="currentStatus !== 'success' && currentStatus !== 'error'"
+          name="icon">
+          <i v-if="icon" :class="['el-icon-' + icon]"></i>
+          <div v-else>{{ index + 1 }}</div>
+        </slot>
+        <i
+          v-else
+          :class="['el-icon-' + (currentStatus === 'success' ? 'check' : 'close')]">
+        </i>
+      </span>
     </div>
     <div
       class="el-step__main"

+ 4 - 0
packages/theme-default/src/step.css

@@ -69,6 +69,10 @@
 
     @e icon {
       line-height: 28px;
+
+      > * {
+        line-height: inherit;
+      }
     }
 
     @e head {