optimize code style

components/datepicker/demo/size.md

@@ -11,9 +11,9 @@ var Datepicker = antd.Datepicker;
 
 React.render(
   <div>
-    <Datepicker size={"large"} />
+    <Datepicker size="large" />
     <Datepicker />
-    <Datepicker size={"small"} />
+    <Datepicker size="small" />
   </div>
 , document.getElementById('components-datepicker-demo-size'));
 ````

components/datepicker/index.jsx

@@ -64,12 +64,11 @@ export default React.createClass({
         showOk={this.props.showTime}
         showClear={false}/>
     );
-    var sizeClass = ' ant-input-';
-    if(this.props.size === 'large'){
-      sizeClass += 'lg';
-    }
-    if(this.props.size === 'small'){
-      sizeClass += 'sm';
+    var sizeClass = '';
+    if (this.props.size === 'large') {
+      sizeClass = ' ant-input-lg';
+    } else if (this.props.size === 'small') {
+      sizeClass = ' ant-input-sm';
     }
     return (
       <Datepicker

components/form/demo/form-controls.md

@@ -36,7 +36,7 @@ React.render(
   <div className="ant-form-item">
     <label className="col-6">Select 选择器：</label>
     <div className="col-14">
-      <Select size={"large"} value="lucy" style={{width:200}} onChange={handleSelectChange}>
+      <Select size="large" value="lucy" style={{width:200}} onChange={handleSelectChange}>
         <Option value="jack">jack</Option>
         <Option value="lucy">lucy</Option>
         <Option value="disabled" disabled>disabled</Option>

components/form/demo/mix.md

@@ -41,7 +41,7 @@ React.render(
   <div className="ant-form-item">
     <label className="col-8" required>InputNumber 数字输入框：</label>
     <div className="col-10">
-      <InputNumber size={"large"} min={1} max={10} defaultValue={3} onChange={onInputNumberChange} style={{width:100}}/>
+      <InputNumber size="large" min={1} max={10} defaultValue={3} onChange={onInputNumberChange} style={{width:100}}/>
       <span className="ant-form-text"> 台机器</span>
     </div>
   </div>
@@ -71,7 +71,7 @@ React.render(
   <div className="ant-form-item">
     <label for="" className="col-8" required>Select 选择器：</label>
     <div className="col-16">
-      <Select size={"large"} value="lucy" style={{width:200}} onChange={handleSelectChange}>
+      <Select size="large" value="lucy" style={{width:200}} onChange={handleSelectChange}>
         <Option value="jack">jack</Option>
         <Option value="lucy">lucy</Option>
         <Option value="disabled" disabled>disabled</Option>

components/input-number/demo/size.md

@@ -15,9 +15,9 @@ function onChange(value) {
 
 React.render(
 <div>
-  <InputNumber size={"large"} min={1} max={100000} defaultValue={3} onChange={onChange} />
+  <InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} />
   <InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
-  <InputNumber size={"small"} min={1} max={100000} defaultValue={3} onChange={onChange} />
+  <InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
 </div>
 , document.getElementById('components-input-number-demo-size'));
 ````

components/input-number/index.jsx

@@ -8,12 +8,11 @@ export default React.createClass({
     };
   },
   render() {
-    var sizeClass = 'ant-input-number-';
-    if(this.props.size === 'large'){
-      sizeClass += 'lg';
-    }
-    if(this.props.size === 'small'){
-      sizeClass += 'sm';
+    var sizeClass = '';
+    if (this.props.size === 'large') {
+      sizeClass = 'ant-input-number-lg';
+    } else if (this.props.size === 'small') {
+      sizeClass = 'ant-input-number-sm';
     }
     return <InputNumber className={sizeClass} style={{width: 90}} {...this.props} />;
   }

components/select/demo/size.md

@@ -16,7 +16,7 @@ function handleChange(value) {
 
 React.render(
   <div>
-  <Select size={"large"} value="lucy" style={{width:200}} onChange={handleChange}>
+  <Select size="large" value="lucy" style={{width:200}} onChange={handleChange}>
       <Option value="jack">Jack</Option>
       <Option value="lucy">Lucy</Option>
       <Option value="disabled" disabled>Disabled</Option>
@@ -28,7 +28,7 @@ React.render(
       <Option value="disabled" disabled>Disabled</Option>
       <Option value="yiminghe">yiminghe</Option>
     </Select>
-    <Select size={"small"} value="lucy" style={{width:200}} onChange={handleChange}>
+    <Select size="small" value="lucy" style={{width:200}} onChange={handleChange}>
       <Option value="jack">Jack</Option>
       <Option value="lucy">Lucy</Option>
       <Option value="disabled" disabled>Disabled</Option>

components/select/index.jsx

@@ -11,12 +11,11 @@ var AntSelect = React.createClass({
     };
   },
   render() {
-    var sizeClass = 'ant-select-';
-    if(this.props.size === 'large'){
-      sizeClass += 'lg';
-    }
-    if(this.props.size === 'small'){
-      sizeClass += 'sm';
+    var sizeClass = '';
+    if (this.props.size === 'large') {
+      sizeClass = 'ant-select-lg';
+    } else if (this.props.size === 'small') {
+      sizeClass = 'ant-select-sm';
     }
     return (
       <Select className={sizeClass} {...this.props} />

style/components/inputNumber.less

@@ -76,56 +76,56 @@
     }
   }
   
-  &-lg{
-    padding: 0!important;
-    .ant-input-number-handler-wrap{
+  &-lg {
+    padding: 0;
+    .ant-input-number-handler-wrap {
       height: 32px;
     }
-    .ant-input-number-input-wrap{
+    .ant-input-number-input-wrap {
       height: 32px;
     }
-    .ant-input-number-handler{
+    .ant-input-number-handler {
       height: 16px;
     }
 
-    input{
+    input {
       height: 32px;
       line-height: 32px;
       font-size: 14px;
     }
 
-    .ant-input-number-handler-up-inner{
+    .ant-input-number-handler-up-inner {
       top: 2px;
     }
-    .ant-input-number-handler-down-inner{
+    .ant-input-number-handler-down-inner {
       top: 18px;
     }
   }
 
-  &-sm{
-    padding: 0!important;
-    .ant-input-number-handler-wrap{
+  &-sm {
+    padding: 0;
+    .ant-input-number-handler-wrap {
       height: 22px;
     }
-    .ant-input-number-input-wrap{
+    .ant-input-number-input-wrap {
       height: 22px;
       overflow: hidden;
       position: relative;
     }
-    .ant-input-number-handler{
+    .ant-input-number-handler {
       height: 11px;
     }
 
-    input{
+    input {
       height: 22px;
       line-height: 22px;
       position: absolute;
       top: 0;
     }
-    .ant-input-number-handler-up-inner{
+    .ant-input-number-handler-up-inner {
       top: -1px;
     }
-    .ant-input-number-handler-down-inner{
+    .ant-input-number-handler-down-inner {
       top: 10px;
     }
   }
@@ -163,7 +163,7 @@
 
   .handler-disabled() {
     opacity: 0.72;
-    color: #ccc!important;
+    color: #ccc !important;
     cursor: default;
     &:hover {
       color: #ccc;

style/components/select.less

@@ -7,6 +7,7 @@
   float: right;
   font-weight: bold;
 }
+
 .selected_icon() {
   position: relative;
   &:after {
@@ -116,21 +117,21 @@
     }
   }
 
-  &-lg{
-    .ant-select-selection--single{
+  &-lg {
+    .ant-select-selection--single {
       height: 32px;
-      .ant-select-selection__rendered{
+      .ant-select-selection__rendered {
         line-height: 30px;
         font-size: 14px;
       }
     }
 
-    .ant-select-selection--multiple{
+    .ant-select-selection--multiple {
       min-height: 32px;
-      .ant-select-selection__rendered{
-        li{
+      .ant-select-selection__rendered {
+        li {
           height: 24px;
-          .ant-select-selection__choice__content{
+          .ant-select-selection__choice__content {
             font-size: 14px;
             line-height: 24px;
           }
@@ -139,27 +140,27 @@
     }
   }
 
-  &-sm{
-    .ant-select-selection--single{
+  &-sm {
+    .ant-select-selection--single {
       height: 22px;
-      .ant-select-selection__rendered{
+      .ant-select-selection__rendered {
         line-height: 20px;
       }
     }
-    .ant-select-selection--multiple{
+    .ant-select-selection--multiple {
       min-height: 22px;
-      .ant-select-selection__rendered{
-        li{
+      .ant-select-selection__rendered {
+        li {
           height: 14px;
-          .ant-select-selection__choice__content{
+          .ant-select-selection__choice__content {
             line-height: 14px;
             position: relative;
             top: -3px;
           }
-          .ant-select-selection__choice__remove{
-             position: relative;
-             top: -4px;
-           }
+          .ant-select-selection__choice__remove {
+            position: relative;
+            top: -4px;
+          }
         }
       }
     }