Merge pull request #250 in FUI/fineui from ~WINDY/fui:master to master

* commit '8a9bddb1c980f9e8316d08033086c85b6cd71cf1':
  不同状态的button
  去trigger竖线
  update
  开关控件
  floatbox标题栏高度
  深浅主题下的幽灵按钮

demo/js/base/button/demo.button.js

@@ -25,6 +25,13 @@ Demo.Button = BI.inherit(BI.Widget, {
                     level: "warning",
                     height: 30
                 }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "表示错误状态的按钮",
+                    level: "error",
+                    height: 30
+                }
             }, {
                 el: {
                     type: "bi.button",
@@ -182,13 +189,28 @@ Demo.Button = BI.inherit(BI.Widget, {
                     text: "文字按钮",
                     height: 30
                 }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "幽灵按钮（common）",
+                    ghost: true,
+                    height: 30
+                }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "幽灵按钮（common）灰化",
+                    disabled: true,
+                    ghost: true,
+                    height: 30
+                }
             }
         ];
-        BI.each(items, function (i, item) {
+        // BI.each(items, function (i, item) {
-            item.el.handler = function () {
+        //     item.el.handler = function () {
-                BI.Msg.alert("按钮", this.options.text);
+        //         BI.Msg.alert("按钮", this.options.text);
-            };
+        //     };
-        });
+        // });
         return {
             type: "bi.left",
             vgap: 100,

demo/js/widget/basewidget/demo.items.js

@@ -27,6 +27,9 @@ Demo.Items = BI.inherit(BI.Widget, {
             }, {
                 type: "bi.multi_select_item",
                 text: "复选项"
+            }, {
+                type: "bi.switch",
+                selected: true
             }],
             hgap: 300
         };

dist/base.css

@@ -838,11 +838,19 @@ body .bi-button.clear,
   background-color: transparent;
 }
 body .bi-button.clear:hover,
-#body .bi-button.clear:hover,
+#body .bi-button.clear:hover {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
 body .bi-button.clear:active,
 #body .bi-button.clear:active {
-  opacity: 0.75;
+  opacity: 0.8;
-  filter: alpha(opacity=75);
+  filter: alpha(opacity=80);
+}
+body .bi-button.ghost,
+#body .bi-button.ghost {
+  font-size: inherit;
+  background-color: transparent;
 }
 body .bi-button.button-common,
 #body .bi-button.button-common,
@@ -856,16 +864,31 @@ body .bi-button.button-common.clear .b-font:before,
 #body .bi-button.button-common.clear .b-font:before {
   color: #3685f2;
 }
+body .bi-button.button-common.ghost,
+#body .bi-button.button-common.ghost,
+body .bi-button.button-common.ghost .b-font:before,
+#body .bi-button.button-common.ghost .b-font:before {
+  color: #3685f2;
+}
+body .bi-button.button-common.ghost:hover,
+#body .bi-button.button-common.ghost:hover {
+  color: #ffffff;
+  background-color: #3f8ce8;
+}
+body .bi-button.button-common.ghost:active,
+#body .bi-button.button-common.ghost:active {
+  background-color: #3f8ce8;
+}
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore {
   background-color: #ffffff;
-  border-color: #d4dadd;
+  border-color: #178cdf;
 }
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore,
 body .bi-button.button-ignore .b-font:before,
 #body .bi-button.button-ignore .b-font:before {
-  color: #1a1a1a;
+  color: #3685f2;
 }
 body .bi-button.button-ignore.clear,
 #body .bi-button.button-ignore.clear {
@@ -896,8 +919,8 @@ body .bi-button.button-success.clear .b-font:before,
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning {
-  background-color: #ff4949;
+  background-color: #faaa39;
-  border-color: #e85050;
+  border-color: #fbb03b;
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning,
@@ -914,18 +937,44 @@ body .bi-button.button-warning.clear,
 #body .bi-button.button-warning.clear,
 body .bi-button.button-warning.clear .b-font:before,
 #body .bi-button.button-warning.clear .b-font:before {
+  color: #faaa39;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error {
+  background-color: #ff4949;
+  border-color: #e85050;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error,
+body .bi-button.button-error .b-font:before,
+#body .bi-button.button-error .b-font:before {
+  color: #ffffff;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear {
+  background-color: transparent;
+  border-width: 0;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear,
+body .bi-button.button-error.clear .b-font:before,
+#body .bi-button.button-error.clear .b-font:before {
   color: #ff4949;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled {
   background: #cccccc !important;
@@ -935,24 +984,32 @@ body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled,
 body .bi-button.button-common.disabled .b-font:before,
 #body .bi-button.button-common.disabled .b-font:before,
 body .bi-button.button-success.disabled .b-font:before,
 #body .bi-button.button-success.disabled .b-font:before,
+body .bi-button.button-error.disabled .b-font:before,
+#body .bi-button.button-error.disabled .b-font:before,
 body .bi-button.button-warning.disabled .b-font:before,
 #body .bi-button.button-warning.disabled .b-font:before,
 body .bi-button.button-common.disabled.base-disabled .b-font:before,
 #body .bi-button.button-common.disabled.base-disabled .b-font:before,
 body .bi-button.button-success.disabled.base-disabled .b-font:before,
 #body .bi-button.button-success.disabled.base-disabled .b-font:before,
+body .bi-button.button-error.disabled.base-disabled .b-font:before,
+#body .bi-button.button-error.disabled.base-disabled .b-font:before,
 body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #ffffff !important;
@@ -974,6 +1031,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear {
   background: transparent !important;
@@ -985,6 +1044,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear,
 body .bi-button.button-common.disabled.clear .b-font:before,
@@ -993,6 +1054,8 @@ body .bi-button.button-success.disabled.clear .b-font:before,
 #body .bi-button.button-success.disabled.clear .b-font:before,
 body .bi-button.button-warning.disabled.clear .b-font:before,
 #body .bi-button.button-warning.disabled.clear .b-font:before,
+body .bi-button.button-error.disabled.clear .b-font:before,
+#body .bi-button.button-error.disabled.clear .b-font:before,
 body .bi-button.button-ignore.disabled.clear .b-font:before,
 #body .bi-button.button-ignore.disabled.clear .b-font:before {
   color: #9ea6b2 !important;
@@ -1003,6 +1066,8 @@ body .bi-button.button-success.disabled.clear:hover,
 #body .bi-button.button-success.disabled.clear:hover,
 body .bi-button.button-warning.disabled.clear:hover,
 #body .bi-button.button-warning.disabled.clear:hover,
+body .bi-button.button-error.disabled.clear:hover,
+#body .bi-button.button-error.disabled.clear:hover,
 body .bi-button.button-ignore.disabled.clear:hover,
 #body .bi-button.button-ignore.disabled.clear:hover,
 body .bi-button.button-common.disabled.clear:active,
@@ -1011,23 +1076,98 @@ body .bi-button.button-success.disabled.clear:active,
 #body .bi-button.button-success.disabled.clear:active,
 body .bi-button.button-warning.disabled.clear:active,
 #body .bi-button.button-warning.disabled.clear:active,
+body .bi-button.button-error.disabled.clear:active,
+#body .bi-button.button-error.disabled.clear:active,
 body .bi-button.button-ignore.disabled.clear:active,
 #body .bi-button.button-ignore.disabled.clear:active {
   opacity: 1;
   filter: alpha(opacity=100);
 }
-.bi-basic-button.button-common .bi-button-mask,
+body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-success .bi-button-mask,
+#body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-warning .bi-button-mask {
+body .bi-button.button-success.disabled.ghost,
-  opacity: 0.2;
+#body .bi-button.button-success.disabled.ghost,
-  filter: alpha(opacity=20);
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost {
+  background: transparent !important;
+  border-color: #3685f2 !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+body .bi-button.button-common.disabled.ghost,
+#body .bi-button.button-common.disabled.ghost,
+body .bi-button.button-success.disabled.ghost,
+#body .bi-button.button-success.disabled.ghost,
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost,
+body .bi-button.button-common.disabled.ghost .b-font:before,
+#body .bi-button.button-common.disabled.ghost .b-font:before,
+body .bi-button.button-success.disabled.ghost .b-font:before,
+#body .bi-button.button-success.disabled.ghost .b-font:before,
+body .bi-button.button-warning.disabled.ghost .b-font:before,
+#body .bi-button.button-warning.disabled.ghost .b-font:before,
+body .bi-button.button-error.disabled.ghost .b-font:before,
+#body .bi-button.button-error.disabled.ghost .b-font:before,
+body .bi-button.button-ignore.disabled.ghost .b-font:before,
+#body .bi-button.button-ignore.disabled.ghost .b-font:before {
+  color: #3685f2 !important;
+}
+.bi-basic-button.button-common:hover .bi-button-mask,
+.bi-basic-button.button-success:hover .bi-button-mask,
+.bi-basic-button.button-warning:hover .bi-button-mask,
+.bi-basic-button.button-error:hover .bi-button-mask,
+.bi-basic-button.button-ignore:hover .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #ffffff;
 }
