From e68ea547b92f27d794b3761beccfb0d92f37319c Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Tue, 9 Oct 2018 17:32:01 +0800
Subject: [PATCH] [improvement] Dialog: update style (#1906)

---
 packages/dialog/demo/index.vue                | 27 ++++++++++---------
 .../test/__snapshots__/demo.spec.js.snap      | 10 +++----
 packages/vant-css/src/dialog.css              | 10 ++++---
 3 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/packages/dialog/demo/index.vue b/packages/dialog/demo/index.vue
index 71584296f..561c0ec4b 100644
--- a/packages/dialog/demo/index.vue
+++ b/packages/dialog/demo/index.vue
@@ -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>
diff --git a/packages/dialog/test/__snapshots__/demo.spec.js.snap b/packages/dialog/test/__snapshots__/demo.spec.js.snap
index 81879e6d3..248712378 100644
--- a/packages/dialog/test/__snapshots__/demo.spec.js.snap
+++ b/packages/dialog/test/__snapshots__/demo.spec.js.snap
@@ -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>
diff --git a/packages/vant-css/src/dialog.css b/packages/vant-css/src/dialog.css
index 2ad1440b1..adc6f59a4 100644
--- a/packages/vant-css/src/dialog.css
+++ b/packages/vant-css/src/dialog.css
@@ -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;
     }
   }