blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

feat(ActionSheet): adjust header style (#3720)

Browse Source
This commit is contained in:
neverland 2020-11-02 17:00:59 +08:00 committed by GitHub
parent 51befdc40c
commit 410c21f0c7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
example/pages/action-sheet/index.js
View File

@ -11,21 +11,21 @@ Page({
action1: [
{ name: '选项' },
{ name: '选项' },
{ name: '选项', subname: '副文本' }
{ name: '选项', subname: '描述信息' },
],
action2: [
{ name: '选项', color: '#07c160' },
{ name: '着色选项', color: '#ee0a24' },
{ loading: true },
{ name: '禁用选项', disabled: true }
{ name: '禁用选项', disabled: true },
],
action6: [
{ name: '获取用户信息', color: '#07c160', openType: 'getUserInfo' },
]
],
},
toggle(type) {
this.setData({
[type]: !this.data[type]
[type]: !this.data[type],
});
},
@ -53,5 +53,5 @@ Page({
},
onGetUserInfo(e) {
console.log(e.detail);
}
},
});

2
example/pages/action-sheet/index.wxml
View File

@ -52,7 +52,7 @@
</van-action-sheet>
</demo-block>
<demo-block title="微信开发能力" padding>
<demo-block title="微信开放能力" padding>
<van-button type="primary" bind:click="toggleActionSheet6">弹出菜单</van-button>
<van-action-sheet
show="{{ show6 }}"

4
packages/action-sheet/README.md
View File

@ -38,7 +38,7 @@ Page({
},
{
name: '选项',
subname: '副文本',
subname: '描述信息',
openType: 'share',
},
],
@ -71,7 +71,7 @@ Page({
data: {
show: false,
actions: [
{ name: '选项', color: '#07c160' },
{ name: '着色选项', color: '#ee0a24' },
{ loading: true },
{ name: '禁用选项', disabled: true },
],

7
packages/action-sheet/index.less
View File

@ -15,6 +15,11 @@
&--hover {
.theme(background-color, '@active-color');
}
// reset weapp default border
&::after {
border-width: 0;
}
}
&__cancel {
@ -51,7 +56,7 @@
&__description {
text-align: center;
.theme(padding, '@padding-md');
.theme(padding, '20px @padding-md');
.theme(color, '@action-sheet-description-color');
.theme(font-size, '@action-sheet-description-font-size');
.theme(line-height, '@action-sheet-description-line-height');

8
packages/action-sheet/index.wxml
View File

@ -11,15 +11,15 @@
close-on-click-overlay="{{ closeOnClickOverlay }}"
bind:close="onClickOverlay"
>
<view wx:if="{{ title }}" class="van-hairline--bottom van-action-sheet__header">
<view wx:if="{{ title }}" class="van-action-sheet__header">
{{ title }}
<van-icon
name="close"
name="cross"
custom-class="van-action-sheet__close"
bind:click="onClose"
/>
</view>
<view wx:if="{{ description }}" class="van-action-sheet__description">
<view wx:if="{{ description }}" class="van-action-sheet__description van-hairline--bottom">
{{ description }}
</view>
<view wx:if="{{ actions && actions.length }}">
@ -29,7 +29,7 @@
wx:key="index"
open-type="{{ item.openType }}"
style="{{ item.color ? 'color: ' + item.color : '' }}"
class="{{ utils.bem('action-sheet__item', { disabled: item.disabled || item.loading }) }} van-hairline--top {{ item.className || '' }}"
class="{{ utils.bem('action-sheet__item', { disabled: item.disabled || item.loading }) }} {{ item.className || '' }}"
hover-class="van-action-sheet__item--hover"
data-index="{{ index }}"
bind:tap="onSelect"

12
packages/common/style/var.less
View File

@ -67,9 +67,9 @@
//ActionSheet
@action-sheet-max-height: 90%;
@action-sheet-header-height: 44px;
@action-sheet-header-height: 48px;
@action-sheet-header-font-size: @font-size-lg;
@action-sheet-description-color: @gray-7;
@action-sheet-description-color: @gray-6;
@action-sheet-description-font-size: @font-size-md;
@action-sheet-description-line-height: 20px;
@action-sheet-item-height: 50px;
@ -77,11 +77,11 @@
@action-sheet-item-font-size: @font-size-lg;
@action-sheet-item-text-color: @text-color;
@action-sheet-item-disabled-text-color: @gray-5;
@action-sheet-subname-color: @gray-7;
@action-sheet-subname-color: @gray-6;
@action-sheet-subname-font-size: @font-size-sm;
@action-sheet-close-icon-size: 18px;
@action-sheet-close-icon-color: @gray-6;
@action-sheet-close-icon-padding: 0 @padding-sm;
@action-sheet-close-icon-size: 22px;
@action-sheet-close-icon-color: @gray-5;
@action-sheet-close-icon-padding: 0 @padding-md;
@action-sheet-cancel-text-color: @gray-7;
@action-sheet-cancel-padding-top: @padding-xs;
@action-sheet-cancel-padding-color: @background-color;