-.bi-basic-button .bi-button-mask {
+.bi-basic-button.button-common:active .bi-button-mask,
-  opacity: 0.2;
+.bi-basic-button.button-success:active .bi-button-mask,
-  filter: alpha(opacity=20);
+.bi-basic-button.button-warning:active .bi-button-mask,
+.bi-basic-button.button-error:active .bi-button-mask,
+.bi-basic-button.button-ignore:active .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #1a1a1a;
 }
+.bi-theme-dark body .bi-button.button-common.ghost,
+.bi-theme-dark #body .bi-button.button-common.ghost,
+.bi-theme-dark body .bi-button.button-common.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.ghost .b-font:before {
+  color: #ffffff;
+  border-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:hover,
+.bi-theme-dark #body .bi-button.button-common.ghost:hover {
+  color: #3d4d66;
+  background-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:active,
+.bi-theme-dark #body .bi-button.button-common.ghost:active {
+  background-color: rgba(255, 255, 255, 0.9);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e6ffffff,endColorstr=#e6ffffff);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost {
+  background: transparent !important;
+  border-color: #ffffff !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark body .bi-button.button-common.disabled.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost .b-font:before {
+  color: #ffffff !important;
+}
 
 .bi-single-select-icon-text-item:active .b-font:before,
 .bi-single-select-icon-text-item.active .b-font:before {
@@ -1039,6 +1179,21 @@ body .bi-button.button-ignore.disabled.clear:active,
 .bi-single-select-icon-text-item.active .b-font:before {
   color: #3685f2;
 }
+.bi-switch {
+  -webkit-border-radius: 40px 40px 40px 40px;
+  -moz-border-radius: 40px 40px 40px 40px;
+  border-radius: 40px 40px 40px 40px;
+  background-color: #d4dadd;
+}
+.bi-switch:active,
+.bi-switch.active {
+  background-color: #3f8ce8;
+}
+.bi-switch .circle-button {
+  -webkit-border-radius: 9px 9px 9px 9px;
+  -moz-border-radius: 9px 9px 9px 9px;
+  border-radius: 9px 9px 9px 9px;
+}
 .bi-code-editor .param {
   color: #ffffff;
   padding: 0 5px;

dist/base.js

@@ -15285,7 +15285,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                                 el: {
                                     type: "bi.icon_button",
                                     cls: "bi-message-close close-font",
-                                    height: 50,
+                                    height: 36,
                                     handler: function () {
                                         self.currentSectionProvider.close();
                                     }
@@ -15294,7 +15294,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                             }
                         }
                     },
-                    height: 50
+                    height: 36
                 },
                 center: {
                     el: {
@@ -16600,6 +16600,9 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
             if (o.clear === true) {
                 this.element.addClass("clear");
             }
+            if (o.ghost === true) {
+                this.element.addClass("ghost");
+            }
             if (o.minWidth > 0) {
                 this.element.css({"min-width": o.minWidth + "px"});
             }

dist/bundle.css

@@ -2885,11 +2885,19 @@ body .bi-button.clear,
   background-color: transparent;
 }
 body .bi-button.clear:hover,
-#body .bi-button.clear:hover,
+#body .bi-button.clear:hover {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
 body .bi-button.clear:active,
 #body .bi-button.clear:active {
-  opacity: 0.75;
+  opacity: 0.8;
-  filter: alpha(opacity=75);
+  filter: alpha(opacity=80);
+}
+body .bi-button.ghost,
+#body .bi-button.ghost {
+  font-size: inherit;
+  background-color: transparent;
 }
 body .bi-button.button-common,
 #body .bi-button.button-common,
@@ -2903,16 +2911,31 @@ body .bi-button.button-common.clear .b-font:before,
 #body .bi-button.button-common.clear .b-font:before {
   color: #3685f2;
 }
+body .bi-button.button-common.ghost,
+#body .bi-button.button-common.ghost,
+body .bi-button.button-common.ghost .b-font:before,
+#body .bi-button.button-common.ghost .b-font:before {
+  color: #3685f2;
+}
+body .bi-button.button-common.ghost:hover,
+#body .bi-button.button-common.ghost:hover {
+  color: #ffffff;
+  background-color: #3f8ce8;
+}
+body .bi-button.button-common.ghost:active,
+#body .bi-button.button-common.ghost:active {
+  background-color: #3f8ce8;
+}
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore {
   background-color: #ffffff;
-  border-color: #d4dadd;
+  border-color: #178cdf;
 }
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore,
 body .bi-button.button-ignore .b-font:before,
 #body .bi-button.button-ignore .b-font:before {
-  color: #1a1a1a;
+  color: #3685f2;
 }
 body .bi-button.button-ignore.clear,
 #body .bi-button.button-ignore.clear {
@@ -2943,8 +2966,8 @@ body .bi-button.button-success.clear .b-font:before,
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning {
-  background-color: #ff4949;
+  background-color: #faaa39;
-  border-color: #e85050;
+  border-color: #fbb03b;
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning,
@@ -2961,18 +2984,44 @@ body .bi-button.button-warning.clear,
 #body .bi-button.button-warning.clear,
 body .bi-button.button-warning.clear .b-font:before,
 #body .bi-button.button-warning.clear .b-font:before {
+  color: #faaa39;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error {
+  background-color: #ff4949;
+  border-color: #e85050;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error,
+body .bi-button.button-error .b-font:before,
+#body .bi-button.button-error .b-font:before {
+  color: #ffffff;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear {
+  background-color: transparent;
+  border-width: 0;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear,
+body .bi-button.button-error.clear .b-font:before,
+#body .bi-button.button-error.clear .b-font:before {
   color: #ff4949;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled {
   background: #cccccc !important;
@@ -2982,24 +3031,32 @@ body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled,
 body .bi-button.button-common.disabled .b-font:before,
 #body .bi-button.button-common.disabled .b-font:before,
 body .bi-button.button-success.disabled .b-font:before,
 #body .bi-button.button-success.disabled .b-font:before,
+body .bi-button.button-error.disabled .b-font:before,
+#body .bi-button.button-error.disabled .b-font:before,
 body .bi-button.button-warning.disabled .b-font:before,
 #body .bi-button.button-warning.disabled .b-font:before,
 body .bi-button.button-common.disabled.base-disabled .b-font:before,
 #body .bi-button.button-common.disabled.base-disabled .b-font:before,
 body .bi-button.button-success.disabled.base-disabled .b-font:before,
 #body .bi-button.button-success.disabled.base-disabled .b-font:before,
+body .bi-button.button-error.disabled.base-disabled .b-font:before,
+#body .bi-button.button-error.disabled.base-disabled .b-font:before,
 body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #ffffff !important;
@@ -3021,6 +3078,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear {
   background: transparent !important;
@@ -3032,6 +3091,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear,
 body .bi-button.button-common.disabled.clear .b-font:before,
@@ -3040,6 +3101,8 @@ body .bi-button.button-success.disabled.clear .b-font:before,
 #body .bi-button.button-success.disabled.clear .b-font:before,
 body .bi-button.button-warning.disabled.clear .b-font:before,
 #body .bi-button.button-warning.disabled.clear .b-font:before,
+body .bi-button.button-error.disabled.clear .b-font:before,
+#body .bi-button.button-error.disabled.clear .b-font:before,
 body .bi-button.button-ignore.disabled.clear .b-font:before,
 #body .bi-button.button-ignore.disabled.clear .b-font:before {
   color: #9ea6b2 !important;
@@ -3050,6 +3113,8 @@ body .bi-button.button-success.disabled.clear:hover,
 #body .bi-button.button-success.disabled.clear:hover,
 body .bi-button.button-warning.disabled.clear:hover,
 #body .bi-button.button-warning.disabled.clear:hover,
+body .bi-button.button-error.disabled.clear:hover,
+#body .bi-button.button-error.disabled.clear:hover,
 body .bi-button.button-ignore.disabled.clear:hover,
 #body .bi-button.button-ignore.disabled.clear:hover,
 body .bi-button.button-common.disabled.clear:active,
@@ -3058,23 +3123,98 @@ body .bi-button.button-success.disabled.clear:active,
 #body .bi-button.button-success.disabled.clear:active,
 body .bi-button.button-warning.disabled.clear:active,
 #body .bi-button.button-warning.disabled.clear:active,
+body .bi-button.button-error.disabled.clear:active,
+#body .bi-button.button-error.disabled.clear:active,
 body .bi-button.button-ignore.disabled.clear:active,
 #body .bi-button.button-ignore.disabled.clear:active {
   opacity: 1;
   filter: alpha(opacity=100);
 }
-.bi-basic-button.button-common .bi-button-mask,
+body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-success .bi-button-mask,
+#body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-warning .bi-button-mask {
+body .bi-button.button-success.disabled.ghost,
-  opacity: 0.2;
+#body .bi-button.button-success.disabled.ghost,
-  filter: alpha(opacity=20);
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost {
+  background: transparent !important;
+  border-color: #3685f2 !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+body .bi-button.button-common.disabled.ghost,
+#body .bi-button.button-common.disabled.ghost,
+body .bi-button.button-success.disabled.ghost,
+#body .bi-button.button-success.disabled.ghost,
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost,
+body .bi-button.button-common.disabled.ghost .b-font:before,
+#body .bi-button.button-common.disabled.ghost .b-font:before,
+body .bi-button.button-success.disabled.ghost .b-font:before,
+#body .bi-button.button-success.disabled.ghost .b-font:before,
+body .bi-button.button-warning.disabled.ghost .b-font:before,
+#body .bi-button.button-warning.disabled.ghost .b-font:before,
+body .bi-button.button-error.disabled.ghost .b-font:before,
+#body .bi-button.button-error.disabled.ghost .b-font:before,
+body .bi-button.button-ignore.disabled.ghost .b-font:before,
+#body .bi-button.button-ignore.disabled.ghost .b-font:before {
+  color: #3685f2 !important;
+}
+.bi-basic-button.button-common:hover .bi-button-mask,
+.bi-basic-button.button-success:hover .bi-button-mask,
+.bi-basic-button.button-warning:hover .bi-button-mask,
+.bi-basic-button.button-error:hover .bi-button-mask,
+.bi-basic-button.button-ignore:hover .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #ffffff;
 }
