From 8afb40e9af429b6044667bcf12305c80fac952c8 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Tue, 9 Oct 2018 17:39:29 +0800
Subject: [PATCH] [improvement] Badge: update style (#1907)

---
 packages/progress/demo/index.vue                      |  2 +-
 packages/progress/en-US.md                            |  2 +-
 .../progress/test/__snapshots__/demo.spec.js.snap     |  2 +-
 packages/progress/zh-CN.md                            |  2 +-
 packages/steps/demo/index.vue                         |  2 +-
 packages/steps/en-US.md                               |  2 +-
 packages/steps/test/__snapshots__/demo.spec.js.snap   |  4 ++--
 packages/steps/zh-CN.md                               |  2 +-
 packages/vant-css/src/badge.css                       |  8 +++-----
 packages/vant-css/src/info.css                        | 11 ++++++-----
 10 files changed, 18 insertions(+), 19 deletions(-)

diff --git a/packages/progress/demo/index.vue b/packages/progress/demo/index.vue
index fb0c6484b..7a54f121e 100644
--- a/packages/progress/demo/index.vue
+++ b/packages/progress/demo/index.vue
@@ -10,7 +10,7 @@
 
     <demo-block :title="$t('title3')">
       <van-progress :pivot-text="$t('orange')" color="#f2826a" :percentage="25" />
-      <van-progress :pivot-text="$t('red')" color="#f3594b" :percentage="50" />
+      <van-progress :pivot-text="$t('red')" color="#f44" :percentage="50" />
       <van-progress
         :percentage="75"
         :pivot-text="$t('purple')"
diff --git a/packages/progress/en-US.md b/packages/progress/en-US.md
index 546ac0d83..7c87e385b 100644
--- a/packages/progress/en-US.md
+++ b/packages/progress/en-US.md
@@ -36,7 +36,7 @@ Use `pivot-text` to custom text，use `color` to custom bar color
 
 <van-progress
   pivot-text="Red"
-  color="#f3594b"
+  color="#f44"
   :percentage="50"
 />
 
diff --git a/packages/progress/test/__snapshots__/demo.spec.js.snap b/packages/progress/test/__snapshots__/demo.spec.js.snap
index f5170e156..2b774376b 100644
--- a/packages/progress/test/__snapshots__/demo.spec.js.snap
+++ b/packages/progress/test/__snapshots__/demo.spec.js.snap
@@ -13,7 +13,7 @@ exports[`renders demo correctly 1`] = `
   <div>
     <div class="van-progress"><span class="van-progress__portion van-progress__portion--with-pivot" style="width:0px;background:#f2826a;"><span class="van-progress__pivot" style="color:#fff;background:#f2826a;">橙色</span></span>
     </div>
-    <div class="van-progress"><span class="van-progress__portion van-progress__portion--with-pivot" style="width:0px;background:#f3594b;"><span class="van-progress__pivot" style="color:#fff;background:#f3594b;">红色</span></span>
+    <div class="van-progress"><span class="van-progress__portion van-progress__portion--with-pivot" style="width:0px;background:#f44;"><span class="van-progress__pivot" style="color:#fff;background:#f44;">红色</span></span>
     </div>
     <div class="van-progress"><span class="van-progress__portion van-progress__portion--with-pivot" style="width:0px;background:linear-gradient(to right, #be99ff, #7232dd);"><span class="van-progress__pivot" style="color:#fff;background:#7232dd;">紫色</span></span>
     </div>
diff --git a/packages/progress/zh-CN.md b/packages/progress/zh-CN.md
index 580dfe33c..c664b5488 100644
--- a/packages/progress/zh-CN.md
+++ b/packages/progress/zh-CN.md
@@ -38,7 +38,7 @@ Vue.use(Progress);
 
 <van-progress
   pivot-text="红色"
-  color="#f3594b"
+  color="#f44"
   :percentage="50"
 />
 
diff --git a/packages/steps/demo/index.vue b/packages/steps/demo/index.vue
index 81321f2c1..13ebce408 100644
--- a/packages/steps/demo/index.vue
+++ b/packages/steps/demo/index.vue
@@ -27,7 +27,7 @@
     </demo-block>
 
     <demo-block :title="$t('title3')">
-      <van-steps direction="vertical" :active="0" active-color="#f60">
+      <van-steps direction="vertical" :active="0" active-color="#f44">
         <van-step>
           <h3>{{ $t('status1') }}</h3>
           <p>2016-07-12 12:40</p>
diff --git a/packages/steps/en-US.md b/packages/steps/en-US.md
index 40d6e6456..b130637cc 100644
--- a/packages/steps/en-US.md
+++ b/packages/steps/en-US.md
@@ -49,7 +49,7 @@ export default {
 #### Vertical Steps
 
 ```html
-<van-steps direction="vertical" :active="0" active-color="#f60">
+<van-steps direction="vertical" :active="0" active-color="#f44">
   <van-step>
     <h3>【City】Status1</h3>
     <p>2016-07-12 12:40</p>
diff --git a/packages/steps/test/__snapshots__/demo.spec.js.snap b/packages/steps/test/__snapshots__/demo.spec.js.snap
index 69d0b6b1b..9f7c286c0 100644
--- a/packages/steps/test/__snapshots__/demo.spec.js.snap
+++ b/packages/steps/test/__snapshots__/demo.spec.js.snap
@@ -92,12 +92,12 @@ exports[`renders demo correctly 1`] = `
       <!---->
       <div class="van-steps__items van-steps__items--alone">
         <div class="van-hairline van-step van-step--vertical van-step--process">
-          <div class="van-step__title" style="color:#f60;">
+          <div class="van-step__title" style="color:#f44;">
             <h3>【城市】物流状态1</h3>
             <p>2016-07-12 12:40</p>
           </div>
           <div class="van-step__circle-container">
-            <i class="van-icon van-icon-checked" style="color:#f60;font-size:undefined;">
+            <i class="van-icon van-icon-checked" style="color:#f44;font-size:undefined;">
               <!---->
             </i>
           </div>
diff --git a/packages/steps/zh-CN.md b/packages/steps/zh-CN.md
index 8507363cc..91561bdaf 100644
--- a/packages/steps/zh-CN.md
+++ b/packages/steps/zh-CN.md
@@ -52,7 +52,7 @@ export default {
 可以通过设置`direction`属性来改变步骤条的显示方式
 
 ```html
-<van-steps direction="vertical" :active="0" active-color="#f60">
+<van-steps direction="vertical" :active="0" active-color="#f44">
   <van-step>
     <h3>【城市】物流状态1</h3>
     <p>2016-07-12 12:40</p>
diff --git a/packages/vant-css/src/badge.css b/packages/vant-css/src/badge.css
index db0c071f1..f65118c87 100644
--- a/packages/vant-css/src/badge.css
+++ b/packages/vant-css/src/badge.css
@@ -41,12 +41,10 @@
   }
 
   &__info {
+    top: 7px;
     left: auto;
-    top: 4px;
-    right: 4px;
+    right: 5px;
     font-size: 12px;
-    min-width: 1.5em;
-    line-height: 1.5em;
-    transform: scale(0.7);
+    transform: scale(0.9);
   }
 }
diff --git a/packages/vant-css/src/info.css b/packages/vant-css/src/info.css
index 3a6038f8a..52164ccfd 100644
--- a/packages/vant-css/src/info.css
+++ b/packages/vant-css/src/info.css
@@ -4,13 +4,14 @@
   color: #fff;
   left: 100%;
   top: -.5em;
-  font-size: .5em;
-  padding: 0 .3em;
+  font-size: .6em;
+  font-weight: 500;
+  padding: 0 .25em;
   text-align: center;
-  min-width: 1.2em;
-  line-height: 1.2;
+  min-width: 1.4em;
+  line-height: 1.4;
   position: absolute;
-  border-radius: .6em;
+  border-radius: .7em;
   box-sizing: border-box;
   background-color: $red;
   transform: translateX(-50%);