chore: change some style (#2773)

* chore: change some style

* chore: change some code

* fix(Tabs): 调整初始化时机
This commit is contained in:
Waiter 2020-02-18 20:33:39 +08:00 committed by GitHub
parent 8c394217fc
commit 855cfa5d94
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 40 additions and 35 deletions

View File

@ -1,4 +1,4 @@
<demo-section>
<demo-block title="按钮类型" padding>
<view class="row">
<van-button class="demo-margin-right">默认按钮</van-button>
@ -58,4 +58,4 @@
<van-button type="primary" custom-class="demo-margin-bottom">普通按钮</van-button>
<van-button type="primary" block>块级元素</van-button>
</demo-block>
</demo-section>

View File

@ -1,4 +1,4 @@
<demo-section>
<demo-block title="基础用法" padding>
<van-row>
<van-image
@ -100,4 +100,4 @@
</van-col>
</van-row>
</demo-block>
</demo-section>

View File

@ -1,20 +1,20 @@
<demo-block title="基础用法">
<van-progress custom-class="progress" percentage="50" />
<van-progress custom-class="progress-position" percentage="50" />
</demo-block>
<demo-block title="线条粗细">
<van-progress custom-class="progress" stroke-width="8" percentage="50" />
<van-progress custom-class="progress-position" stroke-width="8" percentage="50" />
</demo-block>
<demo-block title="置灰">
<van-progress custom-class="progress" inactive percentage="50" />
<van-progress custom-class="progress-position" inactive percentage="50" />
</demo-block>
<demo-block title="样式定制">
<van-progress custom-class="progress" pivot-text="橙色" color="#f2826a" percentage="25" />
<van-progress custom-class="progress" pivot-text="红色" color="#ee0a24" percentage="50" />
<van-progress custom-class="progress-position" pivot-text="橙色" color="#f2826a" percentage="25" />
<van-progress custom-class="progress-position" pivot-text="红色" color="#ee0a24" percentage="50" />
<van-progress
custom-class="progress"
custom-class="progress-position"
percentage="75"
pivot-text="紫色"
pivot-color="#7232dd"

View File

@ -1,3 +1,3 @@
.progress {
.progress-position {
margin: 5px 15px 20px;
}

View File

@ -1,6 +1,6 @@
<demo-block title="基础用法">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value1"
value="{{ value1 }}"
/>
@ -8,7 +8,7 @@
<demo-block title="自定义图标">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
icon="like"
void-icon="like-o"
data-key="value2"
@ -18,7 +18,7 @@
<demo-block title="自定义样式">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value3"
value="{{ value3 }}"
size="{{ 25 }}"
@ -31,7 +31,7 @@
<demo-block title="半星">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value4"
value="{{ value4 }}"
size="{{ 25 }}"
@ -46,7 +46,7 @@
<demo-block title="自定义数量">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value5"
value="{{ value5 }}"
count="{{ 6 }}"
@ -56,7 +56,7 @@
<demo-block title="禁用状态">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value6"
value="{{ value6 }}"
disabled
@ -65,7 +65,7 @@
<demo-block title="只读状态">
<van-rate
custom-class="van-rate"
custom-class="rate-position"
data-key="value6"
value="{{ value6 }}"
readonly

View File

@ -2,6 +2,6 @@ page {
background-color: #fff;
}
.van-rate {
.rate-position {
margin-left: 15px;
}

View File

@ -57,7 +57,7 @@
</demo-block>
<demo-block title="样式风格">
<van-tabs type="card" tab-class="tab-class">
<van-tabs type="card" tab-class="special-tab">
<van-tab
wx:for="{{ tabs3 }}"
wx:key="index"
@ -127,7 +127,7 @@
</demo-block>
<demo-block title="自定义标题">
<van-tabs active="{{ 1 }}" bind:change="onChange" tab-class="tab-class" tab-active-class="tab-active-class">
<van-tabs active="{{ 1 }}" bind:change="onChange" tab-class="special-tab" tab-active-class="special-tab-active">
<van-icon
slot="nav-right"
name="search"

View File

@ -17,10 +17,10 @@ page {
background-color: #fff;
}
.tab-class {
.special-tab {
transition: all 0.25s ease-in-out;
}
.tab-active-class {
.special-tab-active {
font-size: 1.05em !important;
}

View File

@ -43,10 +43,6 @@ VantComponent({
viewStyle: '',
},
beforeCreate() {
this.children = [];
},
created() {
const { gutter } = this.data;
if (gutter) {

View File

@ -41,7 +41,10 @@ VantComponent({
},
count: {
type: Number,
value: 5
value: 5,
observer(value: number) {
this.setData({ innerCountArray: Array.from({ length: value }) });
},
},
gutter: null,
touchable: {
@ -51,7 +54,8 @@ VantComponent({
},
data: {
innerValue: 0
innerValue: 0,
innerCountArray: Array.from({ length: 5 }),
},
methods: {

View File

@ -6,7 +6,7 @@
>
<view
class="van-rate__item"
wx:for="{{ count }}"
wx:for="{{ innerCountArray }}"
wx:key="index"
style="padding-right: {{ index !== count - 1 ? utils.addUnit(gutter) : '' }}"
>

View File

@ -5,7 +5,10 @@ VantComponent({
props: {
row: {
type: Number,
value: 0
value: 0,
observer(value: number) {
this.setData({ rowArray: Array.from({ length: value }) });
},
},
title: Boolean,
avatar: Boolean,
@ -39,6 +42,7 @@ VantComponent({
},
data: {
isArray: false
isArray: false,
rowArray: [],
}
});

View File

@ -16,7 +16,7 @@
style="{{ 'width:' + titleWidth }}"
/>
<view
wx:for="{{ row }}"
wx:for="{{ rowArray }}"
wx:key="index"
wx:for-index="index"
class="row-class {{ utils.bem('skeleton__row') }}"

View File

@ -116,9 +116,10 @@ VantComponent({
mounted() {
this.setData({
container: () => this.createSelectorQuery().select('.van-tabs')
}, () => {
this.setLine(true);
this.scrollIntoView();
});
this.setLine(true);
this.scrollIntoView();
},
methods: {