-.bi-basic-button .bi-button-mask {
+.bi-basic-button.button-common:active .bi-button-mask,
-  opacity: 0.2;
+.bi-basic-button.button-success:active .bi-button-mask,
-  filter: alpha(opacity=20);
+.bi-basic-button.button-warning:active .bi-button-mask,
+.bi-basic-button.button-error:active .bi-button-mask,
+.bi-basic-button.button-ignore:active .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #1a1a1a;
 }
+.bi-theme-dark body .bi-button.button-common.ghost,
+.bi-theme-dark #body .bi-button.button-common.ghost,
+.bi-theme-dark body .bi-button.button-common.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.ghost .b-font:before {
+  color: #ffffff;
+  border-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:hover,
+.bi-theme-dark #body .bi-button.button-common.ghost:hover {
+  color: #3d4d66;
+  background-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:active,
+.bi-theme-dark #body .bi-button.button-common.ghost:active {
+  background-color: rgba(255, 255, 255, 0.9);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e6ffffff,endColorstr=#e6ffffff);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost {
+  background: transparent !important;
+  border-color: #ffffff !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark body .bi-button.button-common.disabled.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost .b-font:before {
+  color: #ffffff !important;
+}
 
 .bi-single-select-icon-text-item:active .b-font:before,
 .bi-single-select-icon-text-item.active .b-font:before {
@@ -3086,6 +3226,21 @@ body .bi-button.button-ignore.disabled.clear:active,
 .bi-single-select-icon-text-item.active .b-font:before {
   color: #3685f2;
 }
+.bi-switch {
+  -webkit-border-radius: 40px 40px 40px 40px;
+  -moz-border-radius: 40px 40px 40px 40px;
+  border-radius: 40px 40px 40px 40px;
+  background-color: #d4dadd;
+}
+.bi-switch:active,
+.bi-switch.active {
+  background-color: #3f8ce8;
+}
+.bi-switch .circle-button {
+  -webkit-border-radius: 9px 9px 9px 9px;
+  -moz-border-radius: 9px 9px 9px 9px;
+  border-radius: 9px 9px 9px 9px;
+}
 .bi-code-editor .param {
   color: #ffffff;
   padding: 0 5px;

dist/bundle.js

@@ -41337,7 +41337,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                                 el: {
                                     type: "bi.icon_button",
                                     cls: "bi-message-close close-font",
-                                    height: 50,
+                                    height: 36,
                                     handler: function () {
                                         self.currentSectionProvider.close();
                                     }
@@ -41346,7 +41346,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                             }
                         }
                     },
