[improvement] Actionsheet: add less vars (#3049)

This commit is contained in:
neverland 2019-03-24 21:03:47 +08:00 committed by GitHub
parent 76a90eb89e
commit 078ba99f94
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 12 deletions

View File

@ -1,15 +1,15 @@
@import '../style/var'; @import '../style/var';
.van-actionsheet { .van-actionsheet {
max-height: 90%; color: @action-sheet-item-text-color;
color: @text-color; max-height: @action-sheet-max-height;
&__item, &__item,
&__cancel { &__cancel {
line-height: 50px;
font-size: 16px;
text-align: center; text-align: center;
background-color: @white; font-size: @action-sheet-item-font-size;
line-height: @action-sheet-item-height;
background-color: @action-sheet-item-background;
&:active { &:active {
background-color: @active-color; background-color: @active-color;
@ -17,7 +17,7 @@
} }
&__item { &__item {
height: 50px; height: @action-sheet-item-height;
} }
&__item--disabled { &__item--disabled {
@ -29,8 +29,8 @@
} }
&__subname { &__subname {
font-size: 12px; color: @action-sheet-subname-color;
color: @gray-darker; font-size: @action-sheet-subname-font-size;
margin-left: 5px; margin-left: 5px;
} }
@ -46,8 +46,8 @@
} }
&__header { &__header {
font-size: 16px; font-size: @action-sheet-header-font-size;
line-height: 44px; line-height: @action-sheet-header-height;
text-align: center; text-align: center;
} }
@ -55,9 +55,9 @@
top: 0; top: 0;
right: 0; right: 0;
padding: 0 15px; padding: 0 15px;
font-size: 18px;
color: @gray-dark;
position: absolute; position: absolute;
line-height: inherit; line-height: inherit;
color: @action-sheet-close-icon-color;
font-size: @action-sheet-close-icon-size;
} }
} }

View File

@ -19,6 +19,19 @@
@background-color: #f8f8f8; @background-color: #f8f8f8;
@background-color-light: #fafafa; @background-color-light: #fafafa;
// ActionSheet
@action-sheet-max-height: 90%;
@action-sheet-header-height: 44px;
@action-sheet-header-font-size: 16px;
@action-sheet-item-height: 50px;
@action-sheet-item-background: @white;
@action-sheet-item-font-size: 16px;
@action-sheet-item-text-color: @text-color;
@action-sheet-subname-color: @gray-darker;
@action-sheet-subname-font-size: 12px;
@action-sheet-close-icon-size: 18px;
@action-sheet-close-icon-color: @gray-dark;
// Button // Button
@button-default-color: @text-color; @button-default-color: @text-color;
@button-default-background-color: @white; @button-default-background-color: @white;