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

[improvement] NumberKeyboard: add less vars

Browse Source
This commit is contained in:
陈嘉涵 2019-05-16 16:57:45 +08:00
parent 6fc31f27fa
commit df42aad53f
2 changed files with 28 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/number-keyboard/index.less
View File

@ -5,16 +5,16 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 100%; width: 100%;
background-color: @white; background-color: @number-keyboard-background-color;
animation-timing-function: ease-out; animation-timing-function: ease-out;
user-select: none; user-select: none;
&__title { &__title {
position: relative; position: relative;
height: 30px; height: @number-keyboard-title-height;
color: @gray-darker; color: @number-keyboard-title-color;
font-size: 14px; font-size: @number-keyboard-title-font-size;
line-height: 30px; line-height: @number-keyboard-title-height;
text-align: center; text-align: center;
&-left { &-left {
@ -30,12 +30,12 @@
&__close { &__close {
position: absolute; position: absolute;
right: 0; right: 0;
padding: 0 15px; padding: @number-keyboard-close-padding;
color: @blue; color: @number-keyboard-close-color;
font-size: 14px; font-size: @number-keyboard-close-font-size;
&:active { &:active {
background-color: @active-color; background-color: @number-keyboard-key-active-color;
} }
} }
@ -63,7 +63,7 @@
display: inline-block; display: inline-block;
width: 100% / 3; width: 100% / 3;
height: @number-keyboard-key-height; height: @number-keyboard-key-height;
font-size: 24px; font-size: @number-keyboard-key-font-size;
font-style: normal; font-style: normal;
line-height: @number-keyboard-key-height; line-height: @number-keyboard-key-height;
text-align: center; text-align: center;
@ -85,19 +85,19 @@
&--blue, &--blue,
&--delete { &--delete {
font-size: 16px; font-size: @number-keyboard-delete-font-size;
} }
&--blue { &--blue {
color: @white; color: @number-keyboard-button-text-color;
background-color: @blue; background-color: @number-keyboard-button-background-color;
&.van-key--active { &.van-key--active {
background-color: @blue; background-color: @number-keyboard-button-background-color;
} }
&::after { &::after {
border-color: @blue; border-color: @number-keyboard-button-background-color;
} }
} }
@ -106,6 +106,6 @@
} }
&--active { &--active {
background-color: @active-color; background-color: @number-keyboard-key-active-color;
} }
} }

12
packages/style/var.less
View File

@ -302,8 +302,20 @@
@notify-line-height: 20px; @notify-line-height: 20px;
// NumberKeyboard // NumberKeyboard
@number-keyboard-background-color: @white;
@number-keyboard-key-height: 54px; @number-keyboard-key-height: 54px;
@number-keyboard-key-background: #ebedf0; @number-keyboard-key-background: #ebedf0;
@number-keyboard-key-font-size: 24px;
@number-keyboard-key-active-color: @active-color;
@number-keyboard-delete-font-size: 16px;
@number-keyboard-title-color: @gray-darker;
@number-keyboard-title-height: 30px;
@number-keyboard-title-font-size: 14px;
@number-keyboard-close-padding: 0 15px;
@number-keyboard-close-color: @blue;
@number-keyboard-close-font-size: 14px;
@number-keyboard-button-text-color: @white;
@number-keyboard-button-background-color: @blue;
// Overlay // Overlay
@overlay-background-color: rgba(0, 0, 0, 0.7); @overlay-background-color: rgba(0, 0, 0, 0.7);