mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[improvement] Swipe: update indicator color (#2324)
This commit is contained in:
parent
fdffccfc7d
commit
dcc642ac59
@ -19,7 +19,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
<!---->
|
<!---->
|
||||||
<!---->
|
<!---->
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
<div class="van-cell__value van-cell__value--alone">
|
||||||
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="2" class="van-radio__control"> <i class="van-icon van-icon-check" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-address-item__name">李四,1310000000</div> <div class="van-address-item__address">浙江省杭州市拱墅区莫干山路 50 号</div></span></div>
|
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="2" class="van-radio__control"> <i class="van-icon van-icon-circle" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-address-item__name">李四,1310000000</div> <div class="van-address-item__address">浙江省杭州市拱墅区莫干山路 50 号</div></span></div>
|
||||||
</div> <i class="van-icon van-icon-edit van-address-item__edit" style="color:undefined;font-size:undefined;">
|
</div> <i class="van-icon van-icon-edit van-address-item__edit" style="color:undefined;font-size:undefined;">
|
||||||
<!---->
|
<!---->
|
||||||
<!----></i>
|
<!----></i>
|
||||||
@ -34,7 +34,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
<!---->
|
<!---->
|
||||||
<!---->
|
<!---->
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
<div class="van-cell__value van-cell__value--alone">
|
||||||
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="3" class="van-radio__control"> <i class="van-icon van-icon-check" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-address-item__name">王五,1320000000</div> <div class="van-address-item__address">浙江省杭州市滨江区江南大道 15 号</div></span></div>
|
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="3" class="van-radio__control"> <i class="van-icon van-icon-circle" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-address-item__name">王五,1320000000</div> <div class="van-address-item__address">浙江省杭州市滨江区江南大道 15 号</div></span></div>
|
||||||
</div> <i class="van-icon van-icon-edit van-address-item__edit" style="color:undefined;font-size:undefined;">
|
</div> <i class="van-icon van-icon-edit van-address-item__edit" style="color:undefined;font-size:undefined;">
|
||||||
<!---->
|
<!---->
|
||||||
<!----></i>
|
<!----></i>
|
||||||
|
@ -19,7 +19,7 @@ exports[`renders demo correctly 1`] = `
|
|||||||
<!---->
|
<!---->
|
||||||
<!---->
|
<!---->
|
||||||
<div class="van-cell__value van-cell__value--alone">
|
<div class="van-cell__value van-cell__value--alone">
|
||||||
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="0" class="van-radio__control"> <i class="van-icon van-icon-check" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-contact-list__name">张三,13000000000</div></span></div>
|
<div class="van-radio"><span class="van-radio__input"><input type="radio" value="0" class="van-radio__control"> <i class="van-icon van-icon-circle" style="color:undefined;font-size:undefined;"> <!----> <!----></i></span> <span class="van-radio__label"><div class="van-contact-list__name">张三,13000000000</div></span></div>
|
||||||
</div> <i class="van-icon van-icon-edit van-contact-list__edit" style="color:undefined;font-size:undefined;">
|
</div> <i class="van-icon van-icon-edit van-contact-list__edit" style="color:undefined;font-size:undefined;">
|
||||||
<!---->
|
<!---->
|
||||||
<!----></i>
|
<!----></i>
|
||||||
|
@ -32,10 +32,10 @@
|
|||||||
&__indicator {
|
&__indicator {
|
||||||
opacity: .3;
|
opacity: .3;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
background-color: @blue;
|
|
||||||
width: @swipe-indicator;
|
width: @swipe-indicator;
|
||||||
height: @swipe-indicator;
|
height: @swipe-indicator;
|
||||||
transition: opacity .2s;
|
transition: opacity .2s;
|
||||||
|
background-color: @border-color;
|
||||||
|
|
||||||
&:not(:last-child) {
|
&:not(:last-child) {
|
||||||
margin-right: @swipe-indicator;
|
margin-right: @swipe-indicator;
|
||||||
@ -43,6 +43,7 @@
|
|||||||
|
|
||||||
&--active {
|
&--active {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
background-color: @blue;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -19,7 +19,7 @@
|
|||||||
<i
|
<i
|
||||||
v-for="index in count"
|
v-for="index in count"
|
||||||
:class="b('indicator', { active: index - 1 === activeIndicator })"
|
:class="b('indicator', { active: index - 1 === activeIndicator })"
|
||||||
:style="indicatorStyle"
|
:style="index - 1 === activeIndicator ? indicatorStyle : null"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</slot>
|
</slot>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user