mirror of
https://github.com/youzan/vant.git
synced 2025-10-18 09:24:25 +00:00
[improvement] replace icons (#2304)
This commit is contained in:
@@ -11,21 +11,6 @@
|
||||
<van-button @click="nextStep">{{ $t('nextStep') }}</van-button>
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="$t('title2')">
|
||||
<van-steps
|
||||
:active="active"
|
||||
icon="logistics"
|
||||
icon-class="steps-success"
|
||||
:title="$t('title')"
|
||||
:description="$t('desc')"
|
||||
>
|
||||
<van-step>{{ $t('step1') }}</van-step>
|
||||
<van-step>{{ $t('step2') }}</van-step>
|
||||
<van-step>{{ $t('step3') }}</van-step>
|
||||
<van-step>{{ $t('step4') }}</van-step>
|
||||
</van-steps>
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="$t('title3')">
|
||||
<van-steps
|
||||
:active="0"
|
||||
|
@@ -30,22 +30,6 @@ export default {
|
||||
}
|
||||
```
|
||||
|
||||
#### Description
|
||||
|
||||
```html
|
||||
<van-steps
|
||||
:active="active"
|
||||
icon="logistics"
|
||||
title="Title"
|
||||
description="Description"
|
||||
>
|
||||
<van-step>Step1</van-step>
|
||||
<van-step>Step2</van-step>
|
||||
<van-step>Step3</van-step>
|
||||
<van-step>Step4</van-step>
|
||||
</van-steps>
|
||||
```
|
||||
|
||||
#### Vertical Steps
|
||||
|
||||
```html
|
||||
|
@@ -31,43 +31,6 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
</div> <button class="van-button van-button--default van-button--normal"><span class="van-button__text">下一步</span></button>
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-steps van-steps--horizontal">
|
||||
<div class="van-steps__status">
|
||||
<div class="van-steps__icon"><i class="van-icon van-icon-logistics steps-success" style="color:undefined;font-size:undefined;">
|
||||
<!---->
|
||||
<!----></i></div>
|
||||
<div class="van-steps__message">
|
||||
<div class="van-steps__title">标题</div>
|
||||
<div class="van-ellipsis van-steps__desc">描述信息</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="van-steps__items">
|
||||
<div class="van-hairline van-step van-step--horizontal van-step--finish">
|
||||
<div class="van-step__title">买家下单</div>
|
||||
<div class="van-step__circle-container"><i class="van-step__circle"></i></div>
|
||||
<div class="van-step__line"></div>
|
||||
</div>
|
||||
<div class="van-hairline van-step van-step--horizontal van-step--process">
|
||||
<div class="van-step__title" style="color:#4b0;">商家接单</div>
|
||||
<div class="van-step__circle-container"><i class="van-icon van-icon-checked" style="color:#4b0;font-size:undefined;">
|
||||
<!---->
|
||||
<!----></i></div>
|
||||
<div class="van-step__line"></div>
|
||||
</div>
|
||||
<div class="van-hairline van-step van-step--horizontal">
|
||||
<div class="van-step__title">买家提货</div>
|
||||
<div class="van-step__circle-container"><i class="van-step__circle"></i></div>
|
||||
<div class="van-step__line"></div>
|
||||
</div>
|
||||
<div class="van-hairline van-step van-step--horizontal">
|
||||
<div class="van-step__title">交易完成</div>
|
||||
<div class="van-step__circle-container"><i class="van-step__circle"></i></div>
|
||||
<div class="van-step__line"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-steps van-steps--vertical">
|
||||
<!---->
|
||||
|
@@ -30,24 +30,6 @@ export default {
|
||||
}
|
||||
```
|
||||
|
||||
#### 描述信息
|
||||
|
||||
通过`title`和`description`属性来定义描述信息信息
|
||||
|
||||
```html
|
||||
<van-steps
|
||||
:active="active"
|
||||
icon="logistics"
|
||||
title="标题"
|
||||
description="描述信息"
|
||||
>
|
||||
<van-step>买家下单</van-step>
|
||||
<van-step>商家接单</van-step>
|
||||
<van-step>买家提货</van-step>
|
||||
<van-step>交易完成</van-step>
|
||||
</van-steps>
|
||||
```
|
||||
|
||||
#### 竖向步骤条
|
||||
可以通过设置`direction`属性来改变步骤条的显示方式
|
||||
|
||||
|
Reference in New Issue
Block a user