-                    height: 50
+                    height: 36
                 },
                 center: {
                     el: {
@@ -42652,6 +42652,9 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
             if (o.clear === true) {
                 this.element.addClass("clear");
             }
+            if (o.ghost === true) {
+                this.element.addClass("ghost");
+            }
             if (o.minWidth > 0) {
                 this.element.css({"min-width": o.minWidth + "px"});
             }
@@ -63544,6 +63547,52 @@ BI.PlusGroupNode = BI.inherit(BI.NodeButton, {
 });
 
 BI.shortcut("bi.plus_group_node", BI.PlusGroupNode);/**
+ * Created by Windy on 2018/2/1.
+ */
+BI.Switch = BI.inherit(BI.BasicButton, {
+
+    props: {
+        extraCls: "bi-switch",
+        height: 22,
+        width: 44,
+        logic: {
+            dynamic: false
+        }
+    },
+
+    render: function () {
+        var self = this;
+        return {
+            type: "bi.absolute",
+            ref: function () {
+                self.layout = this;
+            },
+            items: [{
+                el: {
+                    type: "bi.text_button",
+                    cls: "circle-button bi-card"
+                },
+                width: 18,
+                height: 18,
+                top: 2,
+                left: this.options.selected ? 24 : 2
+            }]
+        }
+    },
+
+    setSelected: function (v) {
+        BI.Switch.superclass.setSelected.apply(this, arguments);
+        this.layout.attr("items")[0].left = v ? 24 : 2;
+        this.layout.resize();
+    },
+
+    doClick: function () {
+        BI.Switch.superclass.doClick.apply(this, arguments);
+        this.fireEvent(BI.Switch.EVENT_CHANGE);
+    }
+});
+BI.Switch.EVENT_CHANGE = "EVENT_CHANGE";
+BI.shortcut("bi.switch", BI.Switch);/**
  * guy
  * 复选框item
  * @type {*|void|Object}
@@ -76137,7 +76186,6 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, {
                 }, {
                     el: {
                         type: "bi.trigger_icon_button",
-                        cls: "bi-border-left",
                         width: o.triggerWidth || o.height
                     },
                     width: o.triggerWidth || o.height
@@ -76218,7 +76266,6 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
         });
         this.trigerButton = BI.createWidget({
             type: "bi.trigger_icon_button",
-            cls: "bi-border-left",
             width: o.triggerWidth || o.height
         });
 

dist/case.js

@@ -978,6 +978,52 @@ BI.PlusGroupNode = BI.inherit(BI.NodeButton, {
 });
 
 BI.shortcut("bi.plus_group_node", BI.PlusGroupNode);/**
+ * Created by Windy on 2018/2/1.
+ */
+BI.Switch = BI.inherit(BI.BasicButton, {
+
+    props: {
+        extraCls: "bi-switch",
+        height: 22,
+        width: 44,
+        logic: {
+            dynamic: false
+        }
+    },
+
+    render: function () {
+        var self = this;
+        return {
+            type: "bi.absolute",
+            ref: function () {
+                self.layout = this;
+            },
+            items: [{
+                el: {
+                    type: "bi.text_button",
+                    cls: "circle-button bi-card"
+                },
+                width: 18,
+                height: 18,
+                top: 2,
+                left: this.options.selected ? 24 : 2
+            }]
+        }
+    },
+
+    setSelected: function (v) {
+        BI.Switch.superclass.setSelected.apply(this, arguments);
+        this.layout.attr("items")[0].left = v ? 24 : 2;
+        this.layout.resize();
+    },
+
+    doClick: function () {
+        BI.Switch.superclass.doClick.apply(this, arguments);
+        this.fireEvent(BI.Switch.EVENT_CHANGE);
+    }
+});
+BI.Switch.EVENT_CHANGE = "EVENT_CHANGE";
+BI.shortcut("bi.switch", BI.Switch);/**
  * guy
  * 复选框item
  * @type {*|void|Object}
@@ -13571,7 +13617,6 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, {
                 }, {
                     el: {
                         type: "bi.trigger_icon_button",
-                        cls: "bi-border-left",
                         width: o.triggerWidth || o.height
                     },
                     width: o.triggerWidth || o.height
@@ -13652,7 +13697,6 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
         });
         this.trigerButton = BI.createWidget({
             type: "bi.trigger_icon_button",
-            cls: "bi-border-left",
             width: o.triggerWidth || o.height
         });
 

dist/demo.js

@@ -44,6 +44,13 @@ $(function () {
                     level: "warning",
                     height: 30
                 }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "表示错误状态的按钮",
+                    level: "error",
+                    height: 30
+                }
             }, {
                 el: {
                     type: "bi.button",
@@ -201,13 +208,28 @@ $(function () {
                     text: "文字按钮",
                     height: 30
                 }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "幽灵按钮（common）",
+                    ghost: true,
+                    height: 30
+                }
+            }, {
+                el: {
+                    type: "bi.button",
+                    text: "幽灵按钮（common）灰化",
+                    disabled: true,
+                    ghost: true,
+                    height: 30
+                }
             }
         ];
-        BI.each(items, function (i, item) {
+        // BI.each(items, function (i, item) {
-            item.el.handler = function () {
+        //     item.el.handler = function () {
-                BI.Msg.alert("按钮", this.options.text);
+        //         BI.Msg.alert("按钮", this.options.text);
-            };
+        //     };
-        });
+        // });
         return {
             type: "bi.left",
             vgap: 100,
@@ -11579,6 +11601,9 @@ Demo.Items = BI.inherit(BI.Widget, {
             }, {
                 type: "bi.multi_select_item",
                 text: "复选项"
+            }, {
+                type: "bi.switch",
+                selected: true
             }],
             hgap: 300
         };

dist/fineui.css

@@ -2885,11 +2885,19 @@ body .bi-button.clear,
   background-color: transparent;
 }
 body .bi-button.clear:hover,
-#body .bi-button.clear:hover,
+#body .bi-button.clear:hover {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
 body .bi-button.clear:active,
 #body .bi-button.clear:active {
-  opacity: 0.75;
+  opacity: 0.8;
-  filter: alpha(opacity=75);
+  filter: alpha(opacity=80);
+}
+body .bi-button.ghost,
+#body .bi-button.ghost {
+  font-size: inherit;
+  background-color: transparent;
 }
 body .bi-button.button-common,
 #body .bi-button.button-common,
@@ -2903,16 +2911,31 @@ body .bi-button.button-common.clear .b-font:before,
 #body .bi-button.button-common.clear .b-font:before {
   color: #3685f2;
 }
+body .bi-button.button-common.ghost,
+#body .bi-button.button-common.ghost,
+body .bi-button.button-common.ghost .b-font:before,
+#body .bi-button.button-common.ghost .b-font:before {
+  color: #3685f2;
+}
+body .bi-button.button-common.ghost:hover,
+#body .bi-button.button-common.ghost:hover {
+  color: #ffffff;
+  background-color: #3f8ce8;
+}
+body .bi-button.button-common.ghost:active,
+#body .bi-button.button-common.ghost:active {
+  background-color: #3f8ce8;
+}
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore {
   background-color: #ffffff;
-  border-color: #d4dadd;
+  border-color: #178cdf;
 }
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore,
 body .bi-button.button-ignore .b-font:before,
 #body .bi-button.button-ignore .b-font:before {
-  color: #1a1a1a;
+  color: #3685f2;
 }
 body .bi-button.button-ignore.clear,
 #body .bi-button.button-ignore.clear {
@@ -2943,8 +2966,8 @@ body .bi-button.button-success.clear .b-font:before,
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning {
-  background-color: #ff4949;
+  background-color: #faaa39;
-  border-color: #e85050;
+  border-color: #fbb03b;
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning,
@@ -2961,18 +2984,44 @@ body .bi-button.button-warning.clear,
 #body .bi-button.button-warning.clear,
 body .bi-button.button-warning.clear .b-font:before,
 #body .bi-button.button-warning.clear .b-font:before {
+  color: #faaa39;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error {
+  background-color: #ff4949;
+  border-color: #e85050;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error,
+body .bi-button.button-error .b-font:before,
+#body .bi-button.button-error .b-font:before {
+  color: #ffffff;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear {
+  background-color: transparent;
+  border-width: 0;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear,
+body .bi-button.button-error.clear .b-font:before,
+#body .bi-button.button-error.clear .b-font:before {
   color: #ff4949;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled {
   background: #cccccc !important;
@@ -2982,24 +3031,32 @@ body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled,
 body .bi-button.button-common.disabled .b-font:before,
 #body .bi-button.button-common.disabled .b-font:before,
 body .bi-button.button-success.disabled .b-font:before,
 #body .bi-button.button-success.disabled .b-font:before,
+body .bi-button.button-error.disabled .b-font:before,
+#body .bi-button.button-error.disabled .b-font:before,
 body .bi-button.button-warning.disabled .b-font:before,
 #body .bi-button.button-warning.disabled .b-font:before,
 body .bi-button.button-common.disabled.base-disabled .b-font:before,
 #body .bi-button.button-common.disabled.base-disabled .b-font:before,
 body .bi-button.button-success.disabled.base-disabled .b-font:before,
 #body .bi-button.button-success.disabled.base-disabled .b-font:before,
+body .bi-button.button-error.disabled.base-disabled .b-font:before,
+#body .bi-button.button-error.disabled.base-disabled .b-font:before,
 body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #ffffff !important;
@@ -3021,6 +3078,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear {
   background: transparent !important;
@@ -3032,6 +3091,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear,
 body .bi-button.button-common.disabled.clear .b-font:before,
@@ -3040,6 +3101,8 @@ body .bi-button.button-success.disabled.clear .b-font:before,
 #body .bi-button.button-success.disabled.clear .b-font:before,
 body .bi-button.button-warning.disabled.clear .b-font:before,
 #body .bi-button.button-warning.disabled.clear .b-font:before,
+body .bi-button.button-error.disabled.clear .b-font:before,
+#body .bi-button.button-error.disabled.clear .b-font:before,
 body .bi-button.button-ignore.disabled.clear .b-font:before,
 #body .bi-button.button-ignore.disabled.clear .b-font:before {
   color: #9ea6b2 !important;
@@ -3050,6 +3113,8 @@ body .bi-button.button-success.disabled.clear:hover,
 #body .bi-button.button-success.disabled.clear:hover,
 body .bi-button.button-warning.disabled.clear:hover,
 #body .bi-button.button-warning.disabled.clear:hover,
+body .bi-button.button-error.disabled.clear:hover,
+#body .bi-button.button-error.disabled.clear:hover,
 body .bi-button.button-ignore.disabled.clear:hover,
 #body .bi-button.button-ignore.disabled.clear:hover,
 body .bi-button.button-common.disabled.clear:active,
@@ -3058,23 +3123,98 @@ body .bi-button.button-success.disabled.clear:active,
 #body .bi-button.button-success.disabled.clear:active,
 body .bi-button.button-warning.disabled.clear:active,
 #body .bi-button.button-warning.disabled.clear:active,
+body .bi-button.button-error.disabled.clear:active,
+#body .bi-button.button-error.disabled.clear:active,
 body .bi-button.button-ignore.disabled.clear:active,
 #body .bi-button.button-ignore.disabled.clear:active {
   opacity: 1;
   filter: alpha(opacity=100);
 }
-.bi-basic-button.button-common .bi-button-mask,
+body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-success .bi-button-mask,
+#body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-warning .bi-button-mask {
+body .bi-button.button-success.disabled.ghost,
-  opacity: 0.2;
+#body .bi-button.button-success.disabled.ghost,
-  filter: alpha(opacity=20);
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost {
+  background: transparent !important;
+  border-color: #3685f2 !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+body .bi-button.button-common.disabled.ghost,
+#body .bi-button.button-common.disabled.ghost,
+body .bi-button.button-success.disabled.ghost,
+#body .bi-button.button-success.disabled.ghost,
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost,
+body .bi-button.button-common.disabled.ghost .b-font:before,
+#body .bi-button.button-common.disabled.ghost .b-font:before,
+body .bi-button.button-success.disabled.ghost .b-font:before,
+#body .bi-button.button-success.disabled.ghost .b-font:before,
+body .bi-button.button-warning.disabled.ghost .b-font:before,
+#body .bi-button.button-warning.disabled.ghost .b-font:before,
+body .bi-button.button-error.disabled.ghost .b-font:before,
+#body .bi-button.button-error.disabled.ghost .b-font:before,
+body .bi-button.button-ignore.disabled.ghost .b-font:before,
+#body .bi-button.button-ignore.disabled.ghost .b-font:before {
+  color: #3685f2 !important;
+}
+.bi-basic-button.button-common:hover .bi-button-mask,
+.bi-basic-button.button-success:hover .bi-button-mask,
+.bi-basic-button.button-warning:hover .bi-button-mask,
+.bi-basic-button.button-error:hover .bi-button-mask,
+.bi-basic-button.button-ignore:hover .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #ffffff;
 }
-.bi-basic-button .bi-button-mask {
+.bi-basic-button.button-common:active .bi-button-mask,
-  opacity: 0.2;
+.bi-basic-button.button-success:active .bi-button-mask,
-  filter: alpha(opacity=20);
+.bi-basic-button.button-warning:active .bi-button-mask,
+.bi-basic-button.button-error:active .bi-button-mask,
+.bi-basic-button.button-ignore:active .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #1a1a1a;
 }
+.bi-theme-dark body .bi-button.button-common.ghost,
+.bi-theme-dark #body .bi-button.button-common.ghost,
+.bi-theme-dark body .bi-button.button-common.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.ghost .b-font:before {
+  color: #ffffff;
+  border-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:hover,
+.bi-theme-dark #body .bi-button.button-common.ghost:hover {
+  color: #3d4d66;
+  background-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:active,
+.bi-theme-dark #body .bi-button.button-common.ghost:active {
+  background-color: rgba(255, 255, 255, 0.9);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e6ffffff,endColorstr=#e6ffffff);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost {
+  background: transparent !important;
+  border-color: #ffffff !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark body .bi-button.button-common.disabled.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost .b-font:before {
+  color: #ffffff !important;
+}
 
 .bi-single-select-icon-text-item:active .b-font:before,
 .bi-single-select-icon-text-item.active .b-font:before {
@@ -3086,6 +3226,21 @@ body .bi-button.button-ignore.disabled.clear:active,
 .bi-single-select-icon-text-item.active .b-font:before {
   color: #3685f2;
 }
+.bi-switch {
+  -webkit-border-radius: 40px 40px 40px 40px;
+  -moz-border-radius: 40px 40px 40px 40px;
+  border-radius: 40px 40px 40px 40px;
+  background-color: #d4dadd;
+}
+.bi-switch:active,
+.bi-switch.active {
+  background-color: #3f8ce8;
+}
+.bi-switch .circle-button {
+  -webkit-border-radius: 9px 9px 9px 9px;
+  -moz-border-radius: 9px 9px 9px 9px;
+  border-radius: 9px 9px 9px 9px;
+}
 .bi-code-editor .param {
   color: #ffffff;
   padding: 0 5px;

dist/fineui.js

@@ -43101,7 +43101,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                                 el: {
                                     type: "bi.icon_button",
                                     cls: "bi-message-close close-font",
-                                    height: 50,
+                                    height: 36,
                                     handler: function () {
                                         self.currentSectionProvider.close();
                                     }
@@ -43110,7 +43110,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                             }
                         }
                     },
-                    height: 50
+                    height: 36
                 },
                 center: {
                     el: {
@@ -44416,6 +44416,9 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
             if (o.clear === true) {
                 this.element.addClass("clear");
             }
+            if (o.ghost === true) {
+                this.element.addClass("ghost");
+            }
             if (o.minWidth > 0) {
                 this.element.css({"min-width": o.minWidth + "px"});
             }
@@ -65308,6 +65311,52 @@ BI.PlusGroupNode = BI.inherit(BI.NodeButton, {
 });
 
 BI.shortcut("bi.plus_group_node", BI.PlusGroupNode);/**
+ * Created by Windy on 2018/2/1.
+ */
+BI.Switch = BI.inherit(BI.BasicButton, {
+
+    props: {
+        extraCls: "bi-switch",
+        height: 22,
+        width: 44,
+        logic: {
+            dynamic: false
+        }
+    },
+
+    render: function () {
+        var self = this;
+        return {
+            type: "bi.absolute",
+            ref: function () {
+                self.layout = this;
+            },
+            items: [{
+                el: {
+                    type: "bi.text_button",
+                    cls: "circle-button bi-card"
+                },
+                width: 18,
+                height: 18,
+                top: 2,
+                left: this.options.selected ? 24 : 2
+            }]
+        }
+    },
+
+    setSelected: function (v) {
+        BI.Switch.superclass.setSelected.apply(this, arguments);
+        this.layout.attr("items")[0].left = v ? 24 : 2;
+        this.layout.resize();
+    },
+
+    doClick: function () {
+        BI.Switch.superclass.doClick.apply(this, arguments);
+        this.fireEvent(BI.Switch.EVENT_CHANGE);
+    }
+});
+BI.Switch.EVENT_CHANGE = "EVENT_CHANGE";
+BI.shortcut("bi.switch", BI.Switch);/**
  * guy
  * 复选框item
  * @type {*|void|Object}
@@ -77901,7 +77950,6 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, {
                 }, {
                     el: {
                         type: "bi.trigger_icon_button",
-                        cls: "bi-border-left",
                         width: o.triggerWidth || o.height
                     },
                     width: o.triggerWidth || o.height
@@ -77982,7 +78030,6 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
         });
         this.trigerButton = BI.createWidget({
             type: "bi.trigger_icon_button",
-            cls: "bi-border-left",
             width: o.triggerWidth || o.height
         });
 

src/base/layer/layer.floatbox.js

@@ -65,7 +65,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                                 el: {
                                     type: "bi.icon_button",
                                     cls: "bi-message-close close-font",
-                                    height: 50,
+                                    height: 36,
                                     handler: function () {
                                         self.currentSectionProvider.close();
                                     }
@@ -74,7 +74,7 @@ BI.FloatBox = BI.inherit(BI.Widget, {
                             }
                         }
                     },
-                    height: 50
+                    height: 36
                 },
                 center: {
                     el: {

src/base/single/button/buttons/button.js

@@ -95,6 +95,9 @@
             if (o.clear === true) {
                 this.element.addClass("clear");
             }
+            if (o.ghost === true) {
+                this.element.addClass("ghost");
+            }
             if (o.minWidth > 0) {
                 this.element.css({"min-width": o.minWidth + "px"});
             }

src/case/button/switch.js

@@ -0,0 +1,47 @@
+/**
+ * Created by Windy on 2018/2/1.
+ */
+BI.Switch = BI.inherit(BI.BasicButton, {
+
+    props: {
+        extraCls: "bi-switch",
+        height: 22,
+        width: 44,
+        logic: {
+            dynamic: false
+        }
+    },
+
+    render: function () {
+        var self = this;
+        return {
+            type: "bi.absolute",
+            ref: function () {
+                self.layout = this;
+            },
+            items: [{
+                el: {
+                    type: "bi.text_button",
+                    cls: "circle-button bi-card"
+                },
+                width: 18,
+                height: 18,
+                top: 2,
+                left: this.options.selected ? 24 : 2
+            }]
+        }
+    },
+
+    setSelected: function (v) {
+        BI.Switch.superclass.setSelected.apply(this, arguments);
+        this.layout.attr("items")[0].left = v ? 24 : 2;
+        this.layout.resize();
+    },
+
+    doClick: function () {
+        BI.Switch.superclass.doClick.apply(this, arguments);
+        this.fireEvent(BI.Switch.EVENT_CHANGE);
+    }
+});
+BI.Switch.EVENT_CHANGE = "EVENT_CHANGE";
+BI.shortcut("bi.switch", BI.Switch);

src/case/trigger/trigger.editor.js

@@ -53,7 +53,6 @@ BI.EditorTrigger = BI.inherit(BI.Trigger, {
                 }, {
                     el: {
                         type: "bi.trigger_icon_button",
-                        cls: "bi-border-left",
                         width: o.triggerWidth || o.height
                     },
                     width: o.triggerWidth || o.height

src/case/trigger/trigger.icon.text.js

@@ -30,7 +30,6 @@ BI.IconTextTrigger = BI.inherit(BI.Trigger, {
         });
         this.trigerButton = BI.createWidget({
             type: "bi.trigger_icon_button",
-            cls: "bi-border-left",
             width: o.triggerWidth || o.height
         });
 

src/css/base/pager/pager.css

@@ -1,17 +1,3 @@
-.bi-all-count-pager .all-pager-prev {
-  font-size: 16px;
-}
-.bi-all-count-pager .all-pager-next {
-  font-size: 16px;
-}
-
-.bi-direction-pager .direction-pager-prev {
-  font-size: 16px;
-}
-.bi-direction-pager .direction-pager-next {
-  font-size: 16px;
-}
-
 .bi-pager .page-item {
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;

src/css/base/single/button/button.css

@@ -25,11 +25,19 @@ body .bi-button.clear,
   background-color: transparent;
 }
 body .bi-button.clear:hover,
-#body .bi-button.clear:hover,
+#body .bi-button.clear:hover {
+  opacity: 0.9;
+  filter: alpha(opacity=90);
+}
 body .bi-button.clear:active,
 #body .bi-button.clear:active {
-  opacity: 0.75;
+  opacity: 0.8;
-  filter: alpha(opacity=75);
+  filter: alpha(opacity=80);
+}
+body .bi-button.ghost,
+#body .bi-button.ghost {
+  font-size: inherit;
+  background-color: transparent;
 }
 body .bi-button.button-common,
 #body .bi-button.button-common,
@@ -43,16 +51,31 @@ body .bi-button.button-common.clear .b-font:before,
 #body .bi-button.button-common.clear .b-font:before {
   color: #3685f2;
 }
