[Improvement] Checkbox: support custom icon (#1414)

This commit is contained in:
neverland
2018-07-05 21:25:04 +08:00
committed by GitHub
parent 0149dc0976
commit a0602c81d5
11 changed files with 217 additions and 108 deletions
@@ -4,44 +4,58 @@ exports[`renders demo correctly 1`] = `
<div>
<div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--checked" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">复选框</span></div>
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--checked">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">复选框</span></div>
</div>
<div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--disabled" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">复选框</span></div>
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--disabled">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">复选框</span></div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--disabled van-checkbox--checked" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">复选框</span></div>
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--disabled van-checkbox__icon--checked">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">复选框</span></div>
</div>
<div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--checked" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">复选框</span></div>
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--checked">
<img src="https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png">
</div> <span class="van-checkbox__label">
自定义图标
</span></div>
</div>
<div>
<div class="van-checkbox-group">
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--checked" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--checked">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 a
</span></div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round van-checkbox--checked" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round van-checkbox__icon--checked">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 b
</span></div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 c
</span></div>
</div>
@@ -49,21 +63,27 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-checkbox-group">
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 a
</span></div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 b
</span></div>
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i> <span class="van-checkbox__label">
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div> <span class="van-checkbox__label">
复选框 c
</span></div>
</div>
@@ -78,9 +98,11 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-cell__value">
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i>
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div>
<!---->
</div>
</div>
@@ -93,9 +115,11 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-cell__value">
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i>
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div>
<!---->
</div>
</div>
@@ -108,9 +132,11 @@ exports[`renders demo correctly 1`] = `
</div>
<div class="van-cell__value">
<div class="van-checkbox">
<i class="van-icon van-icon-success van-checkbox__icon van-checkbox--round" style="color:undefined;">
<!---->
</i>
<div class="van-checkbox__icon van-checkbox__icon--round">
<i class="van-icon van-icon-success" style="color:undefined;">
<!---->
</i>
</div>
<!---->
</div>
</div>