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: update style (#1906)

Browse Source
This commit is contained in:
neverland 2018-10-09 17:32:01 +08:00 committed by GitHub
parent 396819c355
commit e68ea547b9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/dialog/demo/index.vue
View File

@ -1,16 +1,16 @@
<template>
<demo-section>
<demo-block :title="$t('title1')">
<van-button @click="onClickAlert">Alert</van-button>
<van-button @click="onClickAlert2">{{ $t('alert2') }}</van-button>
<demo-block :title="$t('alert1')">
<van-button type="primary" plain @click="onClickAlert">{{ $t('alert1') }}</van-button>
<van-button type="primary" plain @click="onClickAlert2">{{ $t('alert2') }}</van-button>
</demo-block>
<demo-block :title="$t('title2')">
<van-button @click="onClickConfirm">Confirm</van-button>
<demo-block :title="$t('confirm')">
<van-button type="primary" plain @click="onClickConfirm">{{ $t('confirm') }}</van-button>
</demo-block>
<demo-block :title="$t('advancedUsage')">
<van-button @click="show = true">{{ $t('advancedUsage') }}</van-button>
<van-button type="danger" plain @click="show = true">{{ $t('advancedUsage') }}</van-button>
<van-dialog
v-model="show"
show-cancel-button
@ -36,14 +36,15 @@
export default {
i18n: {
'zh-CN': {
title1: '消息提示',
title2: '消息确认',
alert2: '无标题 Alert'
alert1: '消息提示',
alert2: '无标题提示',
confirm: '消息确认',
content: '有赞是一家零售科技公司，致力于成为商家服务领域里最被信任的引领者'
},
'en-US': {
title1: 'Alert dialog',
title2: 'Confirm dialog',
alert2: 'Alert without title'
alert1: 'Alert',
alert2: 'Alert without title',
confirm: 'Confirm dialog'
}
},
@ -90,7 +91,7 @@ export default {
<style lang="postcss">
.demo-dialog {
.van-doc-demo-block > .van-button {
margin: 15px;
margin-left: 15px;
}
}
</style>

10
packages/dialog/test/__snapshots__/demo.spec.js.snap
View File

@ -3,14 +3,14 @@
exports[`renders demo correctly 1`] = `
<div>
<div>
<button class="van-button van-button--default van-button--normal"><span class="van-button__text">Alert</span></button>
<button class="van-button van-button--default van-button--normal"><span class="van-button__text">无标题 Alert</span></button>
<button class="van-button van-button--primary van-button--normal van-button--plain"><span class="van-button__text">消息提示</span></button>
<button class="van-button van-button--primary van-button--normal van-button--plain"><span class="van-button__text">无标题提示</span></button>
</div>
<div>
<button class="van-button van-button--default van-button--normal"><span class="van-button__text">Confirm</span></button>
<button class="van-button van-button--primary van-button--normal van-button--plain"><span class="van-button__text">消息确认</span></button>
</div>
<div>
<button class="van-button van-button--default van-button--normal"><span class="van-button__text">高级用法</span></button>
<button class="van-button van-button--danger van-button--normal van-button--plain"><span class="van-button__text">高级用法</span></button>
<div name="van-dialog-bounce" class="van-dialog" style="display:none;">
<!---->
<div class="van-dialog__content">
@ -52,7 +52,7 @@ exports[`renders demo correctly 1`] = `
取消
</span></button>
<button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left"><span class="van-button__text">
确认
消息确认
</span></button>
</div>
</div>

10
packages/vant-css/src/dialog.css
View File

@ -13,7 +13,8 @@
transform: translate3d(-50%, -50%, 0);
&__header {
padding: 15px 0 0;
font-weight: 500;
padding-top: 25px;
text-align: center;
&--isolated {
@ -22,12 +23,13 @@
}
&__message {
padding: 20px;
padding: 25px;
font-size: 14px;
line-height: 1.5;
&--has-title {
padding-top: 12px;
color: $gray-darker;
font-size: 14px;
}
}
@ -51,7 +53,7 @@
&__confirm {
&,
&:active {
color: $red;
color: $blue;
}
}