+body .bi-button.button-common.ghost,
+#body .bi-button.button-common.ghost,
+body .bi-button.button-common.ghost .b-font:before,
+#body .bi-button.button-common.ghost .b-font:before {
+  color: #3685f2;
+}
+body .bi-button.button-common.ghost:hover,
+#body .bi-button.button-common.ghost:hover {
+  color: #ffffff;
+  background-color: #3f8ce8;
+}
+body .bi-button.button-common.ghost:active,
+#body .bi-button.button-common.ghost:active {
+  background-color: #3f8ce8;
+}
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore {
   background-color: #ffffff;
-  border-color: #d4dadd;
+  border-color: #178cdf;
 }
 body .bi-button.button-ignore,
 #body .bi-button.button-ignore,
 body .bi-button.button-ignore .b-font:before,
 #body .bi-button.button-ignore .b-font:before {
-  color: #1a1a1a;
+  color: #3685f2;
 }
 body .bi-button.button-ignore.clear,
 #body .bi-button.button-ignore.clear {
@@ -83,8 +106,8 @@ body .bi-button.button-success.clear .b-font:before,
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning {
-  background-color: #ff4949;
+  background-color: #faaa39;
-  border-color: #e85050;
+  border-color: #fbb03b;
 }
 body .bi-button.button-warning,
 #body .bi-button.button-warning,
