From 4f516f450ca81afde0c94d136bfb264c871f622e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Tue, 30 Apr 2019 15:43:46 +0800
Subject: [PATCH] [Doc] Loading: update demo

---
 packages/loading/demo/index.vue               | 24 +++++++------------
 packages/loading/en-US.md                     | 10 ++++----
 .../test/__snapshots__/demo.spec.js.snap      |  6 ++---
 packages/loading/zh-CN.md                     | 10 ++++----
 4 files changed, 22 insertions(+), 28 deletions(-)

diff --git a/packages/loading/demo/index.vue b/packages/loading/demo/index.vue
index 8cf30e53f..d9054cbfa 100644
--- a/packages/loading/demo/index.vue
+++ b/packages/loading/demo/index.vue
@@ -1,15 +1,15 @@
 <template>
   <demo-section>
-    <demo-block :title="$t('title1')">
+    <demo-block :title="$t('loadingType')">
       <van-loading />
-      <van-loading color="white" />
+      <van-loading type="spinner" />
     </demo-block>
 
-    <demo-block :title="$t('title2')">
-      <van-loading type="spinner" />
+    <demo-block :title="$t('loadingColor')">
+      <van-loading color="#1989fa" />
       <van-loading
         type="spinner"
-        color="white"
+        color="#1989fa"
       />
     </demo-block>
   </demo-section>
@@ -19,12 +19,12 @@
 export default {
   i18n: {
     'zh-CN': {
-      title1: 'Circular',
-      title2: 'Spinner'
+      loadingType: '加载类型',
+      loadingColor: '自定义颜色'
     },
     'en-US': {
-      title1: 'Circular',
-      title2: 'Spinner'
+      loadingType: 'Type',
+      loadingColor: 'Color'
     }
   }
 };
@@ -36,11 +36,5 @@ export default {
     display: inline-block;
     margin: 5px 0 5px 20px;
   }
-
-  .van-loading--white {
-    padding: 10px;
-    border-radius: 3px;
-    background-color: rgba(0, 0, 0, .5);
-  }
 }
 </style>
diff --git a/packages/loading/en-US.md b/packages/loading/en-US.md
index a6889fae5..98bdb77f0 100644
--- a/packages/loading/en-US.md
+++ b/packages/loading/en-US.md
@@ -9,18 +9,18 @@ Vue.use(Loading);
 
 ### Usage
 
-#### Circular
+#### Type
 
 ```html
 <van-loading />
-<van-loading color="white" />
+<van-loading type="spinner" />
 ```
 
-#### Spinner
+#### Color
 
 ```html
-<van-loading type="spinner" />
-<van-loading type="spinner" color="white" />
+<van-loading color="#1989fa" />
+<van-loading type="spinner" color="#1989fa" />
 ```
 
 ### API
diff --git a/packages/loading/test/__snapshots__/demo.spec.js.snap b/packages/loading/test/__snapshots__/demo.spec.js.snap
index d2f78f8b6..1f75555de 100644
--- a/packages/loading/test/__snapshots__/demo.spec.js.snap
+++ b/packages/loading/test/__snapshots__/demo.spec.js.snap
@@ -4,11 +4,11 @@ exports[`renders demo correctly 1`] = `
 <div>
   <div>
     <div class="van-loading van-loading--circular" style="color:#c9c9c9;"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
-    <div class="van-loading van-loading--circular" style="color:white;"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
+    <div class="van-loading van-loading--spinner" style="color:#c9c9c9;"><span class="van-loading__spinner van-loading__spinner--spinner"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
   </div>
   <div>
-    <div class="van-loading van-loading--spinner" style="color:#c9c9c9;"><span class="van-loading__spinner van-loading__spinner--spinner"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
-    <div class="van-loading van-loading--spinner" style="color:white;"><span class="van-loading__spinner van-loading__spinner--spinner"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
+    <div class="van-loading van-loading--circular" style="color:#1989fa;"><span class="van-loading__spinner van-loading__spinner--circular"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
+    <div class="van-loading van-loading--spinner" style="color:#1989fa;"><span class="van-loading__spinner van-loading__spinner--spinner"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
   </div>
 </div>
 `;
diff --git a/packages/loading/zh-CN.md b/packages/loading/zh-CN.md
index b718032c7..049a4582a 100644
--- a/packages/loading/zh-CN.md
+++ b/packages/loading/zh-CN.md
@@ -9,18 +9,18 @@ Vue.use(Loading);
 
 ### 代码演示
 
-#### Circular
+#### 加载类型
 
 ```html
 <van-loading />
-<van-loading color="white" />
+<van-loading type="spinner" />
 ```
 
-#### Spinner
+#### 自定义颜色
 
 ```html
-<van-loading type="spinner" />
-<van-loading type="spinner" color="white" />
+<van-loading color="#1989fa" />
+<van-loading type="spinner" color="#1989fa" />
 ```
 
 ### API