Merge branch 'master' into bugfix/BI-23990

# Conflicts: # dist/bundle.min.css # dist/fineui.min.css
7 years ago · 4b84b3c315
41 changed files with 531 additions and 284 deletions
--- a/dist/_fineui.min.js
+++ b/dist/_fineui.min.js
--- a/dist/base.css
+++ b/dist/base.css
@ -8,9 +8,9 @@
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
-  box-shadow: 0px 0px 2px 1px #d4dadd inset;
-  -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset;
-  -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset;
+  box-shadow: 0px 0px 2px 1px #d0d4da inset;
+  -webkit-box-shadow: 0px 0px 2px 1px #d0d4da inset;
+  -moz-box-shadow: 0px 0px 2px 1px #d0d4da inset;
 }
 .bi-color-picker-button .color-picker-button-mask {
  border: 1px solid #232e40;
@ -785,17 +785,20 @@ li.CodeMirror-hint-active {
 .bi-rich-editor-text-toolbar .text-toolbar-button {
  font-size: 16px;
 }
+.bi-segment-button {
+  color: #3685f2;
+}
 .bi-segment > .center-element {
  overflow: hidden;
  overflow-x: hidden;
  overflow-y: hidden;
  background: #ffffff;
-  border-right: 1px solid #e8eaed;
-  border-top: 1px solid #e8eaed;
-  border-bottom: 1px solid #e8eaed;
+  border-right: 1px solid #3685f2;
+  border-top: 1px solid #3685f2;
+  border-bottom: 1px solid #3685f2;
 }
 .bi-segment > .first-element {
-  border-left: 1px solid #e8eaed;
+  border-left: 1px solid #3685f2;
  -webkit-border-radius: 6px 0px 0px 6px;
  -moz-border-radius: 6px 0px 0px 6px;
  border-radius: 6px 0px 0px 6px;
@ -805,6 +808,10 @@ li.CodeMirror-hint-active {
  -moz-border-radius: 0px 6px 6px 0px;
  border-radius: 0px 6px 6px 0px;
 }
+.bi-segment.disabled > .center-element,
+.bi-segment.disabled > .first-element {
+  border-color: #F0F3F7;
+}
 .bi-theme-dark .bi-segment > .center-element {
  overflow: hidden;
  overflow-x: hidden;
@ -982,8 +989,8 @@ 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;
-  border-color: #cccccc !important;
+  background: #F0F3F7 !important;
+  border-color: #F0F3F7 !important;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
@ -1017,7 +1024,7 @@ 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;
+  color: #9ea6b2 !important;
 }
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
@ -1442,8 +1449,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 .scrollbar-layout-main-vertical {
  bottom: 0;
@ -1465,8 +1472,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 /* Touching the scroll-track directly makes the scroll-track bolder */
 .scrollbar-layout-main-horizontal.public-scrollbar-main-active,
@ -1523,8 +1530,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .public-scrollbar-main:hover .public-scrollbar-face:after,
 .public-scrollbar-main-active .public-scrollbar-face:after,
@ -1535,8 +1542,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 .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);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .horizontal-scrollbar {
  bottom: 0;
--- a/dist/bundle.css
+++ b/dist/bundle.css
@ -336,13 +336,13 @@ textarea {
 }
 .bi-theme-dark .bi-background {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-card {
  background-color: #ffffff;
@ -356,13 +356,13 @@ textarea {
 }
 .bi-theme-dark .bi-card {
  background-color: #242640;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-disabled {
  color: #9ea6b2;
@ -1105,7 +1105,24 @@ textarea {
 .bi-list-item-select.disabled.bi-high-light-border,
 .bi-list-item-select.disabled:hover.bi-high-light-border,
 .bi-list-item-select.disabled:active.bi-high-light-border {
-  border-color: #cccccc;
+  border-color: #F0F3F7;
+}
+.bi-list-item-select2:hover,
+.bi-list-item-select2.hover {
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active,
+.bi-list-item-select2.active {
+  color: #3685f2;
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active .bi-input,
+.bi-list-item-select2.active .bi-input {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-textarea,
+.bi-list-item-select2.active .bi-textarea {
+  color: #3685f2;
 }
 .bi-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
@ -1749,7 +1766,7 @@ textarea {
 }
 .bi-theme-dark {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-input {
  color: #ffffff;
@ -2738,8 +2755,8 @@ 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;
-  border-color: #cccccc !important;
+  background: #F0F3F7 !important;
+  border-color: #F0F3F7 !important;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
@ -2773,7 +2790,7 @@ 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;
+  color: #9ea6b2 !important;
 }
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
@ -3198,8 +3215,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 .scrollbar-layout-main-vertical {
  bottom: 0;
@ -3221,8 +3238,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 /* Touching the scroll-track directly makes the scroll-track bolder */
 .scrollbar-layout-main-horizontal.public-scrollbar-main-active,
@ -3279,8 +3296,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .public-scrollbar-main:hover .public-scrollbar-face:after,
 .public-scrollbar-main-active .public-scrollbar-face:after,
@ -3291,8 +3308,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 .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);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .horizontal-scrollbar {
  bottom: 0;
@ -4133,6 +4150,7 @@ ul.ztree.zTreeDragUL {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
+  background-color: #f7f8fa;
  width: 20px;
  height: 20px;
  top: 4px;
@ -4251,8 +4269,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -4261,13 +4279,13 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .farbtastic .wheel {
  background: url('https://fanruan.coding.me/fineui/dist/images/1x/background/wheel.png') no-repeat center center;
--- a/dist/bundle.js
+++ b/dist/bundle.js
@ -83018,8 +83018,8 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
        var attrs = BI.DOM.getImage(o.paramFormatter(param));
        image.src = attrs.src;
        image.alt = param;
-        image.style = attrs.style;
        $(image).addClass("rich-editor-param");
+        $(image).attr("style", attrs.style);
        this.options.editor.insertHTML($("<div>").append(image).html());
        // var sel = this._get$Sel();
        // var wrapper = o.editor.instance.getElm().element;
@ -83159,7 +83159,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
                {type: "bi.rich_editor_align_right_button"},
                {type: "bi.rich_editor_param_button"}
            ],
-            height: 28
+            height: 34
        });
    },

@ -83181,7 +83181,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
            element: this,
            items: buttons,
            hgap: 3,
-            vgap: 3
+            vgap: 6
        });
    },

@ -83526,7 +83526,11 @@ BI.shortcut("bi.rich_editor_text_toolbar", BI.RichEditorTextToolbar);/**

            try {
                // w3c
-                this.nicCommand("insertHTML", html);
+                if (document.queryCommandState("insertHTML")) {
+                    this.nicCommand("insertHTML", html);
+                } else {
+                    throw new Error("Does not support this command");
+                }
            } catch(e) {
                if (range.insertNode) {
                    // IE
@ -84181,6 +84185,14 @@ BI.RichEditor = BI.inherit(BI.Widget, {
        readOnly: false
    },

+    _defaultConfig: function () {
+        return BI.extend(BI.RichEditor.superclass._defaultConfig.apply(this, arguments), {
+            adjustLength: 1,
+            adjustXOffset: 0,
+            adjustYOffset: 0
+        });
+    },
+
    render: function () {
        var self = this, o = this.options;
        var editor = {
@ -84217,7 +84229,9 @@ BI.RichEditor = BI.inherit(BI.Widget, {
            direction: "top,right",
            isNeedAdjustWidth: false,
            isNeedAdjustHeight: false,
-            adjustLength: 1,
+            adjustLength: o.adjustLength,
+            adjustXOffset: o.adjustXOffset,
+            adjustYOffset: o.adjustYOffset,
            ref: function () {
                self.combo = this;
            },
@ -84227,7 +84241,7 @@ BI.RichEditor = BI.inherit(BI.Widget, {
                    type: "bi.rich_editor_text_toolbar",
                    editor: this.editor
                }, o.toolbar),
-                height: 30,
+                height: 34,
                stopPropagation: true,
                stopEvent: true
            },
@ -108564,7 +108578,8 @@ BI.SliderIconButton = BI.inherit(BI.Widget, {
            items: [{
                el: {
                    type: "bi.text_button",
-                    cls: "slider-button",
+                    forceNotSelected: true,
+                    cls: "slider-button bi-list-item-select2",
                    ref: function () {
                        self.slider = this;
                    }
--- a/dist/bundle.min.js
+++ b/dist/bundle.min.js
--- a/dist/case.js
+++ b/dist/case.js
@ -10519,8 +10519,8 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
        var attrs = BI.DOM.getImage(o.paramFormatter(param));
        image.src = attrs.src;
        image.alt = param;
-        image.style = attrs.style;
        $(image).addClass("rich-editor-param");
+        $(image).attr("style", attrs.style);
        this.options.editor.insertHTML($("<div>").append(image).html());
        // var sel = this._get$Sel();
        // var wrapper = o.editor.instance.getElm().element;
@ -10660,7 +10660,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
                {type: "bi.rich_editor_align_right_button"},
                {type: "bi.rich_editor_param_button"}
            ],
-            height: 28
+            height: 34
        });
    },

@ -10682,7 +10682,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
            element: this,
            items: buttons,
            hgap: 3,
-            vgap: 3
+            vgap: 6
        });
    },

@ -11027,7 +11027,11 @@ BI.shortcut("bi.rich_editor_text_toolbar", BI.RichEditorTextToolbar);/**

            try {
                // w3c
-                this.nicCommand("insertHTML", html);
+                if (document.queryCommandState("insertHTML")) {
+                    this.nicCommand("insertHTML", html);
+                } else {
+                    throw new Error("Does not support this command");
+                }
            } catch(e) {
                if (range.insertNode) {
                    // IE
@ -11682,6 +11686,14 @@ BI.RichEditor = BI.inherit(BI.Widget, {
        readOnly: false
    },

+    _defaultConfig: function () {
+        return BI.extend(BI.RichEditor.superclass._defaultConfig.apply(this, arguments), {
+            adjustLength: 1,
+            adjustXOffset: 0,
+            adjustYOffset: 0
+        });
+    },
+
    render: function () {
        var self = this, o = this.options;
        var editor = {
@ -11718,7 +11730,9 @@ BI.RichEditor = BI.inherit(BI.Widget, {
            direction: "top,right",
            isNeedAdjustWidth: false,
            isNeedAdjustHeight: false,
-            adjustLength: 1,
+            adjustLength: o.adjustLength,
+            adjustXOffset: o.adjustXOffset,
+            adjustYOffset: o.adjustYOffset,
            ref: function () {
                self.combo = this;
            },
@ -11728,7 +11742,7 @@ BI.RichEditor = BI.inherit(BI.Widget, {
                    type: "bi.rich_editor_text_toolbar",
                    editor: this.editor
                }, o.toolbar),
-                height: 30,
+                height: 34,
                stopPropagation: true,
                stopEvent: true
            },
@ -11775,7 +11789,7 @@ BI.SegmentButton = BI.inherit(BI.BasicButton, {
    _defaultConfig: function () {
        var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments);
        return BI.extend(conf, {
-            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-active",
+            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select",
            shadow: true,
            readonly: true,
            hgap: 5
--- a/dist/core.css
+++ b/dist/core.css
@ -336,13 +336,13 @@ textarea {
 }
 .bi-theme-dark .bi-background {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-card {
  background-color: #ffffff;
@ -356,13 +356,13 @@ textarea {
 }
 .bi-theme-dark .bi-card {
  background-color: #242640;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-disabled {
  color: #9ea6b2;
@ -1081,31 +1081,63 @@ textarea {
 .bi-list-item-select.button-warning.active.bi-high-light-border {
  border-color: #e85050;
 }
-.bi-list-item-select.disabled,
-.bi-list-item-select.disabled:hover,
-.bi-list-item-select.disabled:active {
+.bi-list-item-select.disabled {
  color: #9ea6b2 !important;
  background-color: transparent !important;
 }
-.bi-list-item-select.disabled .bi-input,
-.bi-list-item-select.disabled:hover .bi-input,
-.bi-list-item-select.disabled:active .bi-input {
+.bi-list-item-select.disabled .bi-input {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-textarea,
-.bi-list-item-select.disabled:hover .bi-textarea,
-.bi-list-item-select.disabled:active .bi-textarea {
+.bi-list-item-select.disabled .bi-textarea {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-high-light,
-.bi-list-item-select.disabled:hover .bi-high-light,
-.bi-list-item-select.disabled:active .bi-high-light {
+.bi-list-item-select.disabled .bi-high-light {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled.bi-high-light-border,
-.bi-list-item-select.disabled:hover.bi-high-light-border,
-.bi-list-item-select.disabled:active.bi-high-light-border {
-  border-color: #cccccc;
+.bi-list-item-select.disabled.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select.disabled.hover,
+.bi-list-item-select.disabled.active {
+  color: #ffffff !important;
+  background-color: #d0d4da !important;
+}
+.bi-list-item-select.disabled.hover .bi-input,
+.bi-list-item-select.disabled.active .bi-input {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-textarea,
+.bi-list-item-select.disabled.active .bi-textarea {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-high-light,
+.bi-list-item-select.disabled.active .bi-high-light {
+  color: #9ea6b2 !important;
+}
+.bi-list-item-select.disabled.hover.bi-high-light-border,
+.bi-list-item-select.disabled.active.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select2:hover,
+.bi-list-item-select2.hover {
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active,
+.bi-list-item-select2.active {
+  color: #ffffff;
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active .bi-input,
+.bi-list-item-select2.active .bi-input {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-textarea,
+.bi-list-item-select2.active .bi-textarea {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-high-light,
+.bi-list-item-select2.active .bi-high-light {
+  color: #ffffff;
 }
 .bi-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
@ -1749,7 +1781,7 @@ textarea {
 }
 .bi-theme-dark {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-input {
  color: #ffffff;
--- a/dist/core_without_normalize.css
+++ b/dist/core_without_normalize.css
@ -58,13 +58,13 @@ textarea {
 }
 .bi-theme-dark .bi-background {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-card {
  background-color: #ffffff;
@ -78,13 +78,13 @@ textarea {
 }
 .bi-theme-dark .bi-card {
  background-color: #242640;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-disabled {
  color: #9ea6b2;
@ -803,31 +803,63 @@ textarea {
 .bi-list-item-select.button-warning.active.bi-high-light-border {
  border-color: #e85050;
 }
-.bi-list-item-select.disabled,
-.bi-list-item-select.disabled:hover,
-.bi-list-item-select.disabled:active {
+.bi-list-item-select.disabled {
  color: #9ea6b2 !important;
  background-color: transparent !important;
 }
-.bi-list-item-select.disabled .bi-input,
-.bi-list-item-select.disabled:hover .bi-input,
-.bi-list-item-select.disabled:active .bi-input {
+.bi-list-item-select.disabled .bi-input {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-textarea,
-.bi-list-item-select.disabled:hover .bi-textarea,
-.bi-list-item-select.disabled:active .bi-textarea {
+.bi-list-item-select.disabled .bi-textarea {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-high-light,
-.bi-list-item-select.disabled:hover .bi-high-light,
-.bi-list-item-select.disabled:active .bi-high-light {
+.bi-list-item-select.disabled .bi-high-light {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled.bi-high-light-border,
-.bi-list-item-select.disabled:hover.bi-high-light-border,
-.bi-list-item-select.disabled:active.bi-high-light-border {
-  border-color: #cccccc;
+.bi-list-item-select.disabled.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select.disabled.hover,
+.bi-list-item-select.disabled.active {
+  color: #ffffff !important;
+  background-color: #d0d4da !important;
+}
+.bi-list-item-select.disabled.hover .bi-input,
+.bi-list-item-select.disabled.active .bi-input {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-textarea,
+.bi-list-item-select.disabled.active .bi-textarea {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-high-light,
+.bi-list-item-select.disabled.active .bi-high-light {
+  color: #9ea6b2 !important;
+}
+.bi-list-item-select.disabled.hover.bi-high-light-border,
+.bi-list-item-select.disabled.active.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select2:hover,
+.bi-list-item-select2.hover {
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active,
+.bi-list-item-select2.active {
+  color: #ffffff;
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active .bi-input,
+.bi-list-item-select2.active .bi-input {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-textarea,
+.bi-list-item-select2.active .bi-textarea {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-high-light,
+.bi-list-item-select2.active .bi-high-light {
+  color: #ffffff;
 }
 .bi-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
@ -1471,7 +1503,7 @@ textarea {
 }
 .bi-theme-dark {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-input {
  color: #ffffff;
--- a/dist/fineui.css
+++ b/dist/fineui.css
@ -336,13 +336,13 @@ textarea {
 }
 .bi-theme-dark .bi-background {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-card {
  background-color: #ffffff;
@ -356,13 +356,13 @@ textarea {
 }
 .bi-theme-dark .bi-card {
  background-color: #242640;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-disabled {
  color: #9ea6b2;
@ -1105,7 +1105,24 @@ textarea {
 .bi-list-item-select.disabled.bi-high-light-border,
 .bi-list-item-select.disabled:hover.bi-high-light-border,
 .bi-list-item-select.disabled:active.bi-high-light-border {
-  border-color: #cccccc;
+  border-color: #F0F3F7;
+}
+.bi-list-item-select2:hover,
+.bi-list-item-select2.hover {
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active,
+.bi-list-item-select2.active {
+  color: #3685f2;
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active .bi-input,
+.bi-list-item-select2.active .bi-input {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-textarea,
+.bi-list-item-select2.active .bi-textarea {
+  color: #3685f2;
 }
 .bi-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
@ -1749,7 +1766,7 @@ textarea {
 }
 .bi-theme-dark {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-input {
  color: #ffffff;
@ -2738,8 +2755,8 @@ 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;
-  border-color: #cccccc !important;
+  background: #F0F3F7 !important;
+  border-color: #F0F3F7 !important;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
@ -2773,7 +2790,7 @@ 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;
+  color: #9ea6b2 !important;
 }
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
@ -3198,8 +3215,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 .scrollbar-layout-main-vertical {
  bottom: 0;
@ -3221,8 +3238,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 /* Touching the scroll-track directly makes the scroll-track bolder */
 .scrollbar-layout-main-horizontal.public-scrollbar-main-active,
@ -3279,8 +3296,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
  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);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .public-scrollbar-main:hover .public-scrollbar-face:after,
 .public-scrollbar-main-active .public-scrollbar-face:after,
@ -3291,8 +3308,8 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 .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);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .horizontal-scrollbar {
  bottom: 0;
@ -4133,6 +4150,7 @@ ul.ztree.zTreeDragUL {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
+  background-color: #f7f8fa;
  width: 20px;
  height: 20px;
  top: 4px;
@ -4251,8 +4269,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -4261,13 +4279,13 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .farbtastic .wheel {
  background: url('resources?path=/com/fr/web/ui/images/1x/background/wheel.png') no-repeat center center;
--- a/dist/fineui.js
+++ b/dist/fineui.js
@ -83267,8 +83267,8 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
        var attrs = BI.DOM.getImage(o.paramFormatter(param));
        image.src = attrs.src;
        image.alt = param;
-        image.style = attrs.style;
        $(image).addClass("rich-editor-param");
+        $(image).attr("style", attrs.style);
        this.options.editor.insertHTML($("<div>").append(image).html());
        // var sel = this._get$Sel();
        // var wrapper = o.editor.instance.getElm().element;
@ -83408,7 +83408,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
                {type: "bi.rich_editor_align_right_button"},
                {type: "bi.rich_editor_param_button"}
            ],
-            height: 28
+            height: 34
        });
    },

@ -83430,7 +83430,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
            element: this,
            items: buttons,
            hgap: 3,
-            vgap: 3
+            vgap: 6
        });
    },

@ -83775,7 +83775,11 @@ BI.shortcut("bi.rich_editor_text_toolbar", BI.RichEditorTextToolbar);/**

            try {
                // w3c
-                this.nicCommand("insertHTML", html);
+                if (document.queryCommandState("insertHTML")) {
+                    this.nicCommand("insertHTML", html);
+                } else {
+                    throw new Error("Does not support this command");
+                }
            } catch(e) {
                if (range.insertNode) {
                    // IE
@ -84430,6 +84434,14 @@ BI.RichEditor = BI.inherit(BI.Widget, {
        readOnly: false
    },

+    _defaultConfig: function () {
+        return BI.extend(BI.RichEditor.superclass._defaultConfig.apply(this, arguments), {
+            adjustLength: 1,
+            adjustXOffset: 0,
+            adjustYOffset: 0
+        });
+    },
+
    render: function () {
        var self = this, o = this.options;
        var editor = {
@ -84466,7 +84478,9 @@ BI.RichEditor = BI.inherit(BI.Widget, {
            direction: "top,right",
            isNeedAdjustWidth: false,
            isNeedAdjustHeight: false,
-            adjustLength: 1,
+            adjustLength: o.adjustLength,
+            adjustXOffset: o.adjustXOffset,
+            adjustYOffset: o.adjustYOffset,
            ref: function () {
                self.combo = this;
            },
@ -84476,7 +84490,7 @@ BI.RichEditor = BI.inherit(BI.Widget, {
                    type: "bi.rich_editor_text_toolbar",
                    editor: this.editor
                }, o.toolbar),
-                height: 30,
+                height: 34,
                stopPropagation: true,
                stopEvent: true
            },
@ -108813,7 +108827,8 @@ BI.SliderIconButton = BI.inherit(BI.Widget, {
            items: [{
                el: {
                    type: "bi.text_button",
-                    cls: "slider-button",
+                    forceNotSelected: true,
+                    cls: "slider-button bi-list-item-select2",
                    ref: function () {
                        self.slider = this;
                    }
--- a/dist/fineui.min.js
+++ b/dist/fineui.min.js
--- a/dist/resource.css
+++ b/dist/resource.css
@ -51,8 +51,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -61,13 +61,13 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .farbtastic .wheel {
  background: url('images/1x/background/wheel.png') no-repeat center center;
--- a/dist/widget.css
+++ b/dist/widget.css
@ -427,6 +427,7 @@
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
+  background-color: #f7f8fa;
  width: 20px;
  height: 20px;
  top: 4px;
--- a/dist/widget.js
+++ b/dist/widget.js
@ -20891,7 +20891,8 @@ BI.SliderIconButton = BI.inherit(BI.Widget, {
            items: [{
                el: {
                    type: "bi.text_button",
-                    cls: "slider-button",
+                    forceNotSelected: true,
+                    cls: "slider-button bi-list-item-select2",
                    ref: function () {
                        self.slider = this;
                    }
--- a/public/css/app.css
+++ b/public/css/app.css
@ -51,8 +51,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -61,11 +61,11 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
--- a/src/base/combination/expander.js
+++ b/src/base/combination/expander.js
@ -103,7 +103,7 @@ BI.Expander = BI.inherit(BI.Widget, {
                        }
                    });
                    break;
-                default :
+                case "click":
                    if (e) {
                        self.element.off(e + "." + self.getName()).on(e + "." + self.getName(), BI.debounce(function (e) {
                            if (self.expander.element.__isMouseInBounds__(e)) {
--- a/src/case/richeditor/bar/action.richeditor.param.js
+++ b/src/case/richeditor/bar/action.richeditor.param.js
@ -48,8 +48,8 @@ BI.RichEditorParamAction = BI.inherit(BI.RichEditorAction, {
        var attrs = BI.DOM.getImage(o.paramFormatter(param));
        image.src = attrs.src;
        image.alt = param;
-        image.style = attrs.style;
        $(image).addClass("rich-editor-param");
+        $(image).attr("style", attrs.style);
        this.options.editor.insertHTML($("<div>").append(image).html());
        // var sel = this._get$Sel();
        // var wrapper = o.editor.instance.getElm().element;
--- a/src/case/richeditor/bar/texttoolbar.js
+++ b/src/case/richeditor/bar/texttoolbar.js
@ -22,7 +22,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
                {type: "bi.rich_editor_align_right_button"},
                {type: "bi.rich_editor_param_button"}
            ],
-            height: 28
+            height: 34
        });
    },

@ -44,7 +44,7 @@ BI.RichEditorTextToolbar = BI.inherit(BI.Widget, {
            element: this,
            items: buttons,
            hgap: 3,
-            vgap: 3
+            vgap: 6
        });
    },

--- a/src/case/richeditor/niceditor/niceditor.js
+++ b/src/case/richeditor/niceditor/niceditor.js
@ -320,7 +320,11 @@

            try {
                // w3c
-                this.nicCommand("insertHTML", html);
+                if (document.queryCommandState("insertHTML")) {
+                    this.nicCommand("insertHTML", html);
+                } else {
+                    throw new Error("Does not support this command");
+                }
            } catch(e) {
                if (range.insertNode) {
                    // IE
--- a/src/case/richeditor/richeditor.js
+++ b/src/case/richeditor/richeditor.js
@ -13,6 +13,14 @@ BI.RichEditor = BI.inherit(BI.Widget, {
        readOnly: false
    },

+    _defaultConfig: function () {
+        return BI.extend(BI.RichEditor.superclass._defaultConfig.apply(this, arguments), {
+            adjustLength: 1,
+            adjustXOffset: 0,
+            adjustYOffset: 0
+        });
+    },
+
    render: function () {
        var self = this, o = this.options;
        var editor = {
@ -49,7 +57,9 @@ BI.RichEditor = BI.inherit(BI.Widget, {
            direction: "top,right",
            isNeedAdjustWidth: false,
            isNeedAdjustHeight: false,
-            adjustLength: 1,
+            adjustLength: o.adjustLength,
+            adjustXOffset: o.adjustXOffset,
+            adjustYOffset: o.adjustYOffset,
            ref: function () {
                self.combo = this;
            },
@ -59,7 +69,7 @@ BI.RichEditor = BI.inherit(BI.Widget, {
                    type: "bi.rich_editor_text_toolbar",
                    editor: this.editor
                }, o.toolbar),
-                height: 30,
+                height: 34,
                stopPropagation: true,
                stopEvent: true
            },
--- a/src/case/segment/button.segment.js
+++ b/src/case/segment/button.segment.js
@ -10,7 +10,7 @@ BI.SegmentButton = BI.inherit(BI.BasicButton, {
    _defaultConfig: function () {
        var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments);
        return BI.extend(conf, {
-            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-active",
+            baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select",
            shadow: true,
            readonly: true,
            hgap: 5
--- a/src/css/base/colorchooser/colorchooser.css
+++ b/src/css/base/colorchooser/colorchooser.css
@ -8,7 +8,7 @@
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
-  box-shadow: 0px 0px 2px 1px #d4dadd inset;
-  -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset;
-  -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset;
+  box-shadow: 0px 0px 2px 1px #d0d4da inset;
+  -webkit-box-shadow: 0px 0px 2px 1px #d0d4da inset;
+  -moz-box-shadow: 0px 0px 2px 1px #d0d4da inset;
 }
--- a/src/css/base/segment/button.css
+++ b/src/css/base/segment/button.css
@ -0,0 +1,3 @@
+.bi-segment-button {
+  color: #3685f2;
+}
--- a/src/css/base/segment/segment.css
+++ b/src/css/base/segment/segment.css
@ -3,12 +3,12 @@
  overflow-x: hidden;
  overflow-y: hidden;
  background: #ffffff;
-  border-right: 1px solid #e8eaed;
-  border-top: 1px solid #e8eaed;
-  border-bottom: 1px solid #e8eaed;
+  border-right: 1px solid #3685f2;
+  border-top: 1px solid #3685f2;
+  border-bottom: 1px solid #3685f2;
 }
 .bi-segment > .first-element {
-  border-left: 1px solid #e8eaed;
+  border-left: 1px solid #3685f2;
  -webkit-border-radius: 6px 0px 0px 6px;
  -moz-border-radius: 6px 0px 0px 6px;
  border-radius: 6px 0px 0px 6px;
@ -18,6 +18,10 @@
  -moz-border-radius: 0px 6px 6px 0px;
  border-radius: 0px 6px 6px 0px;
 }
+.bi-segment.disabled > .center-element,
+.bi-segment.disabled > .first-element {
+  border-color: #F0F3F7;
+}
 .bi-theme-dark .bi-segment > .center-element {
  overflow: hidden;
  overflow-x: hidden;
--- a/src/css/base/single/button/button.css
+++ b/src/css/base/single/button/button.css
@ -163,8 +163,8 @@ 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;
-  border-color: #cccccc !important;
+  background: #F0F3F7 !important;
+  border-color: #F0F3F7 !important;
 }
 body .bi-button.button-common.disabled,
 #body .bi-button.button-common.disabled,
@ -198,7 +198,7 @@ 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;
+  color: #9ea6b2 !important;
 }
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
--- a/src/css/base/table/table.css
+++ b/src/css/base/table/table.css
@ -63,8 +63,8 @@
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 .scrollbar-layout-main-vertical {
  bottom: 0;
@ -86,8 +86,8 @@
  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);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
 }
 /* Touching the scroll-track directly makes the scroll-track bolder */
 .scrollbar-layout-main-horizontal.public-scrollbar-main-active,
@ -144,8 +144,8 @@
  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);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .public-scrollbar-main:hover .public-scrollbar-face:after,
 .public-scrollbar-main-active .public-scrollbar-face:after,
@ -156,8 +156,8 @@
 .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);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
 .horizontal-scrollbar {
  bottom: 0;
--- a/src/css/core/utils/common.css
+++ b/src/css/core/utils/common.css
@ -58,13 +58,13 @@ textarea {
 }
 .bi-theme-dark .bi-background {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-background .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-card {
  background-color: #ffffff;
@ -78,13 +78,13 @@ textarea {
 }
 .bi-theme-dark .bi-card {
  background-color: #242640;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-input {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-card .bi-textarea {
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-disabled {
  color: #9ea6b2;
@ -803,31 +803,63 @@ textarea {
 .bi-list-item-select.button-warning.active.bi-high-light-border {
  border-color: #e85050;
 }
-.bi-list-item-select.disabled,
-.bi-list-item-select.disabled:hover,
-.bi-list-item-select.disabled:active {
+.bi-list-item-select.disabled {
  color: #9ea6b2 !important;
  background-color: transparent !important;
 }
-.bi-list-item-select.disabled .bi-input,
-.bi-list-item-select.disabled:hover .bi-input,
-.bi-list-item-select.disabled:active .bi-input {
+.bi-list-item-select.disabled .bi-input {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-textarea,
-.bi-list-item-select.disabled:hover .bi-textarea,
-.bi-list-item-select.disabled:active .bi-textarea {
+.bi-list-item-select.disabled .bi-textarea {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled .bi-high-light,
-.bi-list-item-select.disabled:hover .bi-high-light,
-.bi-list-item-select.disabled:active .bi-high-light {
+.bi-list-item-select.disabled .bi-high-light {
  color: #9ea6b2 !important;
 }
-.bi-list-item-select.disabled.bi-high-light-border,
-.bi-list-item-select.disabled:hover.bi-high-light-border,
-.bi-list-item-select.disabled:active.bi-high-light-border {
-  border-color: #cccccc;
+.bi-list-item-select.disabled.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select.disabled.hover,
+.bi-list-item-select.disabled.active {
+  color: #ffffff !important;
+  background-color: #d0d4da !important;
+}
+.bi-list-item-select.disabled.hover .bi-input,
+.bi-list-item-select.disabled.active .bi-input {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-textarea,
+.bi-list-item-select.disabled.active .bi-textarea {
+  color: #ffffff !important;
+}
+.bi-list-item-select.disabled.hover .bi-high-light,
+.bi-list-item-select.disabled.active .bi-high-light {
+  color: #9ea6b2 !important;
+}
+.bi-list-item-select.disabled.hover.bi-high-light-border,
+.bi-list-item-select.disabled.active.bi-high-light-border {
+  border-color: #F0F3F7;
+}
+.bi-list-item-select2:hover,
+.bi-list-item-select2.hover {
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active,
+.bi-list-item-select2.active {
+  color: #ffffff;
+  background-color: #f7f8fa;
+}
+.bi-list-item-select2:active .bi-input,
+.bi-list-item-select2.active .bi-input {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-textarea,
+.bi-list-item-select2.active .bi-textarea {
+  color: #3685f2;
+}
+.bi-list-item-select2:active .bi-high-light,
+.bi-list-item-select2.active .bi-high-light {
+  color: #ffffff;
 }
 .bi-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
--- a/src/css/resource/app.css
+++ b/src/css/resource/app.css
@ -51,8 +51,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -61,11 +61,11 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }
--- a/src/css/theme/dark.css
+++ b/src/css/theme/dark.css
@ -1,6 +1,6 @@
 .bi-theme-dark {
  background-color: #191B2B;
-  color: #cccccc;
+  color: #F0F3F7;
 }
 .bi-theme-dark .bi-input {
  color: #ffffff;
--- a/src/css/widget/singleslider/slider/widget.css
+++ b/src/css/widget/singleslider/slider/widget.css
@ -15,6 +15,7 @@
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
+  background-color: #f7f8fa;
  width: 20px;
  height: 20px;
  top: 4px;
--- a/src/less/base/colorchooser/colorchooser.trigger.less
+++ b/src/less/base/colorchooser/colorchooser.trigger.less
@ -2,5 +2,5 @@

 .bi-color-chooser-trigger {
  .border-radius(2px);
-  .box-shadow(0px, 0px, 2px, 1px, @color-bi-background-dark, inset);
+  .box-shadow(0px, 0px, 2px, 1px, @color-bi-background-dark-gray, inset);
 }
--- a/src/less/base/segment/button.segment.less
+++ b/src/less/base/segment/button.segment.less
@ -1,4 +1,5 @@
@import "../../index";

 .bi-segment-button{
+  color: @color-bi-text-highlight;
 }
--- a/src/less/base/segment/segment.less
+++ b/src/less/base/segment/segment.less
@ -4,17 +4,20 @@
  & > .center-element{
    .overflow-hidden();
    background: @color-bi-background-default;
-    border-right: 1px solid @color-bi-border-line;
-    border-top: 1px solid @color-bi-border-line;
-    border-bottom: 1px solid @color-bi-border-line;
+    border-right: 1px solid @color-bi-border-highlight;
+    border-top: 1px solid @color-bi-border-highlight;
+    border-bottom: 1px solid @color-bi-border-highlight;
  }
  & > .first-element{
-    border-left: 1px solid @color-bi-border-line;
+    border-left: 1px solid @color-bi-border-highlight;
    .border-corner-radius(6px,0px,0px,6px)
  }
  & > .last-element{
    .border-corner-radius(0px,6px,6px,0px)
  }
+  &.disabled > .center-element, &.disabled > .first-element{
+    border-color: @color-bi-border-disabled;
+  }
 }

 .bi-theme-dark {
--- a/src/less/base/single/button/button.less
+++ b/src/less/base/single/button/button.less
@ -114,7 +114,7 @@ body .bi-button, #body .bi-button {
  &.button-warning.disabled {
    &, &.base-disabled {
      &, & .b-font:before {
-        color: @color-bi-text !important;
+        color: @color-bi-text-disabled !important;
      }
      background: @color-bi-background-disabled !important;
      border-color: @color-bi-border-disabled !important;
--- a/src/less/core/utils/common.less
+++ b/src/less/core/utils/common.less
@ -793,15 +793,29 @@ textarea {
    }
  }
  &.disabled {
-    &, &:hover, &:active {
+    color: @color-bi-text-disabled !important;
+    & .bi-input {
+      color: @color-bi-text-disabled !important;
+    }
+    & .bi-textarea {
      color: @color-bi-text-disabled !important;
+    }
+    background-color: transparent !important;
+    & .bi-high-light {
+      color: @color-bi-text-disabled !important;
+    }
+    &.bi-high-light-border {
+      border-color: @color-bi-border-disabled;
+    }
+    &.hover, &.active {
+      color: @color-bi-text !important;
      & .bi-input {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text !important;
      }
      & .bi-textarea {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text !important;
      }
-      background-color: transparent !important;
+      background-color: @color-bi-background-dark-gray !important;
      & .bi-high-light {
        color: @color-bi-text-disabled !important;
      }
@ -812,6 +826,26 @@ textarea {
  }
 }

+//与bi-list-item-select的区别是背景是灰的
+.bi-list-item-select2 {
+  &:hover, &.hover {
+    background-color: @color-bi-background-normal;
+  }
+  &:active, &.active {
+    color: @color-bi-text;
+    & .bi-input {
+      color: @color-bi-text-highlight;
+    }
+    & .bi-textarea {
+      color: @color-bi-text-highlight;
+    }
+    background-color: @color-bi-background-normal;
+    & .bi-high-light {
+      color: @color-bi-text;
+    }
+  }
+}
+
 .bi-theme-dark {
  .bi-list-item-select {
    &:hover, &.hover {
--- a/src/less/lib/colors.less
+++ b/src/less/lib/colors.less
@ -41,7 +41,7 @@
 //黑色背景
@color-bi-background-black: @background-color-black;
 //深灰色背景
-@color-bi-background-dark: @background-color-dark;
+@color-bi-background-dark-gray: @background-color-dark-gray;
 //灰色背景(浅)
@color-bi-background-light-gray: @background-color-light-gray;
 //灰化背景
--- a/src/less/lib/constant.less
+++ b/src/less/lib/constant.less
@ -17,7 +17,7 @@
 //font color
@font-color-black: #232e40;//
@font-color-normal: #3d4d66;//
-@font-color-normal-theme-dark: #cccccc;//
+@font-color-normal-theme-dark: #F0F3F7;//
@font-color-light-gray: #647185;
@font-color-disabled: #9ea6b2;//
@font-color-disabled-theme-dark: #666666;//
@ -48,7 +48,7 @@
@background-color-dark: #d4dadd;
@background-color-light-gray: #F2F4F7;
@background-color-dark-gray: #d0d4da;
-@background-color-disabled: #cccccc;
+@background-color-disabled: #F0F3F7;
@background-color-yellow: #ffc101;//

@background-color-negative: #ff4949;
@ -75,10 +75,10 @@
@border-color-normal-success: #eddea2;

 //split color
-@border-color-disabled: #cccccc;
+@border-color-disabled: #F0F3F7;

 //scroll color
@scroll-color: #666666;
-@scroll-color-theme-dark: #cccccc;
+@scroll-color-theme-dark: #F0F3F7;

@water-mark-color-theme-dark: #666666;
--- a/src/less/widget/singleslider/slider/widget.slider.less
+++ b/src/less/widget/singleslider/slider/widget.slider.less
@ -12,6 +12,7 @@
    left: -8px;
    &:hover, &.hover {
      .border-radius(10px);
+      background-color: @color-bi-background-normal;
      width: 20px;
      height: 20px;
      top: 4px;
--- a/src/widget/selecttree/selecttree.expander.js
+++ b/src/widget/selecttree/selecttree.expander.js
@ -7,7 +7,7 @@ BI.SelectTreeExpander = BI.inherit(BI.Widget, {
    _defaultConfig: function () {
        return BI.extend(BI.SelectTreeExpander.superclass._defaultConfig.apply(this, arguments), {
            baseCls: "bi-select-tree-expander",
-            trigger: "click",
+            trigger: "",
            toggle: true,
            direction: "bottom",
            isDefaultInit: true,
@ -20,7 +20,7 @@ BI.SelectTreeExpander = BI.inherit(BI.Widget, {
        BI.SelectTreeExpander.superclass._init.apply(this, arguments);
        var self = this, o = this.options;

-        this.trigger = BI.createWidget(BI.extend({stopPropagation: true}, o.el));
+        this.trigger = BI.createWidget(o.el);
        this.trigger.on(BI.Controller.EVENT_CHANGE, function (type) {
            if (type === BI.Events.CLICK) {
                if (this.isSelected()) {
--- a/src/widget/singleslider/button/iconbutton.slider.js
+++ b/src/widget/singleslider/button/iconbutton.slider.js
@ -24,7 +24,8 @@ BI.SliderIconButton = BI.inherit(BI.Widget, {
            items: [{
                el: {
                    type: "bi.text_button",
-                    cls: "slider-button",
+                    forceNotSelected: true,
+                    cls: "slider-button bi-list-item-select2",
                    ref: function () {
                        self.slider = this;
                    }
--- a/ui/css/app.css
+++ b/ui/css/app.css
@ -51,8 +51,8 @@ textarea::-webkit-scrollbar-thumb:hover {
 .bi-theme-dark div::-webkit-scrollbar,
 .bi-theme-dark textarea::-webkit-scrollbar {
  -webkit-appearance: none;
-  background-color: rgba(204, 204, 204, 0.05);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0dcccccc,endColorstr=#0dcccccc);
+  background-color: rgba(240, 243, 247, 0.05);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0df0f3f7,endColorstr=#0df0f3f7);
  width: 6px;
  height: 6px;
 }
@ -61,11 +61,11 @@ textarea::-webkit-scrollbar-thumb:hover {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
-  background-color: rgba(204, 204, 204, 0.3);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4dcccccc,endColorstr=#4dcccccc);
+  background-color: rgba(240, 243, 247, 0.3);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4df0f3f7,endColorstr=#4df0f3f7);
 }
 .bi-theme-dark div::-webkit-scrollbar-thumb:hover,
 .bi-theme-dark textarea::-webkit-scrollbar-thumb:hover {
-  background-color: rgba(204, 204, 204, 0.7);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3cccccc,endColorstr=#b3cccccc);
+  background-color: rgba(240, 243, 247, 0.7);
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3f0f3f7,endColorstr=#b3f0f3f7);
 }