@@ -101,18 +124,44 @@ body .bi-button.button-warning.clear,
 #body .bi-button.button-warning.clear,
 body .bi-button.button-warning.clear .b-font:before,
 #body .bi-button.button-warning.clear .b-font:before {
+  color: #faaa39;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error {
+  background-color: #ff4949;
+  border-color: #e85050;
+}
+body .bi-button.button-error,
+#body .bi-button.button-error,
+body .bi-button.button-error .b-font:before,
+#body .bi-button.button-error .b-font:before {
+  color: #ffffff;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear {
+  background-color: transparent;
+  border-width: 0;
+}
+body .bi-button.button-error.clear,
+#body .bi-button.button-error.clear,
+body .bi-button.button-error.clear .b-font:before,
+#body .bi-button.button-error.clear .b-font:before {
   color: #ff4949;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled {
   background: #cccccc !important;
@@ -122,24 +171,32 @@ body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
 body .bi-button.button-success.disabled,
 #body .bi-button.button-success.disabled,
+body .bi-button.button-error.disabled,
+#body .bi-button.button-error.disabled,
 body .bi-button.button-warning.disabled,
 #body .bi-button.button-warning.disabled,
 body .bi-button.button-common.disabled.base-disabled,
 #body .bi-button.button-common.disabled.base-disabled,
 body .bi-button.button-success.disabled.base-disabled,
 #body .bi-button.button-success.disabled.base-disabled,
+body .bi-button.button-error.disabled.base-disabled,
+#body .bi-button.button-error.disabled.base-disabled,
 body .bi-button.button-warning.disabled.base-disabled,
 #body .bi-button.button-warning.disabled.base-disabled,
 body .bi-button.button-common.disabled .b-font:before,
 #body .bi-button.button-common.disabled .b-font:before,
 body .bi-button.button-success.disabled .b-font:before,
 #body .bi-button.button-success.disabled .b-font:before,
+body .bi-button.button-error.disabled .b-font:before,
+#body .bi-button.button-error.disabled .b-font:before,
 body .bi-button.button-warning.disabled .b-font:before,
 #body .bi-button.button-warning.disabled .b-font:before,
 body .bi-button.button-common.disabled.base-disabled .b-font:before,
 #body .bi-button.button-common.disabled.base-disabled .b-font:before,
 body .bi-button.button-success.disabled.base-disabled .b-font:before,
 #body .bi-button.button-success.disabled.base-disabled .b-font:before,
+body .bi-button.button-error.disabled.base-disabled .b-font:before,
+#body .bi-button.button-error.disabled.base-disabled .b-font:before,
 body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #ffffff !important;
@@ -161,6 +218,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear {
   background: transparent !important;
@@ -172,6 +231,8 @@ body .bi-button.button-success.disabled.clear,
 #body .bi-button.button-success.disabled.clear,
 body .bi-button.button-warning.disabled.clear,
 #body .bi-button.button-warning.disabled.clear,
+body .bi-button.button-error.disabled.clear,
+#body .bi-button.button-error.disabled.clear,
 body .bi-button.button-ignore.disabled.clear,
 #body .bi-button.button-ignore.disabled.clear,
 body .bi-button.button-common.disabled.clear .b-font:before,
@@ -180,6 +241,8 @@ body .bi-button.button-success.disabled.clear .b-font:before,
 #body .bi-button.button-success.disabled.clear .b-font:before,
 body .bi-button.button-warning.disabled.clear .b-font:before,
 #body .bi-button.button-warning.disabled.clear .b-font:before,
+body .bi-button.button-error.disabled.clear .b-font:before,
+#body .bi-button.button-error.disabled.clear .b-font:before,
 body .bi-button.button-ignore.disabled.clear .b-font:before,
 #body .bi-button.button-ignore.disabled.clear .b-font:before {
   color: #9ea6b2 !important;
@@ -190,6 +253,8 @@ body .bi-button.button-success.disabled.clear:hover,
 #body .bi-button.button-success.disabled.clear:hover,
 body .bi-button.button-warning.disabled.clear:hover,
 #body .bi-button.button-warning.disabled.clear:hover,
+body .bi-button.button-error.disabled.clear:hover,
+#body .bi-button.button-error.disabled.clear:hover,
 body .bi-button.button-ignore.disabled.clear:hover,
 #body .bi-button.button-ignore.disabled.clear:hover,
 body .bi-button.button-common.disabled.clear:active,
@@ -198,20 +263,95 @@ body .bi-button.button-success.disabled.clear:active,
 #body .bi-button.button-success.disabled.clear:active,
 body .bi-button.button-warning.disabled.clear:active,
 #body .bi-button.button-warning.disabled.clear:active,
+body .bi-button.button-error.disabled.clear:active,
+#body .bi-button.button-error.disabled.clear:active,
 body .bi-button.button-ignore.disabled.clear:active,
 #body .bi-button.button-ignore.disabled.clear:active {
   opacity: 1;
   filter: alpha(opacity=100);
 }
-.bi-basic-button.button-common .bi-button-mask,
+body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-success .bi-button-mask,
+#body .bi-button.button-common.disabled.ghost,
-.bi-basic-button.button-warning .bi-button-mask {
+body .bi-button.button-success.disabled.ghost,
-  opacity: 0.2;
+#body .bi-button.button-success.disabled.ghost,
-  filter: alpha(opacity=20);
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost {
+  background: transparent !important;
+  border-color: #3685f2 !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+body .bi-button.button-common.disabled.ghost,
+#body .bi-button.button-common.disabled.ghost,
+body .bi-button.button-success.disabled.ghost,
+#body .bi-button.button-success.disabled.ghost,
+body .bi-button.button-warning.disabled.ghost,
+#body .bi-button.button-warning.disabled.ghost,
+body .bi-button.button-error.disabled.ghost,
+#body .bi-button.button-error.disabled.ghost,
+body .bi-button.button-ignore.disabled.ghost,
+#body .bi-button.button-ignore.disabled.ghost,
+body .bi-button.button-common.disabled.ghost .b-font:before,
+#body .bi-button.button-common.disabled.ghost .b-font:before,
+body .bi-button.button-success.disabled.ghost .b-font:before,
+#body .bi-button.button-success.disabled.ghost .b-font:before,
+body .bi-button.button-warning.disabled.ghost .b-font:before,
+#body .bi-button.button-warning.disabled.ghost .b-font:before,
+body .bi-button.button-error.disabled.ghost .b-font:before,
+#body .bi-button.button-error.disabled.ghost .b-font:before,
+body .bi-button.button-ignore.disabled.ghost .b-font:before,
+#body .bi-button.button-ignore.disabled.ghost .b-font:before {
+  color: #3685f2 !important;
+}
+.bi-basic-button.button-common:hover .bi-button-mask,
+.bi-basic-button.button-success:hover .bi-button-mask,
+.bi-basic-button.button-warning:hover .bi-button-mask,
+.bi-basic-button.button-error:hover .bi-button-mask,
+.bi-basic-button.button-ignore:hover .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #ffffff;
 }
