From b838be1d3ee125bba58c2c213c73de806e305519 Mon Sep 17 00:00:00 2001
From: wangxueliang <sandianbaozi@163.com>
Date: Tue, 7 Nov 2017 14:16:17 +0800
Subject: [PATCH 1/3] pagination showTotal

---
 components/pagination/demo/pagination.vue | 7 +++++--
 components/pagination/pagination.vue      | 1 +
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/components/pagination/demo/pagination.vue b/components/pagination/demo/pagination.vue
index 882548b64..2787d175d 100644
--- a/components/pagination/demo/pagination.vue
+++ b/components/pagination/demo/pagination.vue
@@ -8,7 +8,7 @@
       <vc-button @click="changeValue">改值</vc-button>
     </div>
     <div>
-      <pagination v-model="current" :total="total"></pagination>
+      <pagination v-model="current" :total="total" :showTotal="showTotal"></pagination>
       <vc-button @click="changeValue">改值</vc-button>
       <vc-button @click="getValue">当前值</vc-button>
     </div>
@@ -22,7 +22,7 @@ export default {
     return {
       simple: true,
       current: 1,
-      total: 500,
+      total: 483,
     }
   },
   methods: {
@@ -32,6 +32,9 @@ export default {
     getValue () {
       alert(this.current)
     },
+    showTotal (total) {
+      return `共 ${total} 条`
+    },
   },
   components: {
     Pagination,
diff --git a/components/pagination/pagination.vue b/components/pagination/pagination.vue
index fe2ea60a5..361bab746 100644
--- a/components/pagination/pagination.vue
+++ b/components/pagination/pagination.vue
@@ -52,6 +52,7 @@ export default {
       type: Boolean,
       default: true,
     },
+    showTotal: Function,
   },
   model: {
     prop: 'current',

From 748c8dc78217faba679d46e3e4eb24c22e1d97d1 Mon Sep 17 00:00:00 2001
From: wanlei <wanlei@yidian-inc.com>
Date: Tue, 7 Nov 2017 14:41:41 +0800
Subject: [PATCH 2/3] update: [grid] full demo supported :octocat:

---
 components/checkbox/demo/layout.vue  |  18 ++--
 components/grid/{col.vue => Col.vue} |  14 ++-
 components/grid/{row.vue => Row.vue} |   7 +-
 components/grid/demo/align.vue       |  62 +++++++++++++
 components/grid/demo/basic.vue       |  48 ++++++++++
 components/grid/demo/complex.vue     |  34 ++++++++
 components/grid/demo/flex-order.vue  |  35 ++++++++
 components/grid/demo/flex.vue        |  68 +++++++++++++++
 components/grid/demo/flexible.vue    |  34 ++++++++
 components/grid/demo/gutter.vue      |  35 ++++++++
 components/grid/demo/index.vue       |  75 ++++++++++++++++
 components/grid/demo/layout.vue      |  44 ++++++++++
 components/grid/demo/offset.vue      |  40 +++++++++
 components/grid/demo/pull.vue        |  33 +++++++
 components/grid/index.js             |   5 +-
 components/index.js                  |   4 +-
 components/switch/Switch.vue         |  87 ++++++++++++++++++
 components/switch/index.js           |   2 +
 components/switch/style/index.js     |   2 +
 components/switch/style/index.less   | 126 +++++++++++++++++++++++++++
 examples/grid.vue                    |  98 ---------------------
 21 files changed, 750 insertions(+), 121 deletions(-)
 rename components/grid/{col.vue => Col.vue} (89%)
 rename components/grid/{row.vue => Row.vue} (95%)
 create mode 100644 components/grid/demo/align.vue
 create mode 100644 components/grid/demo/basic.vue
 create mode 100644 components/grid/demo/complex.vue
 create mode 100644 components/grid/demo/flex-order.vue
 create mode 100644 components/grid/demo/flex.vue
 create mode 100644 components/grid/demo/flexible.vue
 create mode 100644 components/grid/demo/gutter.vue
 create mode 100644 components/grid/demo/index.vue
 create mode 100644 components/grid/demo/layout.vue
 create mode 100644 components/grid/demo/offset.vue
 create mode 100644 components/grid/demo/pull.vue
 create mode 100644 components/switch/Switch.vue
 create mode 100644 components/switch/index.js
 create mode 100644 components/switch/style/index.js
 create mode 100644 components/switch/style/index.less
 delete mode 100644 examples/grid.vue

diff --git a/components/checkbox/demo/layout.vue b/components/checkbox/demo/layout.vue
index c4e4708d0..9da57ce8e 100644
--- a/components/checkbox/demo/layout.vue
+++ b/components/checkbox/demo/layout.vue
@@ -1,12 +1,12 @@
 <template>
   <CheckboxGroup @change="onChange">
-    <Row>
-      <Col :span="8"><Checkbox value="A">A</Checkbox></Col>
-      <Col :span="8"><Checkbox value="B">B</Checkbox></Col>
-      <Col :span="8"><Checkbox value="C">C</Checkbox></Col>
-      <Col :span="8"><Checkbox value="D">D</Checkbox></Col>
-      <Col :span="8"><Checkbox value="E">E</Checkbox></Col>
-    </Row>
+    <AntRow>
+      <AntCol :span="8"><Checkbox value="A">A</Checkbox></AntCol>
+      <AntCol :span="8"><Checkbox value="B">B</Checkbox></AntCol>
+      <AntCol :span="8"><Checkbox value="C">C</Checkbox></AntCol>
+      <AntCol :span="8"><Checkbox value="D">D</Checkbox></AntCol>
+      <AntCol :span="8"><Checkbox value="E">E</Checkbox></AntCol>
+    </AntRow>
   </CheckboxGroup>
 </template>
 <script>
@@ -19,8 +19,8 @@ export default {
   },
   components: {
     Checkbox,
-    Row,
-    Col,
+    AntRow: Row,
+    AntCol: Col,
     CheckboxGroup: Checkbox.Group,
   },
 }
diff --git a/components/grid/col.vue b/components/grid/Col.vue
similarity index 89%
rename from components/grid/col.vue
rename to components/grid/Col.vue
index 6a01bacfb..b35e35882 100644
--- a/components/grid/col.vue
+++ b/components/grid/Col.vue
@@ -10,7 +10,7 @@
   }
 
   export default {
-    name: 'Col',
+    name: 'Ant-Col',
     props: {
       prefixCls: {
         'default': 'ant-col',
@@ -27,6 +27,9 @@
       lg: [Number, Object],
       xl: [Number, Object],
     },
+    inject: {
+      parentRow: { 'default': undefined },
+    },
     computed: {
       classes () {
         const { prefixCls, span, order, offset, push, pull } = this
@@ -59,12 +62,8 @@
         }
       },
       gutter () {
-        let parent = this.$parent
-        while (parent && parent.$options.name !== 'Row') {
-          console.info(parent.$options.name)
-          parent = parent.$parent
-        }
-        return parent ? parent.gutter : 0
+        const parent = this.parentRow
+        return parent ? +parent.gutter : 0
       },
     },
     render (h) {
@@ -73,7 +72,6 @@
         style.paddingLeft = this.gutter / 2 + 'px'
         style.paddingRight = style.paddingLeft
       }
-      console.info(style)
       // why only unnamed slots
       return h('div', {
         'class': this.classes,
diff --git a/components/grid/row.vue b/components/grid/Row.vue
similarity index 95%
rename from components/grid/row.vue
rename to components/grid/Row.vue
index 65f76f579..df1ee6d7a 100644
--- a/components/grid/row.vue
+++ b/components/grid/Row.vue
@@ -5,7 +5,7 @@
 </template>
 <script>
   export default {
-    name: 'Row',
+    name: 'Ant-Row',
     props: {
       prefixCls: {
         'default': 'ant-row',
@@ -47,6 +47,11 @@
         },
       }
     },
+    provide() {
+      return {
+        parentRow: this,
+      }
+    },
     computed: {
       classes () {
         const { prefixCls, type, align, justify } = this
diff --git a/components/grid/demo/align.vue b/components/grid/demo/align.vue
new file mode 100644
index 000000000..403634e5c
--- /dev/null
+++ b/components/grid/demo/align.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="grid">
+    <ant-row type="flex" justify="center" align="top">
+      <ant-col :span="4" class="color1"><DemoBox :value="100">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="50">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color1"><DemoBox :value="120">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="80">col-4</DemoBox></ant-col>
+    </ant-row>
+
+    <p>Align Center</p>
+    <ant-row type="flex" justify="space-around" align="middle">
+      <ant-col :span="4" class="color1"><DemoBox :value="100">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="50">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color1"><DemoBox :value="120">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="80">col-4</DemoBox></ant-col>
+    </ant-row>
+
+    <p>Align Bottom</p>
+    <ant-row type="flex" justify="space-between" align="bottom">
+      <ant-col :span="4" class="color1"><DemoBox :value="100">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="50">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color1"><DemoBox :value="120">col-4</DemoBox></ant-col>
+      <ant-col :span="4" class="color2"><DemoBox :value="80">col-4</DemoBox></ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import Vue from 'vue'
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  const DemoBox = Vue.component('DemoBox', {
+    props: ['value'],
+    template: `<p :style="{height: value + 'px'}">{{value}}</p>`,
+  })
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col,
+      DemoBox,
+    },
+  }
+
+
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+  .height-100 {
+    height: 100px;
+  }
+</style>
diff --git a/components/grid/demo/basic.vue b/components/grid/demo/basic.vue
new file mode 100644
index 000000000..dd6b80617
--- /dev/null
+++ b/components/grid/demo/basic.vue
@@ -0,0 +1,48 @@
+<template>
+  <div class="basic">
+    <ant-row>
+      <ant-col class="color1" :span="24" >100%</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="6" >25%</ant-col>
+      <ant-col class="color1" :span="6" :offset="6" >25%</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="8" >33.33%</ant-col>
+      <ant-col class="color1" :span="8" :offset="8" >33.33%</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="12" >50%</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="18" >66.66%</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less" scoped>
+  .basic {
+    background: linear-gradient(90deg,#f5f5f5 4.16666667%,transparent 0,transparent 8.33333333%,#f5f5f5 0,#f5f5f5 12.5%,transparent 0,transparent 16.66666667%,#f5f5f5 0,#f5f5f5 20.83333333%,transparent 0,transparent 25%,#f5f5f5 0,#f5f5f5 29.16666667%,transparent 0,transparent 33.33333333%,#f5f5f5 0,#f5f5f5 37.5%,transparent 0,transparent 41.66666667%,#f5f5f5 0,#f5f5f5 45.83333333%,transparent 0,transparent 50%,#f5f5f5 0,#f5f5f5 54.16666667%,transparent 0,transparent 58.33333333%,#f5f5f5 0,#f5f5f5 62.5%,transparent 0,transparent 66.66666667%,#f5f5f5 0,#f5f5f5 70.83333333%,transparent 0,transparent 75%,#f5f5f5 0,#f5f5f5 79.16666667%,transparent 0,transparent 83.33333333%,#f5f5f5 0,#f5f5f5 87.5%,transparent 0,transparent 91.66666667%,#f5f5f5 0,#f5f5f5 95.83333333%,transparent 0);
+  }
+  .basic div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .show-block {
+    margin: 20px 0;
+  }
+  .color1 {
+    background: rgba(0, 191, 255, 0.52);
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/complex.vue b/components/grid/demo/complex.vue
new file mode 100644
index 000000000..490bbb4c7
--- /dev/null
+++ b/components/grid/demo/complex.vue
@@ -0,0 +1,34 @@
+<template>
+  <div class="grid">
+    <ant-row>
+      <ant-col :xs="{ span: 5, offset: 1 }" :lg="{ span: 6, offset: 2 }" class="color1">Col</ant-col>
+      <ant-col :xs="{ span: 11, offset: 1 }" :lg="{ span: 6, offset: 2 }" class="color2">Col</ant-col>
+      <ant-col :xs="{ span: 5, offset: 1 }" :lg="{ span: 6, offset: 2 }" class="color1">Col</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/flex-order.vue b/components/grid/demo/flex-order.vue
new file mode 100644
index 000000000..2f680b396
--- /dev/null
+++ b/components/grid/demo/flex-order.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="grid">
+    <ant-row type="flex">
+      <ant-col :span="6" :order="4" class="color1">1 col-order-4</ant-col>
+      <ant-col :span="6" :order="3" class="color2">2 col-order-3</ant-col>
+      <ant-col :span="6" :order="2" class="color1">3 col-order-2</ant-col>
+      <ant-col :span="6" :order="1" class="color2">4 col-order-1</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/flex.vue b/components/grid/demo/flex.vue
new file mode 100644
index 000000000..d7deb1566
--- /dev/null
+++ b/components/grid/demo/flex.vue
@@ -0,0 +1,68 @@
+<template>
+  <div class="grid">
+    <p>sub-element align left</p>
+    <ant-row type="flex" justify="start">
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+    </ant-row>
+
+    <p>sub-element align center</p>
+    <ant-row type="flex" justify="center">
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+    </ant-row>
+
+    <p>sub-element align right</p>
+    <ant-row type="flex" justify="end">
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+    </ant-row>
+
+    <p>sub-element monospaced arrangement</p>
+    <ant-row type="flex" justify="space-between">
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+    </ant-row>
+
+    <p>sub-element align full</p>
+    <ant-row type="flex" justify="space-around">
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+      <ant-col :span="4" class="color1">col-4</ant-col>
+      <ant-col :span="4" class="color2">col-4</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/flexible.vue b/components/grid/demo/flexible.vue
new file mode 100644
index 000000000..96a5c6a01
--- /dev/null
+++ b/components/grid/demo/flexible.vue
@@ -0,0 +1,34 @@
+<template>
+  <div class="grid">
+    <ant-row>
+      <ant-col :xs="2" :sm="4" :md="6" :lg="8" :xl="10" class="color1">Col</ant-col>
+      <ant-col :xs="20" :sm="16" :md="12" :lg="8" :xl="4" class="color2">Col</ant-col>
+      <ant-col :xs="2" :sm="4" :md="6" :lg="8" :xl="10" class="color1">Col</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/gutter.vue b/components/grid/demo/gutter.vue
new file mode 100644
index 000000000..b9ce3d289
--- /dev/null
+++ b/components/grid/demo/gutter.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="grid" style="overflow: hidden;">
+    <ant-row :gutter="24">
+      <ant-col :span="6"><div class="color2">col-6</div></ant-col>
+      <ant-col :span="6"><div class="color2">col-6</div></ant-col>
+      <ant-col :span="6"><div class="color2">col-6</div></ant-col>
+      <ant-col :span="6"><div class="color2">col-6</div></ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/index.vue b/components/grid/demo/index.vue
new file mode 100644
index 000000000..9d25299d3
--- /dev/null
+++ b/components/grid/demo/index.vue
@@ -0,0 +1,75 @@
+<template>
+  <div class="topLevel">
+    <h1>基础布局</h1>
+    <basic/>
+    <h1>恩。基础</h1>
+    <layout/>
+    <h1>区块间隔</h1>
+    <gutter/>
+    <h1>偏移</h1>
+    <offset/>
+    <h1>栅格排序</h1>
+    <pull/>
+    <h1>FLEX</h1>
+    <flex/>
+    <h1>对齐</h1>
+    <align/>
+    <h1>Flex排序</h1>
+    <flex-order/>
+    <h1>响应式设计</h1>
+    <flexible/>
+    <h1>复杂一点</h1>
+    <complex/>
+  </div>
+</template>
+<script>
+import { Grid } from 'antd'
+const { Row, Col } = Grid
+import Basic from './basic.vue'
+import Layout from './layout.vue'
+import Gutter from './gutter.vue'
+import Offset from './offset.vue'
+import Pull from './pull.vue'
+import Flex from './flex.vue'
+import Align from './align.vue'
+import FlexOrder from './flex-order.vue'
+import Flexible from './flexible.vue'
+import Complex from './complex.vue'
+export default {
+  components: {
+    AntRow: Row,
+    AntCol: Col,
+    Basic,
+    Layout,
+    Gutter,
+    Offset,
+    Pull,
+    Flex,
+    Align,
+    FlexOrder,
+    Flexible,
+    Complex,
+  },
+}
+</script>
+<style lang="less">
+  .topLevel .ant-row{
+    margin: 10px 0;
+  }
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .show-block {
+    margin: 20px 0;
+  }
+  .color1 {
+    background: #00bfff;
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/layout.vue b/components/grid/demo/layout.vue
new file mode 100644
index 000000000..58ca44de9
--- /dev/null
+++ b/components/grid/demo/layout.vue
@@ -0,0 +1,44 @@
+<template>
+  <div class="grid">
+    <ant-row>
+      <ant-col class="color1" :span="12" >col-12</ant-col>
+      <ant-col class="color2" :span="12" >col-12</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="8" >col-8</ant-col>
+      <ant-col class="color2" :span="8" >col-8</ant-col>
+      <ant-col class="color1" :span="8" >col-8</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col class="color1" :span="6" >col-6</ant-col>
+      <ant-col class="color2" :span="6" >col-6</ant-col>
+      <ant-col class="color1" :span="6" >col-6</ant-col>
+      <ant-col class="color2" :span="6" >col-6</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/offset.vue b/components/grid/demo/offset.vue
new file mode 100644
index 000000000..293141411
--- /dev/null
+++ b/components/grid/demo/offset.vue
@@ -0,0 +1,40 @@
+<template>
+  <div class="grid">
+    <ant-row>
+      <ant-col :span="8" class="color1">col-8</ant-col>
+      <ant-col :span="8" :offset="8" class="color2">col-8</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col :span="6" :offset="6" class="color1">col-6 col-offset-6</ant-col>
+      <ant-col :span="6" :offset="6" class="color2">col-6 col-offset-6</ant-col>
+    </ant-row>
+    <ant-row>
+      <ant-col :span="12" :offset="6" class="color1">col-12 col-offset-6</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/demo/pull.vue b/components/grid/demo/pull.vue
new file mode 100644
index 000000000..1b249d074
--- /dev/null
+++ b/components/grid/demo/pull.vue
@@ -0,0 +1,33 @@
+<template>
+  <div class="grid">
+    <ant-row>
+      <ant-col :span="18" :push="6" class="color1">col-18 col-push-6</ant-col>
+      <ant-col :span="6" :pull="18" class="color2">col-6 col-pull-18</ant-col>
+    </ant-row>
+  </div>
+</template>
+<script>
+  import { Grid } from 'antd'
+  const { Row, Col } = Grid
+  export default {
+    components: {
+      AntRow: Row,
+      AntCol: Col
+    },
+  }
+</script>
+<style lang="less">
+  .grid div {
+    text-align: center;
+    vertical-align: middle;
+    line-height: 40px;
+  }
+  .color1 {
+    background: rgb(0, 191, 255);
+    color: white;
+  }
+  .color2 {
+    background: #0e77ca;
+    color: white;
+  }
+</style>
diff --git a/components/grid/index.js b/components/grid/index.js
index 352a384d8..cd65231b0 100644
--- a/components/grid/index.js
+++ b/components/grid/index.js
@@ -1,7 +1,6 @@
-import Row from './row.vue'
-import Col from './col.vue'
+import Row from './Row.vue'
+import Col from './Col.vue'
 
 export default {
   Col, Row,
 }
-
diff --git a/components/index.js b/components/index.js
index ca29ac8f5..be9cf66de 100644
--- a/components/index.js
+++ b/components/index.js
@@ -12,6 +12,6 @@ export { default as Rate } from './rate'
 
 export { default as ToolTip } from './tooltip'
 
-export { default as Row } from './grid/row'
+export { default as Row } from './grid/Row'
 
-export { default as Col } from './grid/col'
+export { default as Col } from './grid/Col'
diff --git a/components/switch/Switch.vue b/components/switch/Switch.vue
new file mode 100644
index 000000000..3f3a22ab5
--- /dev/null
+++ b/components/switch/Switch.vue
@@ -0,0 +1,87 @@
+<template>
+  <span>
+    <span class={`${prefixCls}-inner`}>
+      <component></component>
+    </span>
+  </span>
+</template>
+<script>
+export default {
+  name: 'Radio',
+  props: {
+    prefixCls: {
+      default: 'ant-radio',
+      type: String,
+    },
+    defaultChecked: Boolean,
+    checked: { type: Boolean, default: undefined },
+    disabled: Boolean,
+    isGroup: Boolean,
+    value: [String, Number, Boolean],
+    name: String,
+    onGroupChange: Function,
+  },
+  model: {
+    prop: 'checked',
+  },
+  data () {
+    const { checked, defaultChecked } = this
+    return {
+      stateChecked: checked === undefined ? defaultChecked : checked,
+    }
+  },
+  computed: {
+    hasDefaultSlot () {
+      return !!this.$slots.default
+    },
+    classes () {
+      const { prefixCls, disabled, stateChecked } = this
+      return {
+        [`${prefixCls}-wrapper`]: true,
+        [`${prefixCls}-wrapper-checked`]: stateChecked,
+        [`${prefixCls}-wrapper-disabled`]: disabled,
+      }
+    },
+    checkboxClass () {
+      const { prefixCls, disabled, stateChecked } = this
+      return {
+        [`${prefixCls}`]: true,
+        [`${prefixCls}-checked`]: stateChecked,
+        [`${prefixCls}-disabled`]: disabled,
+      }
+    },
+  },
+  methods: {
+    handleChange (event) {
+      const targetChecked = event.target.checked
+      const { name, value, checked } = this
+      if (checked === undefined) {
+        this.stateChecked = targetChecked
+      }
+      this.$emit('input', targetChecked)
+      const target = {
+        name,
+        value,
+        checked: targetChecked,
+      }
+      this.$emit('change', {
+        target,
+        stopPropagation () {
+          event.stopPropagation()
+        },
+        preventDefault () {
+          event.preventDefault()
+        },
+      })
+      if (this.isGroup) {
+        this.onGroupChange({ target })
+      }
+    },
+  },
+  watch: {
+    checked (val) {
+      this.stateChecked = val
+    },
+  },
+}
+</script>
diff --git a/components/switch/index.js b/components/switch/index.js
new file mode 100644
index 000000000..54acb541f
--- /dev/null
+++ b/components/switch/index.js
@@ -0,0 +1,2 @@
+import Switch from './Switch.vue'
+export default Switch
diff --git a/components/switch/style/index.js b/components/switch/style/index.js
new file mode 100644
index 000000000..cf31ed80f
--- /dev/null
+++ b/components/switch/style/index.js
@@ -0,0 +1,2 @@
+import '../../style/index.less'
+import './index.less'
diff --git a/components/switch/style/index.less b/components/switch/style/index.less
new file mode 100644
index 000000000..8d3bcc552
--- /dev/null
+++ b/components/switch/style/index.less
@@ -0,0 +1,126 @@
+@import "../../style/themes/default";
+@import "../../style/mixins/index";
+
+@switch-prefix-cls: ~"@{ant-prefix}-switch";
+@switch-duration: .36s;
+
+.@{switch-prefix-cls} {
+  position: relative;
+  display: inline-block;
+  box-sizing: border-box;
+  height: 22px;
+  min-width: 44px;
+  line-height: 20px;
+  vertical-align: middle;
+  border-radius: 20px;
+  border: 1px solid transparent;
+  background-color: @disabled-color;
+  cursor: pointer;
+  transition: all @switch-duration;
+  user-select: none;
+
+  &-inner {
+    color: #fff;
+    font-size: @font-size-base;
+    margin-left: 24px;
+    margin-right: 6px;
+    display: block;
+  }
+
+  &:after {
+    position: absolute;
+    width: 18px;
+    height: 18px;
+    left: 1px;
+    top: 1px;
+
+    border-radius: 18px;
+    background-color: @component-background;
+    content: " ";
+    cursor: pointer;
+    transition: all @switch-duration @ease-in-out-circ;
+  }
+
+  &:active:after {
+    width: 24px;
+  }
+
+  &:focus {
+    box-shadow: 0 0 0 2px fade(@primary-color, 20%);
+    outline: 0;
+  }
+
+  &:focus:hover {
+    box-shadow: none;
+  }
+
+  &-small {
+    height: 14px;
+    min-width: 28px;
+    line-height: 12px;
+
+    .@{switch-prefix-cls}-inner {
+      margin-left: 18px;
+      margin-right: 3px;
+    }
+
+    &:after {
+      width: 12px;
+      height: 12px;
+      top: 0;
+      left: 0.5px;
+    }
+
+    &:active:after {
+      width: 16px;
+    }
+  }
+
+  &-small&-checked {
+    &:after {
+      left: 100%;
+      margin-left: -12.5px;
+    }
+
+    .@{switch-prefix-cls}-inner {
+      margin-left: 3px;
+      margin-right: 18px;
+    }
+  }
+
+  &-small:active&-checked:after {
+    margin-left: -16.5px;
+  }
+
+  &-checked {
+    background-color: @primary-color;
+
+    .@{switch-prefix-cls}-inner {
+      margin-left: 6px;
+      margin-right: 24px;
+    }
+
+    &:after {
+      left: 100%;
+      margin-left: -19px;
+    }
+
+    &:active:after {
+      margin-left: -25px;
+    }
+  }
+
+  &-disabled {
+    cursor: not-allowed;
+    background: #f4f4f4;
+
+    &:after {
+      background: #ccc;
+      cursor: not-allowed;
+    }
+
+    .@{switch-prefix-cls}-inner {
+      color: @disabled-color;
+    }
+  }
+}
diff --git a/examples/grid.vue b/examples/grid.vue
deleted file mode 100644
index a721853b9..000000000
--- a/examples/grid.vue
+++ /dev/null
@@ -1,98 +0,0 @@
-<template>
-  <div class="grid">
-    <div class="show-block">
-      <ant-row gutter="10">
-        <ant-col :style="style1" :span="6">
-          <div :style="style2">1</div>
-        </ant-col>
-        <ant-col :style="style1" :span="6">
-          <div :style="style2">2</div>
-        </ant-col>
-        <ant-col :style="style1" :span="6">
-          <div :style="style2">3</div>
-        </ant-col>
-        <ant-col :style="style1" :span="6">
-          <div :style="style2">4</div>
-        </ant-col>
-      </ant-row>
-    </div>
-    <div class="show-block">
-      <ant-row gutter="10">
-        <ant-col :style="style1" :span="6" :offset="2">
-          <div :style="style2">offset = 2</div>
-        </ant-col>
-        <ant-col :style="style1" :span="6" :offset="2">
-          <div :style="style2">offset = 2</div>
-        </ant-col>
-      </ant-row>
-    </div>
-    <div class="show-block">
-      <ant-row gutter="10" type="flex">
-        <ant-col class="height1 color1" :span="6">
-          <div class="">F</div>
-        </ant-col>
-        <ant-col class="height2 color2" :span="6">
-          <div class="">L</div>
-        </ant-col>
-        <ant-col class="height3 color1" :span="6">
-          <div class="">E</div>
-        </ant-col>
-        <ant-col class="height4 color2" :span="6">
-          <div class="">X</div>
-        </ant-col>
-      </ant-row>
-    </div>
-  </div>
-</template>
-<script>
-import { Grid } from '../components'
-const { Row, Col } = Grid
-export default {
-  data () {
-    return {
-      style1: { height: 40 + 'px' },
-      style2: { background: '#00bfff', height: 40 + 'px' }
-    }
-  },
-  methods: {
-    handleClick (event) {
-      console.log(event)
-      this.type = this.type === 'primary' ? 'danger' : 'primary'
-    },
-  },
-  components: {
-    AntRow: Row,
-    AntCol: Col
-  },
-}
-</script>
-<style lang="less">
-  .grid div {
-    text-align: center;
-    vertical-align: middle;
-    line-height: 40px;
-  }
-  .show-block {
-    margin: 20px 0;
-  }
-  .height1 {
-    height: 60px;
-  }
-  .height2 {
-    height: 40px;
-  }
-  .height3 {
-    height: 80px;
-  }
-  .height4 {
-    height: 50px;
-  }
-  .color1 {
-    background: #00bfff;
-    color: white;
-  }
-  .color2 {
-    background: #0e77ca;
-    color: white;
-  }
-</style>

From a7398d4842d4b449512ef2d393e9e5c618ffd5c3 Mon Sep 17 00:00:00 2001
From: wanlei <wanlei@yidian-inc.com>
Date: Thu, 9 Nov 2017 10:19:38 +0800
Subject: [PATCH 3/3] fix: [switch] removed

---
 components/switch/Switch.vue       |  87 --------------------
 components/switch/index.js         |   2 -
 components/switch/style/index.js   |   2 -
 components/switch/style/index.less | 126 -----------------------------
 4 files changed, 217 deletions(-)
 delete mode 100644 components/switch/Switch.vue
 delete mode 100644 components/switch/index.js
 delete mode 100644 components/switch/style/index.js
 delete mode 100644 components/switch/style/index.less

diff --git a/components/switch/Switch.vue b/components/switch/Switch.vue
deleted file mode 100644
index 3f3a22ab5..000000000
--- a/components/switch/Switch.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<template>
-  <span>
-    <span class={`${prefixCls}-inner`}>
-      <component></component>
-    </span>
-  </span>
-</template>
-<script>
-export default {
-  name: 'Radio',
-  props: {
-    prefixCls: {
-      default: 'ant-radio',
-      type: String,
-    },
-    defaultChecked: Boolean,
-    checked: { type: Boolean, default: undefined },
-    disabled: Boolean,
-    isGroup: Boolean,
-    value: [String, Number, Boolean],
-    name: String,
-    onGroupChange: Function,
-  },
-  model: {
-    prop: 'checked',
-  },
-  data () {
-    const { checked, defaultChecked } = this
-    return {
-      stateChecked: checked === undefined ? defaultChecked : checked,
-    }
-  },
-  computed: {
-    hasDefaultSlot () {
-      return !!this.$slots.default
-    },
-    classes () {
-      const { prefixCls, disabled, stateChecked } = this
-      return {
-        [`${prefixCls}-wrapper`]: true,
-        [`${prefixCls}-wrapper-checked`]: stateChecked,
-        [`${prefixCls}-wrapper-disabled`]: disabled,
-      }
-    },
-    checkboxClass () {
-      const { prefixCls, disabled, stateChecked } = this
-      return {
-        [`${prefixCls}`]: true,
-        [`${prefixCls}-checked`]: stateChecked,
-        [`${prefixCls}-disabled`]: disabled,
-      }
-    },
-  },
-  methods: {
-    handleChange (event) {
-      const targetChecked = event.target.checked
-      const { name, value, checked } = this
-      if (checked === undefined) {
-        this.stateChecked = targetChecked
-      }
-      this.$emit('input', targetChecked)
-      const target = {
-        name,
-        value,
-        checked: targetChecked,
-      }
-      this.$emit('change', {
-        target,
-        stopPropagation () {
-          event.stopPropagation()
-        },
-        preventDefault () {
-          event.preventDefault()
-        },
-      })
-      if (this.isGroup) {
-        this.onGroupChange({ target })
-      }
-    },
-  },
-  watch: {
-    checked (val) {
-      this.stateChecked = val
-    },
-  },
-}
-</script>
diff --git a/components/switch/index.js b/components/switch/index.js
deleted file mode 100644
index 54acb541f..000000000
--- a/components/switch/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-import Switch from './Switch.vue'
-export default Switch
diff --git a/components/switch/style/index.js b/components/switch/style/index.js
deleted file mode 100644
index cf31ed80f..000000000
--- a/components/switch/style/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-import '../../style/index.less'
-import './index.less'
diff --git a/components/switch/style/index.less b/components/switch/style/index.less
deleted file mode 100644
index 8d3bcc552..000000000
--- a/components/switch/style/index.less
+++ /dev/null
@@ -1,126 +0,0 @@
-@import "../../style/themes/default";
-@import "../../style/mixins/index";
-
-@switch-prefix-cls: ~"@{ant-prefix}-switch";
-@switch-duration: .36s;
-
-.@{switch-prefix-cls} {
-  position: relative;
-  display: inline-block;
-  box-sizing: border-box;
-  height: 22px;
-  min-width: 44px;
-  line-height: 20px;
-  vertical-align: middle;
-  border-radius: 20px;
-  border: 1px solid transparent;
-  background-color: @disabled-color;
-  cursor: pointer;
-  transition: all @switch-duration;
-  user-select: none;
-
-  &-inner {
-    color: #fff;
-    font-size: @font-size-base;
-    margin-left: 24px;
-    margin-right: 6px;
-    display: block;
-  }
-
-  &:after {
-    position: absolute;
-    width: 18px;
-    height: 18px;
-    left: 1px;
-    top: 1px;
-
-    border-radius: 18px;
-    background-color: @component-background;
-    content: " ";
-    cursor: pointer;
-    transition: all @switch-duration @ease-in-out-circ;
-  }
-
-  &:active:after {
-    width: 24px;
-  }
-
-  &:focus {
-    box-shadow: 0 0 0 2px fade(@primary-color, 20%);
-    outline: 0;
-  }
-
-  &:focus:hover {
-    box-shadow: none;
-  }
-
-  &-small {
-    height: 14px;
-    min-width: 28px;
-    line-height: 12px;
-
-    .@{switch-prefix-cls}-inner {
-      margin-left: 18px;
-      margin-right: 3px;
-    }
-
-    &:after {
-      width: 12px;
-      height: 12px;
-      top: 0;
-      left: 0.5px;
-    }
-
-    &:active:after {
-      width: 16px;
-    }
-  }
-
-  &-small&-checked {
-    &:after {
-      left: 100%;
-      margin-left: -12.5px;
-    }
-
-    .@{switch-prefix-cls}-inner {
-      margin-left: 3px;
-      margin-right: 18px;
-    }
-  }
-
-  &-small:active&-checked:after {
-    margin-left: -16.5px;
-  }
-
-  &-checked {
-    background-color: @primary-color;
-
-    .@{switch-prefix-cls}-inner {
-      margin-left: 6px;
-      margin-right: 24px;
-    }
-
-    &:after {
-      left: 100%;
-      margin-left: -19px;
-    }
-
-    &:active:after {
-      margin-left: -25px;
-    }
-  }
-
-  &-disabled {
-    cursor: not-allowed;
-    background: #f4f4f4;
-
-    &:after {
-      background: #ccc;
-      cursor: not-allowed;
-    }
-
-    .@{switch-prefix-cls}-inner {
-      color: @disabled-color;
-    }
-  }
-}