style(Dialog): add message min-height (#7191)

This commit is contained in:
neverland 2020-09-17 10:58:40 +08:00 committed by GitHub
parent 35f7e818e2
commit 5debc352ff
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 3 deletions

View File

@ -187,7 +187,7 @@ export default createComponent({
}; };
return ( return (
<div class={bem('content')}> <div class={bem('content', { isolated: !hasTitle })}>
<div {...data} /> <div {...data} />
</div> </div>
); );

View File

@ -29,9 +29,18 @@
} }
} }
&__content {
&--isolated {
display: flex;
align-items: center;
min-height: 104px;
}
}
&__message { &__message {
flex: 1;
max-height: @dialog-message-max-height; max-height: @dialog-message-max-height;
padding: @dialog-message-padding; padding: 26px @dialog-message-padding;
overflow-y: auto; overflow-y: auto;
font-size: @dialog-message-font-size; font-size: @dialog-message-font-size;
line-height: @dialog-message-line-height; line-height: @dialog-message-line-height;
@ -65,6 +74,7 @@
&__confirm, &__confirm,
&__cancel { &__cancel {
flex: 1; flex: 1;
height: @dialog-button-height;
margin: 0; margin: 0;
border: 0; border: 0;
} }
@ -88,6 +98,11 @@
color: @text-color; color: @text-color;
} }
.van-dialog__confirm,
.van-dialog__cancel {
height: @dialog-round-button-height;
}
.van-dialog__confirm { .van-dialog__confirm {
color: @white; color: @white;
} }

View File

@ -306,7 +306,7 @@
@dialog-background-color: @white; @dialog-background-color: @white;
@dialog-header-font-weight: @font-weight-bold; @dialog-header-font-weight: @font-weight-bold;
@dialog-header-line-height: 24px; @dialog-header-line-height: 24px;
@dialog-header-padding-top: @padding-lg; @dialog-header-padding-top: 26px;
@dialog-header-isolated-padding: @padding-lg 0; @dialog-header-isolated-padding: @padding-lg 0;
@dialog-message-padding: @padding-lg; @dialog-message-padding: @padding-lg;
@dialog-message-font-size: @font-size-md; @dialog-message-font-size: @font-size-md;
@ -314,6 +314,8 @@
@dialog-message-max-height: 60vh; @dialog-message-max-height: 60vh;
@dialog-has-title-message-text-color: @gray-7; @dialog-has-title-message-text-color: @gray-7;
@dialog-has-title-message-padding-top: @padding-xs; @dialog-has-title-message-padding-top: @padding-xs;
@dialog-button-height: 48px;
@dialog-round-button-height: 36px;
@dialog-confirm-button-text-color: @red; @dialog-confirm-button-text-color: @red;
// Divider // Divider