-.bi-basic-button .bi-button-mask {
+.bi-basic-button.button-common:active .bi-button-mask,
-  opacity: 0.2;
+.bi-basic-button.button-success:active .bi-button-mask,
-  filter: alpha(opacity=20);
+.bi-basic-button.button-warning:active .bi-button-mask,
+.bi-basic-button.button-error:active .bi-button-mask,
+.bi-basic-button.button-ignore:active .bi-button-mask {
+  opacity: 0.1;
+  filter: alpha(opacity=10);
   background-color: #1a1a1a;
 }
+.bi-theme-dark body .bi-button.button-common.ghost,
+.bi-theme-dark #body .bi-button.button-common.ghost,
+.bi-theme-dark body .bi-button.button-common.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.ghost .b-font:before {
+  color: #ffffff;
+  border-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:hover,
+.bi-theme-dark #body .bi-button.button-common.ghost:hover {
+  color: #3d4d66;
+  background-color: #ffffff;
+}
+.bi-theme-dark body .bi-button.button-common.ghost:active,
+.bi-theme-dark #body .bi-button.button-common.ghost:active {
+  background-color: rgba(255, 255, 255, 0.9);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#e6ffffff,endColorstr=#e6ffffff);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost {
+  background: transparent !important;
+  border-color: #ffffff !important;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+}
+.bi-theme-dark body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost,
+.bi-theme-dark body .bi-button.button-common.disabled.ghost .b-font:before,
+.bi-theme-dark #body .bi-button.button-common.disabled.ghost .b-font:before {
+  color: #ffffff !important;
+}

src/css/base/single/button/switch.css

@@ -0,0 +1,15 @@
+.bi-switch {
+  -webkit-border-radius: 40px 40px 40px 40px;
+  -moz-border-radius: 40px 40px 40px 40px;
+  border-radius: 40px 40px 40px 40px;
+  background-color: #d4dadd;
+}
+.bi-switch:active,
+.bi-switch.active {
+  background-color: #3f8ce8;
+}
+.bi-switch .circle-button {
+  -webkit-border-radius: 9px 9px 9px 9px;
+  -moz-border-radius: 9px 9px 9px 9px;
+  border-radius: 9px 9px 9px 9px;
+}

src/css/base/single/tip/tip.css

@@ -1,70 +1,3 @@
-.bi-bubble {
-  font-size: 14px;
-}
-.bi-bubble .bubble-text {
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-}
-.bi-bubble .bubble-error {
-  background: #ffecec;
-  color: #ff4949;
-}
-.bi-bubble .bubble-common {
-  background: #eaf2fd;
-  color: #3685f2;
-}
-.bi-bubble .bubble-success {
-  background: #e1f4e7;
-  color: #5cb75d;
-}
-.bi-bubble .bubble-warning {
-  background: #feeed7;
-  color: #faaa39;
-}
-
 .bi-tip {
   position: fixed !important;
 }
-
-.bi-toast {
-  font-size: 14px;
-  color: #ffffff;
-  max-width: 400px;
-  min-width: 150px;
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-}
-.bi-toast.toast-success {
-  background: #58cc7d;
-}
-.bi-toast.toast-warning {
-  background: #faaa39;
-}
-.bi-toast.toast-error {
-  background: #ff4949;
-}
-.bi-toast.toast-normal {
-  background: #3f8ce8;
-}
-.bi-toast .toast-icon {
-  font-size: 16px;
-}
-
-.bi-tooltip {
-  max-width: 250px;
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-  font-size: 12px;
-  color: #ffffff;
-}
-.bi-tooltip.tooltip-success {
-  background: #647185;
-  border: 1px solid #647185;
-}
-.bi-tooltip.tooltip-warning {
-  background: #ff4949;
-  border: 1px solid #e85050;
-}

src/css/base/table/table.css

