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

refactor(dialog): adjust padding with round-button theme (#3485)

Browse Source
This commit is contained in:
rex 2020-08-05 16:40:07 +08:00 committed by GitHub
parent 995795a6ea
commit 0284229ffd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -231,7 +231,7 @@
@dialog-message-line-height: 20px; @dialog-message-line-height: 20px;
@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-sm; @dialog-has-title-message-padding-top: @padding-xs;
// Field // Field
@field-label-color: @gray-7; @field-label-color: @gray-7;

11
packages/dialog/index.less
View File

@ -37,11 +37,16 @@
word-wrap: break-word; word-wrap: break-word;
} }
&--has-title { &--hasTitle {
.theme(padding-top, '@dialog-has-title-message-padding-top'); .theme(padding-top, '@dialog-has-title-message-padding-top');
.theme(color, '@dialog-has-title-message-text-color'); .theme(color, '@dialog-has-title-message-text-color');
} }
&--round-button {
padding-bottom: @padding-md;
color: @text-color;
}
&--left { &--left {
text-align: left; text-align: left;
} }
@ -54,9 +59,9 @@
&__footer { &__footer {
display: flex; display: flex;
&--round { &--round-button {
position: relative !important; position: relative !important;
padding: 0 @padding-lg - 5px @padding-md !important; padding: @padding-xs @padding-lg @padding-md !important;
} }
} }

8
packages/dialog/index.wxml
View File

@ -5,7 +5,7 @@
z-index="{{ zIndex }}" z-index="{{ zIndex }}"
overlay="{{ overlay }}" overlay="{{ overlay }}"
transition="{{ transition }}" transition="{{ transition }}"
custom-class="van-dialog {{ className }}" custom-class="van-dialog van-dialog--{{ theme }} {{ className }}"
custom-style="width: {{ utils.addUnit(width) }};{{ customStyle }}" custom-style="width: {{ utils.addUnit(width) }};{{ customStyle }}"
overlay-style="{{ overlayStyle }}" overlay-style="{{ overlayStyle }}"
close-on-click-overlay="{{ closeOnClickOverlay }}" close-on-click-overlay="{{ closeOnClickOverlay }}"
@ -13,7 +13,7 @@
> >
<view <view
wx:if="{{ title || useTitleSlot }}" wx:if="{{ title || useTitleSlot }}"
class="van-dialog__header {{ message || useSlot ? '' : 'van-dialog--isolated' }}" class="{{ utils.bem('dialog__header', { isolated: !(message || useSlot) }) }}"
> >
<slot wx:if="{{ useTitleSlot }}" name="title" /> <slot wx:if="{{ useTitleSlot }}" name="title" />
<block wx:elif="{{ title }}">{{ title }}</block> <block wx:elif="{{ title }}">{{ title }}</block>
@ -22,12 +22,12 @@
<slot wx:if="{{ useSlot }}" /> <slot wx:if="{{ useSlot }}" />
<view <view
wx:elif="{{ message }}" wx:elif="{{ message }}"
class="van-dialog__message {{ title ? 'van-dialog__message--has-title' : '' }} {{ messageAlign ? 'van-dialog__message--' + messageAlign : '' }}" class="{{ utils.bem('dialog__message', [theme, messageAlign, { hasTitle: title }]) }}"
> >
<text class="van-dialog__message-text">{{ message }}</text> <text class="van-dialog__message-text">{{ message }}</text>
</view> </view>
<van-goods-action wx:if="{{ theme === 'round-button' }}" custom-class="van-dialog__footer--round"> <van-goods-action wx:if="{{ theme === 'round-button' }}" custom-class="van-dialog__footer--round-button">
<van-goods-action-button <van-goods-action-button
wx:if="{{ showCancelButton }}" wx:if="{{ showCancelButton }}"
size="large" size="large"