add InputNumber UI

add InputNumber UI

styles/mixins/checkbox.less

@@ -28,7 +28,7 @@
             border-radius: 3px;
             background-color: #fff;
             .transition2(border-color @transition-time @ease-in-out,background-color @transition-time @ease-in-out);
-
+            
             &:after {
                 content: '';
                 display: table;

styles/mixins/common.less

@@ -0,0 +1,15 @@
+.placeholder(@color: @input-placeholder-color) {
+    // Firefox
+    &::-moz-placeholder {
+        color: @color;
+        opacity: 1; // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526
+    }
+    // Internet Explorer 10+
+    &:-ms-input-placeholder {
+        color: @color;
+    }
+    // Safari and Chrome
+    &::-webkit-input-placeholder {
+        color: @color;
+    }
+}

styles/mixins/index.less

@@ -1,3 +1,4 @@
+@import "common";
 @import "clearfix";
 @import "box-shadow";
 @import "transition";
@@ -8,4 +9,5 @@
 @import "size";
 @import "loading";
 @import "close";
-@import "checkbox";
+@import "checkbox";
+@import "input";

styles/mixins/input.less

@@ -0,0 +1,77 @@
+.hover(@color: @input-hover-border-color) {
+    border-color: tint(@color, 20%);
+}
+
+.active(@color: @input-hover-border-color) {
+    border-color: tint(@color, 20%);
+    outline: 0;
+    box-shadow: 0 0 0 2px fade(@color, 20%);
+}
+
+.disabled() {
+    background-color: @input-disabled-bg;
+    opacity: 1;
+    cursor: @cursor-disabled;
+    color: #ccc;
+    &:hover {
+        .hover(@input-border-color);
+    }
+}
+
+.input-large() {
+    padding: @input-padding-vertical-large @input-padding-horizontal;
+    height: @input-height-large;
+}
+
+.input-small() {
+    padding: @input-padding-vertical-small @input-padding-horizontal;
+    height: @input-height-small;
+    border-radius: @border-radius-small;
+}
+
+.input() {
+    display: inline-block;
+    width: 100%;
+    height: @input-height-base;
+    line-height: @line-height-base;
+    padding: @input-padding-vertical-base @input-padding-horizontal;
+    font-size: @font-size-base;
+    border: 1px solid @input-border-color;
+    border-radius: @border-radius-base;
+    color: @input-color;
+    background-color: @input-bg;
+    background-image: none;
+    position: relative;
+    cursor: text;
+    .placeholder();
+    .transition3(border @transition-time @ease-in-out, background @transition-time @ease-in-out, box-shadow @transition-time @ease-in-out);
+
+    &:hover {
+        .hover();
+    }
+
+    &:focus {
+        .active();
+    }
+
+    &[disabled],
+    fieldset[disabled] & {
+        .disabled();
+    }
+
+    // Reset height for textarea
+    textarea& {
+        max-width: 100%;
+        height: auto;
+        vertical-align: bottom;
+    }
+
+    // Size
+    &-large {
+        .input-large();
+    }
+
+    &-small {
+        .input-small();
+    }
+}

styles/mixins/size.less

@@ -6,3 +6,15 @@
 .square(@size) {
     .size(@size; @size);
 }
+
+// fix chrome 12px bug, support ie
+.iconfont-size-under-12px(@size, @rotate: 0deg) {
+    display: inline-block;
+    @font-scale: unit(@size / @font-size-base);
+    font-size: @font-size-base;
+    font-size: ~"@{size} \9"; // ie8-9
+    .transform(scale(@font-scale) rotate(@rotate));
+    :root & {
+        font-size: @font-size-base; // reset ie9 and above
+    }
+}

styles/mixins/transition.less

@@ -7,4 +7,9 @@
     -webkit-transition: @string1 , @string2;
     -moz-transition:    @string1 , @string2;
     transition:         @string1 , @string2;
+}
+.transition3 (@string1, @string2, @string3) {
+    -webkit-transition: @string1 , @string2 , @string3;
+    -moz-transition:    @string1 , @string2 , @string3;
+    transition:         @string1 , @string2 , @string3;
 }