📝 optimize button docs and demos

components/button/demo/basic.md

@@ -7,11 +7,11 @@ title:
 
 ## zh-CN
 
-按钮有五种类型：主按钮、次按钮、虚线按钮、危险按钮和链接按钮。主按钮在同一个操作区域最多出现一次。
+按钮有死种类型：主按钮、次按钮、虚线按钮和链接按钮。主按钮在同一个操作区域最多出现一次。
 
 ## en-US
 
-There are `primary` button, `default` button, `dashed` button, `danger` button and `link` button in antd.
+There are `primary` button, `default` button, `dashed` button and `link` button in antd.
 
 ```jsx
 import { Button } from 'antd';
@@ -21,13 +21,6 @@ ReactDOM.render(
     <Button type="primary">Primary</Button>
     <Button>Default</Button>
     <Button type="dashed">Dashed</Button>
-    <Button type="primary" danger>
-      Danger
-    </Button>
-    <Button danger>Danger Default</Button>
-    <Button type="link" danger>
-      Danger Link
-    </Button>
     <Button type="link">Link</Button>
   </div>,
   mountNode,

components/button/demo/block.md

@@ -1,8 +1,8 @@
 ---
-order: 9
+order: 10
 title:
-  zh-CN: block 按钮
-  en-US: block Button
+  zh-CN: Block 按钮
+  en-US: Block Button
 ---
 
 ## zh-CN
@@ -25,15 +25,6 @@ ReactDOM.render(
     <Button type="dashed" block>
       Dashed
     </Button>
-    <Button type="primary" danger block>
-      Danger
-    </Button>
-    <Button danger block>
-      Danger Default
-    </Button>
-    <Button type="link" danger block>
-      Danger Link
-    </Button>
     <Button type="link" block>
       Link
     </Button>

components/button/demo/danger.md

@@ -0,0 +1,34 @@
+---
+order: 9
+title:
+  zh-CN: 危险按钮
+  en-US: Danger Buttons
+---
+
+## zh-CN
+
+在 4.0 之后，危险成为一种按钮属性而不是按钮类型。
+
+## en-US
+
+`danger` is a property of button after antd 4.0.
+
+```jsx
+import { Button } from 'antd';
+
+ReactDOM.render(
+  <>
+    <Button type="primary" danger>
+      Primary
+    </Button>
+    <Button danger>Default</Button>
+    <Button type="dashed" danger>
+      link
+    </Button>
+    <Button type="link" danger>
+      link
+    </Button>
+  </>,
+  mountNode,
+);
+```

components/button/demo/ghost.md

@@ -22,14 +22,8 @@ ReactDOM.render(
       Primary
     </Button>
     <Button ghost>Default</Button>
-    <Button type="primary" danger ghost>
-      danger
-    </Button>
-    <Button danger ghost>
-      Danger Default
-    </Button>
-    <Button type="link" danger ghost>
-      Danger Link
+    <Button type="dashed" ghost>
+      link
     </Button>
     <Button type="link" ghost>
       link

components/button/demo/size.md

@@ -49,15 +49,6 @@ class ButtonSize extends React.Component {
           Dashed
         </Button>
         <br />
-        <Button type="primary" danger size={size}>
-          Danger
-        </Button>
-        <Button danger size={size}>
-          Danger Default
-        </Button>
-        <Button danger type="link" size={size}>
-          Danger Link
-        </Button>
         <Button type="link" size={size}>
           Link
         </Button>

components/button/index.en-US.md

@@ -10,6 +10,18 @@ To trigger an operation.
 
 A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.
 
+In Ant Design we provide 4 types of button and 4 other properties additionally.
+
+- Primary button: indicate the main action, one primary button at most in one section.
+- Default button: indicate a series of actions without priority.
+- Dashed button: used for adding action commonly.
+- Link button: used for external links.
+
+- `danger`: used for actions of risk, like deletion or authorization.
+- `ghost`: used in situations with complex background, home pages usually.
+- `disabled`：when actions is not available.
+- `loading`: add loading spinner in button.
+
 ## API
 
 To get a customized button, just set `type`/`shape`/`size`/`loading`/`disabled`.

components/button/index.zh-CN.md

@@ -11,6 +11,18 @@ subtitle: 按钮
 
 标记了一个（或封装一组）操作命令，响应用户点击行为，触发相应的业务逻辑。
 
+在 Ant Design 中，我们有四种按钮类似和四种属性配合使用。
+
+- 主按钮：用于主行动点，一个操作区域只能有一个主按钮。
+- 默认按钮：用于没有主次之分的一组行动点。
+- 虚线按钮：常用于添加操作。
+- 链接按钮：用于次要或外链的行动点。
+
+- 危险：删除/移动/修改权限等危险操作，一般需要二次确认。
+- 幽灵：用于背景色比较复杂的地方，常用在首页/产品页等展示场景。
+- 禁用：行动点不可用的时候，一般需要文案解释。
+- 加载中：用于异步操作等待反馈的时候，也可以避免多次提交。
+
 ## API
 
 通过设置 Button 的属性来产生不同的按钮样式，推荐顺序为：`type` -> `shape` -> `size` -> `loading` -> `disabled`。