add button

@@ -26,7 +26,17 @@ iconfont 新建项目，使用 class 控制图标样式，不要用 unicode<br>
 
 
 
 
 <h2>button</h2>
 <h2>button</h2>
-三种尺寸，圆角直角，实心空心，选中未选中
+三种尺寸，圆角直角，实心空心<br>
+
+<button class="button">空心</button>
+<button class="button button-solid">实心</button>
+<button class="button button-round">圆角</button>
+<button class="button button-round button-solid">圆角，实心</button>
+<hr>
+<button class="button button-large">大</button>
+<button class="button button-small">小</button>
+<hr>
+<button class="button button-large button-round button-solid">大，圆角，实心</button>
 
 
 <h2>badge</h2>
 <h2>badge</h2>
 一个数字的时候是圆形，数字长的时候圆角长方形，类似跑道
 一个数字的时候是圆形，数字长的时候圆角长方形，类似跑道

+.button {
+    display: inline-block;
+    min-width: 100px;
+    height: 40px;
+    border: 1px solid $black;
+    background: $white;
+    color: $black;
+    font-size: 20px;
+
+    &.button-solid {
+        background: $black;
+        color: $white;
+    }
+
+    &.button-round {
+        border-radius: 4px;
+    }
+
+    &.button-small {
+        min-width: 50px;
+    }
+
+    &.button-large {
+        min-width: 300px;
+    }
+
+    &:disabled {
+        border: 1px solid $grey;
+        color: $grey;
+    }
+}

@@ -4,4 +4,5 @@
 @import "icon";
 @import "icon";
 @import "tip";
 @import "tip";
 @import "modal";
 @import "modal";
+@import "button";
 @import "swiper";
 @import "swiper";