remove ant-form-item-compact, rewrite form-item align style

components/form/FormItem.jsx

@@ -80,34 +80,11 @@ class FormItem extends React.Component {
     ];
   }
 
-  // 判断是否要 `.ant-form-item-compact` 样式类
-  _isCompact(children) {
-    const compactControls = ['checkbox', 'radio', 'radio-group', 'static', 'file'];
-    let isCompact = false;
-
-    const childrenArray = Array.isArray(children) ? children : [children];
-    childrenArray.map((child) => {
-      const type = child.props && child.props.type;
-      let prefixCls = child.props && child.props.prefixCls;
-      prefixCls = prefixCls ? prefixCls.substring(prefixCls.indexOf('-') + 1) : '';
-
-      if ((type && compactControls.indexOf(type) > -1) ||
-          (prefixCls && compactControls.indexOf(prefixCls) > -1)) {
-        isCompact = true;
-      } else if (child.props && typeof child.props.children === 'object') {
-        isCompact = this._isCompact(child.props.children);
-      }
-    });
-
-    return isCompact;
-  }
-
   renderFormItem(children) {
     const props = this.props;
     const prefixCls = props.prefixCls;
     const itemClassName = {
       [`${prefixCls}-item`]: true,
-      [`${prefixCls}-item-compact`]: this._isCompact(props.children),
       [`${prefixCls}-item-with-help`]: !!props.help,
       [`${props.className}`]: !!props.className,
     };

components/form/demo/horizontal-form.md

@@ -79,7 +79,7 @@ const Demo = React.createClass({
         <FormItem
           wrapperCol={{span: 14, offset: 6}} >
           <label>
-            <Checkbox name="agreement" value={formData.agreement} onChange={this.setValue.bind(this, 'agreement')} /> 同意
+            <Checkbox name="agreement" value={formData.agreement} onChange={this.setValue.bind(this, 'agreement')} />同意
           </label>
         </FormItem>
         <Row>

components/form/demo/inline-form.md

@@ -49,7 +49,7 @@ const Demo = React.createClass({
         </FormItem>
         <FormItem>
           <label className="ant-checkbox-inline">
-            <Checkbox name="agreement" value={formData.agreement} onChange={this.setValue.bind(this, 'agreement')} /> 记住我
+            <Checkbox name="agreement" value={formData.agreement} onChange={this.setValue.bind(this, 'agreement')} />记住我
           </label>
         </FormItem>
         <Button type="primary" htmlType="submit">登录</Button>

components/form/demo/mix.md

@@ -7,10 +7,12 @@
 ---
 
 ````jsx
-import { Form, Select, InputNumber, DatePicker, Switch,
+import { Form, Select, InputNumber, DatePicker, Switch, Radio,
          Slider, Button, message, Row, Col, Upload, Icon } from 'antd';
 const FormItem = Form.Item;
 const Option = Select.Option;
+const RadioButton = Radio.Button;
+const RadioGroup = Radio.Group;
 
 const Demo = React.createClass({
   mixins: [Form.ValueMixin],
@@ -117,18 +119,29 @@ const Demo = React.createClass({
             <DatePicker name="endDate" onChange={this.setValue.bind(this, 'endDate')} value={formData.endDate} />
           </Col>
         </FormItem>
+
+        <FormItem
+          label="选项："
+          labelCol={{span: 8}}>
+          <RadioGroup defaultValue="a" size="large">
+            <RadioButton value="a">选项一</RadioButton>
+            <RadioButton value="b">选项二</RadioButton>
+            <RadioButton value="c">选项三</RadioButton>
+          </RadioGroup>
+        </FormItem>
+
         <FormItem
           label="logo图："
           labelCol={{span: 8}}
           wrapperCol={{span: 16}}
-          help="提示信息要长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长">
+          help="提示信息要长长长长长长长长长长长长长长">
           <Upload name="logo" action="/upload.do" listType="picture" onChange={this.handleUpload}>
             <Button type="ghost">
               <Icon type="upload" /> 点击上传
             </Button>
           </Upload>
         </FormItem>
-        <Row>
+        <Row style={{marginTop: 24}}>
           <Col span="16" offset="8">
             <Button type="primary" htmlType="submit">确定</Button>
           </Col>

style/components/form.less

@@ -72,7 +72,6 @@ input[type="checkbox"] {
   color: #666;
 
   &-control {
-    min-height: 32px;
     line-height: 32px;
   }
 
@@ -84,6 +83,8 @@ input[type="checkbox"] {
     color: @label-color;
     text-align: right;
     vertical-align: middle;
+    padding-top: 7px;
+    padding-bottom: 7px;
 
     &:lang(en) {
       padding-right: 8px;
@@ -95,6 +96,11 @@ input[type="checkbox"] {
   }
 }
 
+.@{css-prefix}form-explain {
+  line-height: 1.5;
+  margin-top: 3px;
+}
+
 .@{css-prefix}form-text {
   display: inline-block;
   padding-right: 8px;
@@ -151,11 +157,6 @@ form {
   .@{css-prefix}checkbox-vertical,
   .@{css-prefix}radio-vertical {
     display: block;
-    margin-top: 16px;
-
-    &:first-child {
-      margin-top: 0;
-    }
   }
 
   .@{input-number-prefix-cls} {
@@ -230,15 +231,6 @@ form {
     .make-row;
   }
 
-  .@{css-prefix}form-item-compact {
-    label,
-    .@{css-prefix}form-text,
-    .@{css-prefix}form-split {
-      padding-top: 0;
-      padding-bottom: 0;
-    }
-  }
-
   .@{css-prefix}radio-inline,
   .@{css-prefix}checkbox-inline {
     vertical-align: top;
@@ -277,10 +269,9 @@ form {
 .@{css-prefix}form-horizontal,
 .@{css-prefix}form-inline {
   label {
-    line-height: 32px;
     > input[type="radio"],
     > input[type="checkbox"] {
-      margin-right: 5px;
+      margin-right: 4px;
     }
   }
 }