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] Dialog: add less vars (#3123)

Browse Source
This commit is contained in:
neverland 2019-04-10 15:50:28 +08:00 committed by GitHub
parent f5abc9e46d
commit f08de77c73
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
packages/dialog/index.less
View File

@ -4,30 +4,30 @@
position: fixed; position: fixed;
top: 50%; top: 50%;
left: 50%; left: 50%;
width: 85%;
font-size: 16px;
overflow: hidden; overflow: hidden;
transition: .3s; width: @dialog-width;
border-radius: 4px; font-size: @dialog-font-size;
background-color: @white; transition: @dialog-transition;
border-radius: @dialog-border-radius;
background-color: @dialog-background-color;
transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0);
backface-visibility: hidden; // avoid blurry text after scale animation backface-visibility: hidden; // avoid blurry text after scale animation
&__header { &__header {
font-weight: 500;
padding-top: 25px;
text-align: center; text-align: center;
font-weight: @dialog-header-font-weight;
padding-top: @dialog-header-padding-top;
&--isolated { &--isolated {
padding: 25px 0; padding: @dialog-header-isolated-padding;
} }
} }
&__message { &__message {
padding: 25px; padding: @dialog-message-padding;
font-size: 14px; font-size: @dialog-message-font-size;
line-height: 1.5; line-height: @dialog-message-line-height;
max-height: 60vh; max-height: @dialog-message-max-height;
overflow-y: auto; overflow-y: auto;
text-align: center; text-align: center;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
@ -36,8 +36,8 @@
white-space: pre-wrap; white-space: pre-wrap;
&--has-title { &--has-title {
padding-top: 12px; color: @dialog-has-title-message-text-color;
color: @gray-darker; padding-top: @dialog-has-title-message-padding-top;
} }
&--left { &--left {
@ -69,7 +69,7 @@
&__confirm { &__confirm {
&, &,
&:active { &:active {
color: @blue; color: @dialog-confirm-button-text-color;
} }
} }

17
packages/style/var.less
View File

@ -120,6 +120,23 @@
@collapse-item-content-background-color: @white; @collapse-item-content-background-color: @white;
@collapse-item-title-disabled-color: @gray; @collapse-item-title-disabled-color: @gray;
// Dialog
@dialog-width: 85%;
@dialog-font-size: 16px;
@dialog-transition: .3s;
@dialog-border-radius: 4px;
@dialog-background-color: @white;
@dialog-header-font-weight: 500;
@dialog-header-padding-top: 25px;
@dialog-header-isolated-padding: 25px 0;
@dialog-message-padding: 25px;
@dialog-message-font-size: 14px;
@dialog-message-line-height: 1.5;
@dialog-message-max-height: 60vh;
@dialog-has-title-message-text-color: @gray-darker;
@dialog-has-title-message-padding-top: 12px;
@dialog-confirm-button-text-color: @blue;
// Info // Info
@info-size: 16px; @info-size: 16px;
@info-color: @white; @info-color: @white;