update transfer opertion buttons

components/transfer/operation.jsx

@@ -18,21 +18,13 @@ class TransferOperation extends Component {
     } = this.props;
 
     const moveToLeftButton = (
-      <Button type="primary" disabled={!leftActive} onClick={moveToLeft}>
-        {
-          leftArrowText
-            ? <Icon type="left" /> + leftArrowText
-            : <Icon type="left" />
-        }
+      <Button type="primary" size="small" disabled={!leftActive} onClick={moveToLeft}>
+        {<span><Icon type="left" />{leftArrowText}</span>}
       </Button>
     );
     const moveToRightButton = (
-      <Button type="primary" disabled={!rightActive} onClick={moveToRight}>
-        {
-          rightArrowText
-            ? rightArrowText + <Icon type="right" />
-            : <Icon type="right" />
-        }
+      <Button type="primary" size="small" disabled={!rightActive} onClick={moveToRight}>
+        {<span>{rightArrowText}<Icon type="right" /></span>}
       </Button>
     );
     return <div className={className}>

style/components/transfer.less

@@ -10,6 +10,7 @@
     display: inline-block;
     border-radius: @border-radius-base;
     width: 160px;
+    vertical-align: middle;
 
     &-search {
       &-action {
@@ -90,15 +91,18 @@
     display: inline-block;
     overflow: hidden;
     margin: 0 8px;
-    vertical-align: top;
+    vertical-align: middle;
 
     .ant-btn {
       float: left;
       clear: both;
-      padding: 1px 5px;
 
-      i {
-        font-size: 10px;
+      &:first-child {
+        margin-bottom: 4px;
+      }
+
+      .anticon {
+        .iconfont-size-under-12px(10px);
       }
     }
   }