@@ -1,169 +1,3 @@
-.bi-collection-table-cell {
-  -webkit-box-sizing: border-box;
-  /*Safari3.2+*/
-  -moz-box-sizing: border-box;
-  /*Firefox3.5+*/
-  -ms-box-sizing: border-box;
-  /*IE8*/
-  box-sizing: border-box;
-  /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
-}
-.bi-collection-table-cell.first-row {
-  border-top: 1px solid #d4dadd;
-}
-.bi-collection-table-cell.first-col {
-  border-left: 1px solid #d4dadd;
-}
-.bi-theme-dark .bi-collection-table-cell.first-row {
-  border-top: 1px solid #525466;
-}
-.bi-theme-dark .bi-collection-table-cell.first-col {
-  border-left: 1px solid #525466;
-}
-
-.bi-quick-collection-table > div > .bi-collection {
-  overflow: hidden !important;
-  overflow-x: hidden !important;
-  overflow-y: hidden !important;
-}
-
-.bi-grid-table-cell {
-  -webkit-box-sizing: border-box;
-  /*Safari3.2+*/
-  -moz-box-sizing: border-box;
-  /*Firefox3.5+*/
-  -ms-box-sizing: border-box;
-  /*IE8*/
-  box-sizing: border-box;
-  /*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/
-}
-.bi-grid-table-cell.first-row {
-  border-top: 1px solid #d4dadd;
-}
-.bi-grid-table-cell.first-col {
-  border-left: 1px solid #d4dadd;
-}
-.bi-theme-dark .bi-grid-table-cell.first-row {
-  border-top: 1px solid #525466;
-}
-.bi-theme-dark .bi-grid-table-cell.first-col {
-  border-left: 1px solid #525466;
-}
-
-.scrollbar-layout-main {
-  box-sizing: border-box;
-  outline: none;
-  overflow: hidden;
-  position: absolute;
-  transition-duration: 250ms;
-  transition-timing-function: ease;
-  user-select: none;
-  background-color: rgba(102, 102, 102, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0d666666,endColorstr=#0d666666);
-  border-radius: 5px;
-}
-.bi-theme-dark .scrollbar-layout-main {
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
-}
-.scrollbar-layout-main-vertical {
-  bottom: 0;
-  right: 0;
-  top: 0;
-  transition-property: background-color;
-  width: 10px;
-}
-.scrollbar-layout-main-vertical.public-scrollbar-main-active,
-.scrollbar-layout-main-vertical:hover {
-  width: 10px;
-}
-.scrollbar-layout-main-horizontal {
-  bottom: 0;
-  height: 10px;
-  left: 0;
-  transition-property: background-color;
-  background-color: rgba(102, 102, 102, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0d666666,endColorstr=#0d666666);
-}
-.bi-theme-dark .scrollbar-layout-main-horizontal {
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
-}
-/* Touching the scroll-track directly makes the scroll-track bolder */
-.scrollbar-layout-main-horizontal.public-scrollbar-main-active,
-.scrollbar-layout-main-horizontal:hover {
-  height: 10px;
-}
-.scrollbar-layout-face {
-  left: 0;
-  overflow: hidden;
-  position: absolute;
-  z-index: 1;
-}
-/**
- * This selector renders the "nub" of the scrollface. The nub must
- * be rendered as pseudo-element so that it won't receive any UI events then
- * we can get the correct `event.offsetX` and `event.offsetY` from the
- * scrollface element while dragging it.
- */
-.scrollbar-layout-face:after {
-  border-radius: 6px;
-  content: '';
-  display: block;
-  position: absolute;
-  transition: background-color 250ms ease;
-}
-.scrollbar-layout-face-horizontal {
-  bottom: 0;
-  left: 0;
-  top: 0;
-}
-.scrollbar-layout-face-horizontal:after {
-  bottom: 2px;
-  left: 0;
-  top: 2px;
-  width: 100%;
-}
-.scrollbar-layout-face-vertical {
-  left: 0;
-  right: 0;
-  top: 0;
-}
-.scrollbar-layout-face-vertical:after {
-  height: 100%;
-  left: 2px;
-  right: 2px;
-  top: 0;
-}
-/**
- * scrollbars.
- */
-/* Touching the scroll-track directly makes the scroll-track bolder */
-.public-scrollbar-face:after {
-  background-color: rgba(102, 102, 102, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4d666666,endColorstr=#4d666666);
-}
-.bi-theme-dark .public-scrollbar-face:after {
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
-}
-.public-scrollbar-main:hover .public-scrollbar-face:after,
-.public-scrollbar-main-active .public-scrollbar-face:after,
-.public-scrollbar-face-active:after {
-  background-color: rgba(102, 102, 102, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3666666,endColorstr=#b3666666);
-}
-.bi-theme-dark .public-scrollbar-main:hover .public-scrollbar-face:after,
-.bi-theme-dark .public-scrollbar-main-active .public-scrollbar-face:after,
-.bi-theme-dark .public-scrollbar-face-active:after {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
-}
-.horizontal-scrollbar {
-  bottom: 0;
-  position: absolute;
-}
-
 .bi-table > .first-col {
   border-left: none;
 }
@@ -242,33 +76,3 @@
   border-top: 1px solid #525466;
   border-left: 1px solid #525466;
 }
-
-.bi-resizable-table-cell .resizable-table-cell-resizer-container {
-  cursor: ew-resize;
-  z-index: 1;
-}
-.bi-resizable-table-cell .resizable-table-cell-resizer-container:hover .resizable-table-cell-resizer-knob,
-.bi-resizable-table-cell .resizable-table-cell-resizer-container.dragging .resizable-table-cell-resizer-knob {
-  background-color: #3f8ce8;
-}
-.bi-resizable-table-cell .resizable-table-cell-resizer-container.suitable .resizable-table-cell-resizer-knob {
-  background-color: #58cc7d;
-}
-
-.bi-resizable-table .resizable-table-resizer {
-  cursor: ew-resize;
-  z-index: 1;
-  background-color: #3f8ce8;
-}
-.bi-resizable-table .resizable-table-resizer.suitable {
-  background-color: #58cc7d;
-}
-.bi-resizable-table .resizable-table-region-resizer {
-  cursor: ew-resize;
-  z-index: 1;
-}
-.bi-resizable-table .resizable-table-region-resizer:hover .resizable-table-region-resizer-knob,
-.bi-resizable-table .resizable-table-region-resizer.dragging .resizable-table-region-resizer-knob {
-  background-color: #3f8ce8;
-}
-

src/css/base/trigger/trigger.css

@@ -1,17 +1,3 @@
-
-
 .bi-trigger .bi-trigger-icon-button {
   font-size: 16px;
 }
-
-.bi-select-text-trigger {
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-}
-
-.bi-small-select-text-trigger {
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-}

src/css/core/utils/common.css

@@ -57,7 +57,7 @@ textarea {
   color: #3d4d66;
 }
 .bi-theme-dark .bi-background {
-  background-color: #191B2B;
+  background-color: #191b2b;
   color: #cccccc;
 }
 .bi-theme-dark .bi-background .bi-input {

src/css/resource/font.css

@@ -1,6 +1,7 @@
 @font-face {
   font-family: 'bi';
   src: url('font/iconfont.eot'), /* IE6-IE8 */ url('font/iconfont.woff') format('woff'), /* chrome、firefox */ url('font/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('font/iconfont.svg#svgFontName') format('svg');
+  
   /*  iOS 4.1- */
 }
 .b-font {

src/css/theme/dark.css

@@ -1,5 +1,5 @@
 .bi-theme-dark {
-  background-color: #191B2B;
+  background-color: #191b2b;
   color: #cccccc;
 }
 .bi-theme-dark .bi-input {

src/css/widget/exceltable/exceltable.css

@@ -1,8 +1,3 @@
-
-.bi-excel-table-header-cell {
-  font-weight: bold;
-}
-
 .bi-excel-table > div.bottom-right > div > div > table {
   border-right: 1px solid #d4dadd;
 }

src/css/widget/previewtable/previewtable.css

@@ -1,14 +1,3 @@
-.bi-preview-table-cell {
-  min-height: 25px;
-  min-width: 80px;
-}
-
-.bi-preview-table-header-cell {
-  font-weight: bold;
-  min-height: 25px;
-  min-width: 80px;
-}
-
 .bi-preview-table {
   -webkit-user-select: text;
   -khtml-user-select: text;
@@ -23,5 +12,5 @@
 }
 .bi-theme-dark .bi-preview-table > div > table > thead > tr.odd,
 .bi-theme-dark .bi-preview-table > div > div > div > table > thead > tr.odd {
-  background-color: #191B2B;
+  background-color: #191b2b;
 }

src/less/base/single/button/button.less

@@ -17,10 +17,17 @@ body .bi-button, #body .bi-button {
     font-size: inherit;
     border-width: 0;
     background-color: transparent;
-    &:hover, &:active {
+    &:hover {
-      .opacity(0.75);
+      .opacity(0.9);
+    }
+    &:active {
+      .opacity(0.8);
     }
   }
+  &.ghost {
+    font-size: inherit;
+    background-color: transparent;
+  }
   &.button-common {
     &, & .b-font:before {
       color: @color-bi-text;
@@ -28,14 +35,26 @@ body .bi-button, #body .bi-button {
     &.clear, &.clear .b-font:before {
       color: @color-bi-text-highlight;
     }
+    &.ghost{
+      &, & .b-font:before{
+        color: @color-bi-text-highlight;
+      }
+      &:hover{
+        color: @color-bi-text;
+        background-color: @color-bi-background-highlight;
+      }
+      &:active{
+        background-color: @color-bi-background-highlight;
+      }
+    }
   }
   &.button-ignore {
     & {
       &, & .b-font:before {
-        color: @color-bi-text-black;
+        color: @color-bi-text-highlight;
       }
       background-color: @color-bi-background-default;
-      border-color: @color-bi-border-line;
+      border-color: @color-bi-border-highlight;
     }
     &.clear {
       background-color: transparent;
@@ -59,6 +78,22 @@ body .bi-button, #body .bi-button {
     }
   }
   &.button-warning {
+    & {
+      &, & .b-font:before {
+        color: @color-bi-text;
+      }
+      background-color: @color-bi-background-warning;
+      border-color: @color-bi-border-warning;
+    }
+    &.clear {
+      &, & .b-font:before {
+        color: @color-bi-text-redmark;
+      }
+      background-color: transparent;
+      border-width: 0;
+    }
+  }
+  &.button-error {
     & {
       &, & .b-font:before {
         color: @color-bi-text;
@@ -76,6 +111,7 @@ body .bi-button, #body .bi-button {
   }
   &.button-common.disabled,
   &.button-success.disabled,
+  &.button-error.disabled,
   &.button-warning.disabled {
     &, &.base-disabled {
       &, & .b-font:before {
@@ -95,6 +131,7 @@ body .bi-button, #body .bi-button {
   &.button-common.disabled,
   &.button-success.disabled,
   &.button-warning.disabled,
+  &.button-error.disabled,
   &.button-ignore.disabled {
     &.clear {
       &, & .b-font:before {
@@ -106,18 +143,60 @@ body .bi-button, #body .bi-button {
         .opacity(1);
       }
     }
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-highlight !important;
+      }
+      background: transparent !important;
+      border-color: @color-bi-text-highlight !important;
+      .opacity(0.5);
+    }
   }
 }
 
 .bi-basic-button {
-  &.button-common, &.button-success, &.button-warning {
+  &.button-common, &.button-success, &.button-warning, &.button-error, &.button-ignore {
+    &:hover{
       & .bi-button-mask {
-      .opacity(0.2);
+        .opacity(0.1);
         background-color: @color-bi-background-default;
       }
     }
+    &:active{
       & .bi-button-mask {
-    .opacity(0.2);
+        .opacity(0.1);
         background-color: @color-bi-button-mask;
       }
     }
+  }
+}
+
+.bi-theme-dark {
+  body .bi-button, #body .bi-button {
+    &.button-common {
+      &.ghost{
+        &, & .b-font:before{
+          color: @color-bi-text;
+          border-color: @color-bi-border-default;
+        }
+        &:hover{
+          color: @color-bi-text-normal;
+          background-color: @color-bi-background-default;
+        }
+        &:active{
+          .background-color(@color-bi-background-default, 90%);
+        }
+      }
+    }
+    &.button-common.disabled{
+      &.ghost {
+        &, & .b-font:before {
+          color: @color-bi-text !important;
+        }
+        background: transparent !important;
+        border-color: @color-bi-border-default !important;
+        .opacity(0.5);
+      }
+    }
+  }
+}

src/less/base/single/button/switch.less

@@ -0,0 +1,12 @@
+@import "../../../index";
+
+.bi-switch{
+  .border-radius(40px 40px 40px 40px);
+  background-color: @background-color-dark;
+  &:active, &.active {
+    background-color: @color-bi-background-highlight;
+  }
+  & .circle-button{
+    .border-radius(9px 9px 9px 9px);
+  }
+}