button的warning状态

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

@@ -9,8 +9,10 @@ Demo.Items = BI.inherit(BI.Widget, {
         return {
             type: "bi.vertical",
             items: [{
-                type: "bi.label",
+                type: "bi.text_button",
+                cls: "bi-list-item-select bi-high-light-border bi-border",
                 height: 30,
+                level: "warning",
                 text: "单选item"
             }, {
                 type: "bi.single_select_item",

dist/base.js

@@ -610,6 +610,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
             forceSelected: false, // 点击即选中, 选中了就不会被取消,与once的区别是forceSelected不影响事件的触发
             forceNotSelected: false, // 无论怎么点击都不会被选中
             disableSelected: false, // 使能选中
+            level: "common",
 
             shadow: false,
             isShadowShowingOnSelected: false,  // 选中状态下是否显示阴影
@@ -630,6 +631,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
         if (opts.shadow) {
             this._createShadow();
         }
+        this.element.addClass("button-" + opts.level);
     },
 
     _createShadow: function () {
@@ -16425,7 +16427,6 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
                 isShadowShowingOnSelected: true,
                 readonly: true,
                 iconClass: "",
-                level: "common",
                 block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制
                 clear: false, // 是否去掉边框和背景
                 textAlign: "center",
@@ -16462,7 +16463,7 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
                 });
                 BI.createWidget({
                     type: "bi.horizontal_auto",
-                    cls: "button-" + o.level + " " + o.iconClass,
+                    cls: o.iconClass,
                     element: this,
                     hgap: o.hgap,
                     vgap: o.vgap,
@@ -16478,7 +16479,6 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
             } else {
                 this.text = BI.createWidget({
                     type: "bi.label",
-                    cls: "button-" + o.level,
                     textAlign: o.textAlign,
                     whiteSpace: o.whiteSpace,
                     forceCenter: o.forceCenter,

dist/bundle.css

@@ -947,53 +947,6 @@ i {
 .bi-list-item-active3.disabled:active .bi-high-light {
   color: #9ea6b2 !important;
 }
-.bi-list-item-active4:hover,
-.bi-list-item-active4.hover {
-  color: #3685f2;
-  background-color: #eaf2fd;
-}
-.bi-list-item-active4:hover .bi-input,
-.bi-list-item-active4.hover .bi-input {
-  color: #3685f2;
-}
-.bi-list-item-active4:hover .bi-textarea,
-.bi-list-item-active4.hover .bi-textarea {
-  color: #3685f2;
-}
-.bi-list-item-active4.active,
-.bi-list-item-active4:active {
-  color: #ffffff;
-  background-color: #3f8ce8;
-}
-.bi-list-item-active4.active .bi-input,
-.bi-list-item-active4:active .bi-input {
-  color: #ffffff;
-}
-.bi-list-item-active4.active .bi-textarea,
-.bi-list-item-active4:active .bi-textarea {
-  color: #ffffff;
-}
-.bi-list-item-active4.disabled,
-.bi-list-item-active4.disabled:hover,
-.bi-list-item-active4.disabled:active {
-  background-color: transparent !important;
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-input,
-.bi-list-item-active4.disabled:hover .bi-input,
-.bi-list-item-active4.disabled:active .bi-input {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-textarea,
-.bi-list-item-active4.disabled:hover .bi-textarea,
-.bi-list-item-active4.disabled:active .bi-textarea {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-high-light,
-.bi-list-item-active4.disabled:hover .bi-high-light,
-.bi-list-item-active4.disabled:active .bi-high-light {
-  color: #9ea6b2 !important;
-}
 .bi-list-item-select:hover,
 .bi-list-item-select.hover {
   color: #1a1a1a;
@@ -1025,6 +978,63 @@ i {
 .bi-list-item-select.active .bi-high-light {
   color: #ffffff;
 }
+.bi-list-item-select.button-warning {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:hover,
+.bi-list-item-select.button-warning.hover {
+  color: #ff4949;
+  background-color: #ffecec;
+}
+.bi-list-item-select.button-warning:hover .bi-input,
+.bi-list-item-select.button-warning.hover .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-textarea,
+.bi-list-item-select.button-warning.hover .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-high-light,
+.bi-list-item-select.button-warning.hover .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover.bi-high-light-border,
+.bi-list-item-select.button-warning.hover.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:active,
+.bi-list-item-select.button-warning.active {
+  color: #ffffff;
+  background-color: #ff4949;
+}
+.bi-list-item-select.button-warning:active .bi-input,
+.bi-list-item-select.button-warning.active .bi-input {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-textarea,
+.bi-list-item-select.button-warning.active .bi-textarea {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-high-light,
+.bi-list-item-select.button-warning.active .bi-high-light {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active.bi-high-light-border,
+.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 {
@@ -1046,6 +1056,11 @@ i {
 .bi-list-item-select.disabled:active .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-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
   color: #ffffff;

dist/bundle.js

@@ -26385,6 +26385,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
             forceSelected: false, // 点击即选中, 选中了就不会被取消,与once的区别是forceSelected不影响事件的触发
             forceNotSelected: false, // 无论怎么点击都不会被选中
             disableSelected: false, // 使能选中
+            level: "common",
 
             shadow: false,
             isShadowShowingOnSelected: false,  // 选中状态下是否显示阴影
@@ -26405,6 +26406,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
         if (opts.shadow) {
             this._createShadow();
         }
+        this.element.addClass("button-" + opts.level);
     },
 
     _createShadow: function () {
@@ -42200,7 +42202,6 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
                 isShadowShowingOnSelected: true,
                 readonly: true,
                 iconClass: "",
-                level: "common",
                 block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制
                 clear: false, // 是否去掉边框和背景
                 textAlign: "center",
@@ -42237,7 +42238,7 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
                 });
                 BI.createWidget({
                     type: "bi.horizontal_auto",
-                    cls: "button-" + o.level + " " + o.iconClass,
+                    cls: o.iconClass,
                     element: this,
                     hgap: o.hgap,
                     vgap: o.vgap,
@@ -42253,7 +42254,6 @@ BI.shortcut("bi.image_button", BI.ImageButton);(function ($) {
             } else {
                 this.text = BI.createWidget({
                     type: "bi.label",
-                    cls: "button-" + o.level,
                     textAlign: o.textAlign,
                     whiteSpace: o.whiteSpace,
                     forceCenter: o.forceCenter,

dist/core.css

@@ -947,53 +947,6 @@ i {
 .bi-list-item-active3.disabled:active .bi-high-light {
   color: #9ea6b2 !important;
 }
-.bi-list-item-active4:hover,
-.bi-list-item-active4.hover {
-  color: #3685f2;
-  background-color: #eaf2fd;
-}
-.bi-list-item-active4:hover .bi-input,
-.bi-list-item-active4.hover .bi-input {
-  color: #3685f2;
-}
-.bi-list-item-active4:hover .bi-textarea,
-.bi-list-item-active4.hover .bi-textarea {
-  color: #3685f2;
-}
-.bi-list-item-active4.active,
-.bi-list-item-active4:active {
-  color: #ffffff;
-  background-color: #3f8ce8;
-}
-.bi-list-item-active4.active .bi-input,
-.bi-list-item-active4:active .bi-input {
-  color: #ffffff;
-}
-.bi-list-item-active4.active .bi-textarea,
-.bi-list-item-active4:active .bi-textarea {
-  color: #ffffff;
-}
-.bi-list-item-active4.disabled,
-.bi-list-item-active4.disabled:hover,
-.bi-list-item-active4.disabled:active {
-  background-color: transparent !important;
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-input,
-.bi-list-item-active4.disabled:hover .bi-input,
-.bi-list-item-active4.disabled:active .bi-input {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-textarea,
-.bi-list-item-active4.disabled:hover .bi-textarea,
-.bi-list-item-active4.disabled:active .bi-textarea {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-high-light,
-.bi-list-item-active4.disabled:hover .bi-high-light,
-.bi-list-item-active4.disabled:active .bi-high-light {
-  color: #9ea6b2 !important;
-}
 .bi-list-item-select:hover,
 .bi-list-item-select.hover {
   color: #1a1a1a;
@@ -1025,6 +978,63 @@ i {
 .bi-list-item-select.active .bi-high-light {
   color: #ffffff;
 }
+.bi-list-item-select.button-warning {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:hover,
+.bi-list-item-select.button-warning.hover {
+  color: #ff4949;
+  background-color: #ffecec;
+}
+.bi-list-item-select.button-warning:hover .bi-input,
+.bi-list-item-select.button-warning.hover .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-textarea,
+.bi-list-item-select.button-warning.hover .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-high-light,
+.bi-list-item-select.button-warning.hover .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover.bi-high-light-border,
+.bi-list-item-select.button-warning.hover.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:active,
+.bi-list-item-select.button-warning.active {
+  color: #ffffff;
+  background-color: #ff4949;
+}
+.bi-list-item-select.button-warning:active .bi-input,
+.bi-list-item-select.button-warning.active .bi-input {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-textarea,
+.bi-list-item-select.button-warning.active .bi-textarea {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-high-light,
+.bi-list-item-select.button-warning.active .bi-high-light {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active.bi-high-light-border,
+.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 {
@@ -1046,6 +1056,11 @@ i {
 .bi-list-item-select.disabled:active .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-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
   color: #ffffff;

dist/core_without_normalize.css

@@ -664,53 +664,6 @@
 .bi-list-item-active3.disabled:active .bi-high-light {
   color: #9ea6b2 !important;
 }
-.bi-list-item-active4:hover,
-.bi-list-item-active4.hover {
-  color: #3685f2;
-  background-color: #eaf2fd;
-}
-.bi-list-item-active4:hover .bi-input,
-.bi-list-item-active4.hover .bi-input {
-  color: #3685f2;
-}
-.bi-list-item-active4:hover .bi-textarea,
-.bi-list-item-active4.hover .bi-textarea {
-  color: #3685f2;
-}
-.bi-list-item-active4.active,
-.bi-list-item-active4:active {
-  color: #ffffff;
-  background-color: #3f8ce8;
-}
-.bi-list-item-active4.active .bi-input,
-.bi-list-item-active4:active .bi-input {
-  color: #ffffff;
-}
-.bi-list-item-active4.active .bi-textarea,
-.bi-list-item-active4:active .bi-textarea {
-  color: #ffffff;
-}
-.bi-list-item-active4.disabled,
-.bi-list-item-active4.disabled:hover,
-.bi-list-item-active4.disabled:active {
-  background-color: transparent !important;
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-input,
-.bi-list-item-active4.disabled:hover .bi-input,
-.bi-list-item-active4.disabled:active .bi-input {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-textarea,
-.bi-list-item-active4.disabled:hover .bi-textarea,
-.bi-list-item-active4.disabled:active .bi-textarea {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-high-light,
-.bi-list-item-active4.disabled:hover .bi-high-light,
-.bi-list-item-active4.disabled:active .bi-high-light {
-  color: #9ea6b2 !important;
-}
 .bi-list-item-select:hover,
 .bi-list-item-select.hover {
   color: #1a1a1a;
@@ -742,6 +695,63 @@
 .bi-list-item-select.active .bi-high-light {
   color: #ffffff;
 }
+.bi-list-item-select.button-warning {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:hover,
+.bi-list-item-select.button-warning.hover {
+  color: #ff4949;
+  background-color: #ffecec;
+}
+.bi-list-item-select.button-warning:hover .bi-input,
+.bi-list-item-select.button-warning.hover .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-textarea,
+.bi-list-item-select.button-warning.hover .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-high-light,
+.bi-list-item-select.button-warning.hover .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover.bi-high-light-border,
+.bi-list-item-select.button-warning.hover.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:active,
+.bi-list-item-select.button-warning.active {
+  color: #ffffff;
+  background-color: #ff4949;
+}
+.bi-list-item-select.button-warning:active .bi-input,
+.bi-list-item-select.button-warning.active .bi-input {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-textarea,
+.bi-list-item-select.button-warning.active .bi-textarea {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-high-light,
+.bi-list-item-select.button-warning.active .bi-high-light {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active.bi-high-light-border,
+.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 {
@@ -763,6 +773,11 @@
 .bi-list-item-select.disabled:active .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-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
   color: #ffffff;

dist/demo.js

@@ -11854,8 +11854,10 @@ Demo.Items = BI.inherit(BI.Widget, {
         return {
             type: "bi.vertical",
             items: [{
-                type: "bi.label",
+                type: "bi.text_button",
+                cls: "bi-list-item-select bi-high-light-border bi-border",
                 height: 30,
+                level: "warning",
                 text: "单选item"
             }, {
                 type: "bi.single_select_item",

src/base/single/button/button.basic.js

@@ -19,6 +19,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
             forceSelected: false, // 点击即选中, 选中了就不会被取消,与once的区别是forceSelected不影响事件的触发
             forceNotSelected: false, // 无论怎么点击都不会被选中
             disableSelected: false, // 使能选中
+            level: "common",
 
             shadow: false,
             isShadowShowingOnSelected: false,  // 选中状态下是否显示阴影
@@ -39,6 +40,7 @@ BI.BasicButton = BI.inherit(BI.Single, {
         if (opts.shadow) {
             this._createShadow();
         }
+        this.element.addClass("button-" + opts.level);
     },
 
     _createShadow: function () {

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

@@ -19,7 +19,6 @@
                 isShadowShowingOnSelected: true,
                 readonly: true,
                 iconClass: "",
-                level: "common",
                 block: false, // 是否块状显示，即不显示边框，没有最小宽度的限制
                 clear: false, // 是否去掉边框和背景
                 textAlign: "center",
@@ -56,7 +55,7 @@
                 });
                 BI.createWidget({
                     type: "bi.horizontal_auto",
-                    cls: "button-" + o.level + " " + o.iconClass,
+                    cls: o.iconClass,
                     element: this,
                     hgap: o.hgap,
                     vgap: o.vgap,
@@ -72,7 +71,6 @@
             } else {
                 this.text = BI.createWidget({
                     type: "bi.label",
-                    cls: "button-" + o.level,
                     textAlign: o.textAlign,
                     whiteSpace: o.whiteSpace,
                     forceCenter: o.forceCenter,

src/css/core/utils/common.css

@@ -664,53 +664,6 @@
 .bi-list-item-active3.disabled:active .bi-high-light {
   color: #9ea6b2 !important;
 }
-.bi-list-item-active4:hover,
-.bi-list-item-active4.hover {
-  color: #3685f2;
-  background-color: #eaf2fd;
-}
-.bi-list-item-active4:hover .bi-input,
-.bi-list-item-active4.hover .bi-input {
-  color: #3685f2;
-}
-.bi-list-item-active4:hover .bi-textarea,
-.bi-list-item-active4.hover .bi-textarea {
-  color: #3685f2;
-}
-.bi-list-item-active4.active,
-.bi-list-item-active4:active {
-  color: #ffffff;
-  background-color: #3f8ce8;
-}
-.bi-list-item-active4.active .bi-input,
-.bi-list-item-active4:active .bi-input {
-  color: #ffffff;
-}
-.bi-list-item-active4.active .bi-textarea,
-.bi-list-item-active4:active .bi-textarea {
-  color: #ffffff;
-}
-.bi-list-item-active4.disabled,
-.bi-list-item-active4.disabled:hover,
-.bi-list-item-active4.disabled:active {
-  background-color: transparent !important;
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-input,
-.bi-list-item-active4.disabled:hover .bi-input,
-.bi-list-item-active4.disabled:active .bi-input {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-textarea,
-.bi-list-item-active4.disabled:hover .bi-textarea,
-.bi-list-item-active4.disabled:active .bi-textarea {
-  color: #9ea6b2 !important;
-}
-.bi-list-item-active4.disabled .bi-high-light,
-.bi-list-item-active4.disabled:hover .bi-high-light,
-.bi-list-item-active4.disabled:active .bi-high-light {
-  color: #9ea6b2 !important;
-}
 .bi-list-item-select:hover,
 .bi-list-item-select.hover {
   color: #1a1a1a;
@@ -742,6 +695,63 @@
 .bi-list-item-select.active .bi-high-light {
   color: #ffffff;
 }
+.bi-list-item-select.button-warning {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:hover,
+.bi-list-item-select.button-warning.hover {
+  color: #ff4949;
+  background-color: #ffecec;
+}
+.bi-list-item-select.button-warning:hover .bi-input,
+.bi-list-item-select.button-warning.hover .bi-input {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-textarea,
+.bi-list-item-select.button-warning.hover .bi-textarea {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover .bi-high-light,
+.bi-list-item-select.button-warning.hover .bi-high-light {
+  color: #ff4949;
+}
+.bi-list-item-select.button-warning:hover.bi-high-light-border,
+.bi-list-item-select.button-warning.hover.bi-high-light-border {
+  border-color: #e85050;
+}
+.bi-list-item-select.button-warning:active,
+.bi-list-item-select.button-warning.active {
+  color: #ffffff;
+  background-color: #ff4949;
+}
+.bi-list-item-select.button-warning:active .bi-input,
+.bi-list-item-select.button-warning.active .bi-input {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-textarea,
+.bi-list-item-select.button-warning.active .bi-textarea {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active .bi-high-light,
+.bi-list-item-select.button-warning.active .bi-high-light {
+  color: #ffffff;
+}
+.bi-list-item-select.button-warning:active.bi-high-light-border,
+.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 {
@@ -763,6 +773,11 @@
 .bi-list-item-select.disabled:active .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-theme-dark .bi-list-item-select:hover,
 .bi-theme-dark .bi-list-item-select.hover {
   color: #ffffff;

src/less/core/utils/common.less

@@ -650,19 +650,19 @@
   }
 }
 
-// 文字和背景hover和active时变化
-.bi-list-item-active4 {
+//有选中效果
+.bi-list-item-select {
   &:hover, &.hover {
-    color: @color-bi-text-highlight;
+    color: @color-bi-text-black;
     & .bi-input {
-      color: @color-bi-text-highlight;
+      color: @color-bi-text-black;
     }
     & .bi-textarea {
-      color: @color-bi-text-highlight;
+      color: @color-bi-text-black;
     }
-    background-color: @color-bi-background-light-highlight;
+    .background-color(@color-bi-background-black, 5%);
   }
-  &.active, &:active {
+  &:active, &.active {
     color: @color-bi-text;
     & .bi-input {
       color: @color-bi-text;
@@ -671,35 +671,41 @@
       color: @color-bi-text;
     }
     background-color: @color-bi-background-highlight;
+    & .bi-high-light {
+      color: @color-bi-text;
     }
-  &.disabled {
-    &, &:hover, &:active {
-      background-color: transparent !important;
-      color: @color-bi-text-disabled !important;
+  }
+  &.button-warning {
+    & {
+      color: @color-bi-text-failure;
       & .bi-input {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text-failure;
       }
       & .bi-textarea {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text-failure;
       }
       & .bi-high-light {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text-failure;
       }
+      &.bi-high-light-border{
+        border-color: @color-bi-border-failure;
       }
     }
-}
-
-//有选中效果
-.bi-list-item-select {
     &:hover, &.hover {
-    color: @color-bi-text-black;
+      color: @color-bi-text-failure;
       & .bi-input {
-      color: @color-bi-text-black;
+        color: @color-bi-text-failure;
       }
       & .bi-textarea {
-      color: @color-bi-text-black;
+        color: @color-bi-text-failure;
+      }
+      background-color: @color-bi-background-light-failure;
+      & .bi-high-light {
+        color: @color-bi-text-failure;
+      }
+      &.bi-high-light-border{
+        border-color: @color-bi-border-failure;
       }
-    .background-color(@color-bi-background-black, 5%);
     }
     &:active, &.active {
       color: @color-bi-text;
@@ -709,10 +715,14 @@
       & .bi-textarea {
         color: @color-bi-text;
       }
-    background-color: @color-bi-background-highlight;
+      background-color: @color-bi-background-failure;
       & .bi-high-light {
         color: @color-bi-text;
       }
+      &.bi-high-light-border{
+        border-color: @color-bi-border-failure;
+      }
+    }
   }
   &.disabled {
     &, &:hover, &:active {
@@ -727,6 +737,9 @@
       & .bi-high-light {
         color: @color-bi-text-disabled !important;
       }
+      &.bi-high-light-border{
+        border-color: @color-bi-border-disabled;
+      }
     }
   }
 }