button contains icon only should has smaller padding

components/button/button.jsx

@@ -67,11 +67,13 @@ export default class Button extends React.Component {
       small: 'sm',
     })[size] || '';
 
+    console.log(children, icon);
     const classes = classNames({
       'ant-btn': true,
       [prefix + type]: type,
       [prefix + shape]: shape,
       [prefix + sizeCls]: sizeCls,
+      [`${prefix}icon-only`]: !children && icon,
       [`${prefix}loading`]: ('loading' in props && props.loading !== false),
       [className]: className,
     });

components/button/demo/button-group.md

@@ -39,12 +39,8 @@ ReactDOM.render(<div>
   </Button>
 </ButtonGroup>
 <ButtonGroup>
-  <Button type="primary">
-    <Icon type="cloud" />
-  </Button>
-  <Button type="primary">
-    <Icon type="cloud-download" />
-  </Button>
+  <Button type="primary" icon="cloud" />
+  <Button type="primary" icon="cloud-download" />
 </ButtonGroup>
 
 <h4>尺寸</h4>

components/progress/demo/circle-dynamic.md

@@ -6,7 +6,7 @@ title: 进度圈动态展示
 会动的进度条才是好进度条。
 
 ````jsx
-import { Progress, Button, Icon } from 'antd';
+import { Progress, Button } from 'antd';
 const ButtonGroup = Button.Group;
 
 const MyProgress = React.createClass({
@@ -34,12 +34,8 @@ const MyProgress = React.createClass({
       <div>
         <Progress type="circle" percent={this.state.percent} />
         <ButtonGroup>
-          <Button type="ghost" onClick={this.decline}>
-            <Icon type="minus" />
-          </Button>
-          <Button type="ghost" onClick={this.increase}>
-            <Icon type="plus" />
-          </Button>
+          <Button type="ghost" onClick={this.decline} icon="minus" />
+          <Button type="ghost" onClick={this.increase} icon="plus" />
         </ButtonGroup>
       </div>
     );

components/progress/demo/dynamic.md

@@ -6,7 +6,7 @@ title: 动态展示
 会动的进度条才是好进度条。
 
 ````jsx
-import { Progress, Button, Icon } from 'antd';
+import { Progress, Button } from 'antd';
 const ButtonGroup = Button.Group;
 
 const MyProgress = React.createClass({
@@ -34,12 +34,8 @@ const MyProgress = React.createClass({
       <div>
         <Progress percent={this.state.percent} />
         <ButtonGroup>
-          <Button type="ghost" onClick={this.decline}>
-            <Icon type="minus" />
-          </Button>
-          <Button type="ghost" onClick={this.increase}>
-            <Icon type="plus" />
-          </Button>
+          <Button type="ghost" onClick={this.decline} icon="minus" />
+          <Button type="ghost" onClick={this.increase} icon="plus" />
         </ButtonGroup>
       </div>
     );

style/components/button.less

@@ -88,6 +88,11 @@
     .btn-group(@btn-prefix-cls);
   }
 
+  &&-icon-only {
+    padding-left: 8px;
+    padding-right: 8px;
+  }
+
   // To ensure that a space will be placed between character and `Icon`.
   > .@{iconfont-css-prefix} + span,
   > span + .@{iconfont-css-prefix} {