From d7a29f682baf6729f7003b8863d5dd88d77aa2a1 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Thu, 15 Jun 2017 15:34:47 +0800
Subject: [PATCH] upgrade Col span format in demo

---
 .../__tests__/__snapshots__/demo.test.js.snap |  4 ++++
 components/card/demo/grid.md                  | 19 ++++---------------
 components/form/demo/validate-static.md       |  6 +++---
 components/input/demo/group.md                |  4 ++--
 site/theme/template/Content/ComponentDoc.jsx  |  2 +-
 5 files changed, 14 insertions(+), 21 deletions(-)

diff --git a/components/card/__tests__/__snapshots__/demo.test.js.snap b/components/card/__tests__/__snapshots__/demo.test.js.snap
index 25dcebe5df..17db9099ea 100644
--- a/components/card/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/card/__tests__/__snapshots__/demo.test.js.snap
@@ -79,9 +79,11 @@ exports[`renders ./components/card/demo/grid.md correctly 1`] = `
 >
   <div
     class="ant-row"
+    style="margin-left:-8px;margin-right:-8px;"
   >
     <div
       class="ant-col-8"
+      style="padding-left:8px;padding-right:8px;"
     >
       <div
         class="ant-card"
@@ -104,6 +106,7 @@ exports[`renders ./components/card/demo/grid.md correctly 1`] = `
     </div>
     <div
       class="ant-col-8"
+      style="padding-left:8px;padding-right:8px;"
     >
       <div
         class="ant-card"
@@ -126,6 +129,7 @@ exports[`renders ./components/card/demo/grid.md correctly 1`] = `
     </div>
     <div
       class="ant-col-8"
+      style="padding-left:8px;padding-right:8px;"
     >
       <div
         class="ant-card"
diff --git a/components/card/demo/grid.md b/components/card/demo/grid.md
index f087fd453c..e9ce7fa7e3 100644
--- a/components/card/demo/grid.md
+++ b/components/card/demo/grid.md
@@ -18,28 +18,17 @@ import { Card, Col, Row } from 'antd';
 
 ReactDOM.render(
   <div style={{ background: '#ECECEC', padding: '30px' }}>
-    <Row>
-      <Col span="8">
+    <Row gutter={16}>
+      <Col span={8}>
         <Card title="Card title" bordered={false}>Card content</Card>
       </Col>
-      <Col span="8">
+      <Col span={8}>
         <Card title="Card title" bordered={false}>Card content</Card>
       </Col>
-      <Col span="8">
+      <Col span={8}>
         <Card title="Card title" bordered={false}>Card content</Card>
       </Col>
     </Row>
   </div>
 , mountNode);
 ````
-
-````css
-/* Increase grid spacing of 16px  */
-.code-box-demo .ant-row {
-  margin-left: -8px;
-  margin-right: -8px;
-}
-.code-box-demo .ant-row > div {
-  padding: 0 8px;
-}
-````
diff --git a/components/form/demo/validate-static.md b/components/form/demo/validate-static.md
index b67f0bca36..8bbaf581a9 100644
--- a/components/form/demo/validate-static.md
+++ b/components/form/demo/validate-static.md
@@ -105,15 +105,15 @@ ReactDOM.render(
       }}
       help
     >
-      <Col span="6">
+      <Col span={6}>
         <FormItem validateStatus="error" help="Please select the correct date">
           <DatePicker />
         </FormItem>
       </Col>
-      <Col span="1">
+      <Col span={1}>
         <p className="ant-form-split">-</p>
       </Col>
-      <Col span="6">
+      <Col span={6}>
         <FormItem>
           <DatePicker />
         </FormItem>
diff --git a/components/input/demo/group.md b/components/input/demo/group.md
index cb3e1b3174..8762134d90 100644
--- a/components/input/demo/group.md
+++ b/components/input/demo/group.md
@@ -63,10 +63,10 @@ class CompactDemo extends React.Component {
     return (
       <div>
         <InputGroup size="large">
-          <Col span="4">
+          <Col span={4}>
             <Input defaultValue="0571" />
           </Col>
-          <Col span="8">
+          <Col span={8}>
             <Input defaultValue="26888888" />
           </Col>
         </InputGroup>
diff --git a/site/theme/template/Content/ComponentDoc.jsx b/site/theme/template/Content/ComponentDoc.jsx
index ad52caaae4..7cf3e48c2d 100644
--- a/site/theme/template/Content/ComponentDoc.jsx
+++ b/site/theme/template/Content/ComponentDoc.jsx
@@ -117,7 +117,7 @@ export default class ComponentDoc extends React.Component {
               {leftChildren}
             </Col>
             {
-              isSingleCol ? null : <Col className="code-boxes-col-2-1" span="12">{rightChildren}</Col>
+              isSingleCol ? null : <Col className="code-boxes-col-2-1" span={12}>{rightChildren}</Col>
             }
           </Row>
           {