fix(Steps): incorrect style when use inactive-icon prop (#2166)

This commit is contained in:
neverland 2019-10-17 11:45:09 +08:00 committed by GitHub
parent 18378bdbdc
commit 0a2cf4bc41
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 7 deletions

View File

@ -100,7 +100,7 @@
&.van-step--process { &.van-step--process {
.theme(color, '@text-color'); .theme(color, '@text-color');
.van-step__active { .van-step__icon {
display: block; display: block;
font-size: 12px; font-size: 12px;
line-height: 1; line-height: 1;
@ -134,7 +134,7 @@
} }
} }
.van-step__active, .van-step__icon,
.van-step__circle, .van-step__circle,
.van-step__line { .van-step__line {
position: absolute; position: absolute;
@ -144,7 +144,7 @@
transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0);
} }
.van-step__active { .van-step__icon {
font-size: 12px; font-size: 12px;
line-height: 1; line-height: 1;
} }

View File

@ -13,13 +13,25 @@
</view> </view>
<view class="van-step__circle-container"> <view class="van-step__circle-container">
<block wx:if="{{ index !== active }}"> <block wx:if="{{ index !== active }}">
<van-icon wx:if="{{ inactiveIcon }}" name="{{ inactiveIcon }}" color="#969799" size="12px" /> <van-icon
<view wx:else class="van-step__circle" style="{{ index < active ? 'background-color: ' + activeColor : '' }}" /> wx:if="{{ inactiveIcon }}"
color="#969799"
name="{{ inactiveIcon }}"
custom-class="van-step__icon"
/>
<view
wx:else
class="van-step__circle"
style="{{ index < active ? 'background-color: ' + activeColor : '' }}"
/>
</block> </block>
<van-icon wx:else name="{{ activeIcon }}" color="{{ activeColor }}" custom-class="van-step__active" /> <van-icon wx:else name="{{ activeIcon }}" color="{{ activeColor }}" custom-class="van-step__icon" />
</view> </view>
<view wx:if="{{ index !== steps.length - 1 }}" class="van-step__line" style="{{ index < active ? 'background-color: ' + activeColor : '' }}" /> <view
wx:if="{{ index !== steps.length - 1 }}"
class="van-step__line" style="{{ index < active ? 'background-color: ' + activeColor : '' }}"
/>
</view> </view>
</view> </view>
</view> </view>