KERNEL-9882 提less变量2

3 years ago · 3ab8fceb9b
37 changed files with 214 additions and 107 deletions
--- a/src/less/base/colorchooser/colorchooser.popup.less
+++ b/src/less/base/colorchooser/colorchooser.popup.less
@ -3,6 +3,6 @@
 .bi-color-chooser-popup {
  & .disable-mask {
    .opacity(0.5);
-    background-color: @color-bi-background-default;
+    background-color: @color-bi-background-disabled-chooser-popup-mask;
  }
 }
--- a/src/less/base/colorchooser/colorpicker/button.colorpicker.less
+++ b/src/less/base/colorchooser/colorpicker/button.colorpicker.less
@ -2,7 +2,7 @@

 .bi-color-picker-button {
  & .color-picker-button-mask {
-    border: 1px solid @color-bi-border-black;
+    border: 1px solid @color-bi-border-picker-button-mask;
  }
 }

@ -10,7 +10,7 @@
 .bi-theme-dark {
  .bi-color-picker-button {
    & .color-picker-button-mask {
-      border: 1px solid @color-bi-border-default;
+      border: 1px solid @color-bi-border-picker-button-mask-theme-dark;
    }
  }
 }
--- a/src/less/base/colorchooser/colorpicker/button.colorshow.less
+++ b/src/less/base/colorchooser/colorpicker/button.colorshow.less
@ -2,6 +2,6 @@

 .bi-color-chooser-show-button {
  &.active, &:active {
-    border-color: @color-bi-border-highlight;
+    border-color: @color-bi-border-active-chooser-show-button;
  }
 }
--- a/src/less/base/combo/combo.bubble.less
+++ b/src/less/base/combo/combo.bubble.less
@ -27,7 +27,7 @@
  }
  & .bubble-combo-triangle-left, & .bubble-combo-triangle-right, & .bubble-combo-triangle-top, & .bubble-combo-triangle-bottom {
    &:before {
-      background-color: @color-bi-background-default;
+      background-color: @color-bi-background-bubble-combo-triangle;
    }
  }
 }
@ -78,7 +78,7 @@
      height: 10px;
      position: absolute;
      content: "";
-      background: @color-bi-background-default;
+      background: @color-bi-background-bubble-combo-triangle;
      top: 0;
      left: 0;
      transition: transform 0.2s ease-out 0s, visibility 0.2s ease-out 0s;
@ -92,14 +92,14 @@

 .bi-theme-dark {
  .bubble-arrow:before {
-    background: @color-bi-background-default-theme-dark;
+    background: @color-bi-background-bubble-combo-triangle-theme-dark;
  }
  .bi-bubble-combo {
    & .bubble-combo-triangle-left, & .bubble-combo-triangle-right, & .bubble-combo-triangle-top, & .bubble-combo-triangle-bottom {
      &:before {
-        background-color: @color-bi-background-default-theme-dark;
-        border-bottom: 1px solid @border-color-light-line-theme-dark;
-        border-right: 1px solid @border-color-light-line-theme-dark;
+        background-color: @color-bi-background-bubble-combo-triangle-theme-dark;
+        border-bottom: 1px solid @color-bi-border-bubble-combo-triangle-theme-dark;
+        border-right: 1px solid @color-bi-border-bubble-combo-triangle-theme-dark;
      }
    }
  }
--- a/src/less/base/combo/combo.less
+++ b/src/less/base/combo/combo.less
@ -23,13 +23,13 @@
  }
  &.bi-combo-popup, &.bi-combo-hover, &:hover {
    &.bi-border {
-      border-color: @color-bi-border-highlight;
+      border-color: @color-bi-border-hover-combo;
    }
  }
  &.disabled {
    &.bi-combo-hover, &:hover {
      &.bi-border {
-        border-color: @color-bi-border-line;
+        border-color: @color-bi-border-hover-disabled-combo;
      }
    }
  }
@ -40,7 +40,7 @@
    &.disabled {
      &.bi-combo-hover, &:hover {
        &.bi-border {
-          border-color: @color-bi-border-line-theme-dark;
+          border-color: @color-bi-border-hover-disabled-combo-theme-dark;
        }
      }
    }
--- a/src/less/base/combo/combo.searchtextvalue.less
+++ b/src/less/base/combo/combo.searchtextvalue.less
@ -10,7 +10,7 @@
  &.combo-error {
    & .bi-search-text-value-trigger{
      & .bi-text-button {
-        color: @color-bi-text-failure;
+        color: @color-bi-text-error-hover-search-text-value-combo;
      }
    }
  }
--- a/src/less/base/combo/combo.textvalue.icon.less
+++ b/src/less/base/combo/combo.textvalue.icon.less
@ -4,7 +4,7 @@
  &.combo-error {
    & .bi-text-trigger {
      & .select-text-label{
-        color: @color-bi-text-failure;
+        color: @color-bi-text-error-hover-text-value-icon-combo;
      }
    }
  }
--- a/src/less/base/combo/combo.textvalue.less
+++ b/src/less/base/combo/combo.textvalue.less
@ -4,7 +4,7 @@
  &.combo-error {
    & .bi-select-text-trigger {
      & .select-text-label {
-        color: @color-bi-text-failure;
+        color: @color-bi-text-error-hover-text-value-combo;
      }
    }
  }
--- a/src/less/base/combo/combo.textvaluecheck.less
+++ b/src/less/base/combo/combo.textvaluecheck.less
@ -3,7 +3,7 @@
 .bi-text-value-check-combo {
  &.bi-combo-popup, &:hover {
    & > .bi-border {
-      border-color: @color-bi-border-highlight;
+      border-color: @color-bi-border-hover-text-value-check-combo;
    }
  }
 }
--- a/src/less/base/combo/combo.textvaluedownlist.less
+++ b/src/less/base/combo/combo.textvaluedownlist.less
@ -3,7 +3,7 @@
 .bi-text-value-down-list-combo {
  &.bi-combo-popup, &:hover {
    & > .bi-border {
-      border-color: @color-bi-border-highlight;
+      border-color: @color-bi-border-hover-text-value-down-list-combo;
    }
  }
 }
--- a/src/less/base/loader/sort.list.less
+++ b/src/less/base/loader/sort.list.less
@ -1,5 +1,5 @@
@import "../../index";

 .bi-sortable-holder {
-  border: 1px dashed @color-bi-border-line;
+  border: 1px dashed @color-bi-border-sortable-holder;
 }
--- a/src/less/base/pager/pager.all.count.less
+++ b/src/less/base/pager/pager.all.count.less
@ -8,6 +8,6 @@
    font-size: @font-size-16;
  }
  & .row-count {
-    color: @color-bi-text-highlight;
+    color: @color-bi-text-all-count-pager-row-count;
  }
 }
--- a/src/less/base/pane.less
+++ b/src/less/base/pane.less
@ -7,7 +7,7 @@
        min-height: 55px;
    }
    & .loading-container {
-        .background-color(@color-bi-background-normal, 0);
+        .background-color(@color-bi-background-pane-loading, 0);
    }
 }

@ -15,7 +15,7 @@
    font-size: 0;
    // 直接控制div标签将会导致使用div的table布局样式问题
    & .animate-rect {
-        .background-color(@background-color-highlight, 90%);
+        .background-color(@color-bi-background-pane-animate-rect, 90%);
        .border-radius(1.5px);
        .animation(loading-widget 0.8s infinite linear);
    }
--- a/src/less/base/segment/button.segment.less
+++ b/src/less/base/segment/button.segment.less
@ -1,5 +1,5 @@
@import "../../index";

 .bi-segment-button {
-  color: @color-bi-text-highlight;
+  color: @color-bi-text-segment-button;
 }
--- a/src/less/base/segment/segment.less
+++ b/src/less/base/segment/segment.less
@ -3,19 +3,19 @@
 .bi-segment{
  & > .center-element{
    .overflow-hidden();
-    border-right: 1px solid @color-bi-border-highlight;
-    border-top: 1px solid @color-bi-border-highlight;
-    border-bottom: 1px solid @color-bi-border-highlight;
+    border-right: 1px solid @color-bi-split-segment;
+    border-top: 1px solid @color-bi-split-segment;
+    border-bottom: 1px solid @color-bi-split-segment;
  }
  & > .first-element{
-    border-left: 1px solid @color-bi-border-highlight;
+    border-left: 1px solid @color-bi-split-segment;
    .border-corner-radius(2px,0px,0px,2px)
  }
  & > .last-element{
    .border-corner-radius(0px,2px,2px,0px)
  }
  &.disabled > .center-element, &.disabled > .first-element{
-    border-color: @color-bi-border-disabled;
+    border-color: @color-bi-split-disabled-segment;
  }
 }

@ -23,12 +23,12 @@
  .bi-segment {
    & > .center-element{
      .overflow-hidden();
-      border-right: 1px solid @color-bi-border-line-theme-dark;
-      border-top: 1px solid @color-bi-border-line-theme-dark;
-      border-bottom: 1px solid @color-bi-border-line-theme-dark;
+      border-right: 1px solid @color-bi-split-segment-theme-dark;
+      border-top: 1px solid @color-bi-split-segment-theme-dark;
+      border-bottom: 1px solid @color-bi-split-segment-theme-dark;
    }
    & > .first-element{
-      border-left: 1px solid @color-bi-border-line-theme-dark;
+      border-left: 1px solid @color-bi-split-segment-theme-dark;
    }
  }
 }
--- a/src/less/base/single/button/button.half.less
+++ b/src/less/base/single/button/button.half.less
@ -9,7 +9,7 @@
    top: 2px;
    width: 8px;
    height: 8px;
-    background-color: @color-bi-background-highlight;
+    background-color: @color-bi-background-half-button-content;
    content: '';
  }
 }
--- a/src/less/base/single/button/button.less
+++ b/src/less/base/single/button/button.less
@ -38,31 +38,31 @@ body .bi-button, #body .bi-button {
  }
  &.button-common {
    &, & .b-font:before {
-      color: @color-bi-text;
+      color: @color-bi-text-common-button;
    }
    &.clear, &.clear .b-font:before {
-      color: @color-bi-text-highlight;
+      color: @color-bi-text-common-clear-button;
    }
    &.ghost{
      &, & .b-font:before{
-        color: @color-bi-text-highlight;
+        color: @color-bi-text-common-ghost-button;
      }
      &:hover{
        color: @color-bi-text;
-        background-color: @color-bi-background-highlight;
+        background-color: @color-bi-background-hover-common-ghost-button;
      }
      &:active{
-        background-color: @color-bi-background-highlight;
+        background-color: @color-bi-background-active-common-ghost-button;
      }
    }
  }
  &.button-ignore {
    & {
      &, & .b-font:before {
-        color: @color-bi-text-highlight;
+        color: @color-bi-text-ignore-button;
      }
      background-color: transparent;
-      border-color: @color-bi-border-highlight;
+      border-color: @color-bi-border-ignore-button;
    }
    &.clear {
      background-color: transparent;
@ -72,14 +72,14 @@ body .bi-button, #body .bi-button {
  &.button-success {
    & {
      &, & .b-font:before {
-        color: @color-bi-text;
+        color: @color-bi-text-success-button;
      }
-      background-color: @color-bi-background-success;
-      border-color: @color-bi-border-success;
+      background-color: @color-bi-background-success-button;
+      border-color: @color-bi-border-success-button;
    }
    &.clear {
      &, & .b-font:before {
-        color: @color-bi-text-success;
+        color: @color-bi-text-success-clear-button;
      }
      background-color: transparent;
      border-width: 0;
@ -88,14 +88,14 @@ body .bi-button, #body .bi-button {
  &.button-warning {
    & {
      &, & .b-font:before {
-        color: @color-bi-text;
+        color: @color-bi-text-warning-button;
      }
-      background-color: @color-bi-background-warning;
-      border-color: @color-bi-border-warning;
+      background-color: @color-bi-background-warning-button;
+      border-color: @color-bi-border-warning-button;
    }
    &.clear {
      &, & .b-font:before {
-        color: @color-bi-text-redmark;
+        color: @color-bi-text-warning-clear-button;
      }
      background-color: transparent;
      border-width: 0;
@ -104,14 +104,14 @@ body .bi-button, #body .bi-button {
  &.button-error {
    & {
      &, & .b-font:before {
-        color: @color-bi-text;
+        color: @color-bi-text-error-button;
      }
-      background-color: @color-bi-background-failure;
-      border-color: @color-bi-border-failure;
+      background-color: @color-bi-background-error-button;
+      border-color: @color-bi-border-error-button;
    }
    &.clear {
      &, & .b-font:before {
-        color: @color-bi-text-failure;
+        color: @color-bi-text-clear-error-button;
      }
      background-color: transparent;
      border-width: 0;
@ -123,12 +123,12 @@ body .bi-button, #body .bi-button {
  &.button-warning.disabled {
    &, &.base-disabled {
      &, & .b-font:before {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text-disabled-button !important;
      }
-      background-color: fade(@color-bi-background-light-disabled, 20%) !important;
-      @ieColor: argb(fade(@color-bi-background-light-disabled, 20%));
+      background-color: fade(@color-bi-background-disabled-button, 20%) !important;
+      @ieColor: argb(fade(@color-bi-background-disabled-button, 20%));
      filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=@{ieColor},endColorstr=@{ieColor})";
-      border-color: @color-bi-border-disabled !important;
+      border-color: @color-bi-border-disabled-button !important;
    }
    &:after {
      display: none;
@ -136,10 +136,10 @@ body .bi-button, #body .bi-button {
  }
  &.button-ignore.disabled {
    &, & .b-font:before {
-      color: @color-bi-text-disabled !important;
+      color: @color-bi-text-disabled-ignore-button !important;
    }
-    background: @color-bi-background-default !important;
-    border-color: @color-bi-border-line !important;
+    background: @color-bi-background-disabled-ignore-button !important;
+    border-color: @color-bi-border-disabled-ignore-button !important;
    &:after {
      display: none;
    }
@ -151,7 +151,7 @@ body .bi-button, #body .bi-button {
  &.button-ignore.disabled {
    &.clear {
      &, & .b-font:before {
-        color: @color-bi-text-disabled !important;
+        color: @color-bi-text-disabled-ignore-clear-button !important;
      }
      background: transparent !important;
      border-width: 0 !important;
@ -161,10 +161,10 @@ body .bi-button, #body .bi-button {
    }
    &.ghost {
      &, & .b-font:before {
-        color: @color-bi-text-highlight !important;
+        color: @color-bi-text-disabled-ignore-ghost-button !important;
      }
      background: transparent !important;
-      border-color: @color-bi-text-highlight !important;
+      border-color: @color-bi-border-disabled-ignore-ghost-button !important;
      .opacity(0.5);
    }
  }
@ -198,7 +198,7 @@ body .bi-button, #body .bi-button {
    &:hover{
      & .bi-button-mask {
        .opacity(0.1);
-        background-color: @color-bi-background-default;
+        background-color: @color-bi-background-hover-button-mask;
        .transition(@hoverVal);
      }
    }
@ -206,7 +206,7 @@ body .bi-button, #body .bi-button {
  &.button-ignore {
    &:after {
      content: "";
-      background-color: @color-bi-background-highlight;
+      background-color: @color-bi-background-ignore-button-mask;
      .border-radius(10px);
      display: block;
      width: 100%;
@ -228,7 +228,7 @@ body .bi-button, #body .bi-button {
      .transition(@activeStopVal)
    }
    &:hover{
-      background-color: @color-bi-blue-10;
+      background-color: @color-bi-background-hover-ignore-button-mask;
      .transition(@hoverVal);
    }
  }
@ -242,33 +242,33 @@ body .bi-button, #body .bi-button {
    &.button-common {
      &.ghost{
        &, & .b-font:before{
-          color: @color-bi-text;
-          border-color: @color-bi-border-default;
+          color: @color-bi-text-common-ghost-button-theme-dark;
+          border-color: @color-bi-border-common-ghost-button-theme-dark;
        }
        &:hover{
-          color: @color-bi-text-normal;
-          background-color: @color-bi-background-default;
+          color: @color-bi-text-hover-common-ghost-button-theme-dark;
+          background-color: @color-bi-background-hover-common-ghost-button-theme-dark;
        }
        &:active{
-          .background-color(@color-bi-background-default, 90%);
+          .background-color(@color-bi-background-active-common-ghost-button-theme-dark, 90%);
        }
      }
    }
    &.button-ignore {
      &:hover{
-        background-color: @color-bi-blue-10;
+        background-color: @color-bi-background-hover-ignore-button-theme-dark;
      }
      &:active{
-        background-color: @color-bi-blue-10;
+        background-color: @color-bi-background-active-ignore-button-theme-dark;
      }
    }
    &.button-common.disabled{
      &.ghost {
        &, & .b-font:before {
-          color: @color-bi-text !important;
+          color: @color-bi-text-disabled-common-ghost-button-theme-dark !important;
        }
        background: transparent !important;
-        border-color: @color-bi-border-default !important;
+        border-color: @color-bi-border-disabled-common-ghost-button-theme-dark !important;
        .opacity(0.5);
      }
    }
@ -277,8 +277,8 @@ body .bi-button, #body .bi-button {
    &.button-warning.disabled,
    &.button-ignore.disabled {
      &, &.base-disabled {
-        background-color: fade(@color-bi-background-light-disabled-theme-dark, 20%) !important;
-        @ieColor: argb(fade(@color-bi-background-light-disabled-theme-dark, 20%));
+        background-color: fade(@color-bi-background-disabled-button-theme-dark, 20%) !important;
+        @ieColor: argb(fade(@color-bi-background-disabled-button-theme-dark, 20%));
        filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorstr=@{ieColor},endColorstr=@{ieColor})";
      }
    }
--- a/src/less/base/single/button/item.singleselect.icontext.less
+++ b/src/less/base/single/button/item.singleselect.icontext.less
@ -3,7 +3,7 @@
 .bi-single-select-icon-text-item{
  &:active, &.active {
    & .b-font:before {
-      color: @color-bi-text-highlight;
+      color: @color-bi-text-active-single-select-icon-text-item;
    }
  }
 }
--- a/src/less/base/single/input/input.less
+++ b/src/less/base/single/input/input.less
@ -14,6 +14,6 @@

  &.bi-input-error{
    border: none;
-    color:@color-bi-text-failure !important;
+    color:@color-bi-color-error-input-text-area !important;
  }
 }
--- a/src/less/base/tree/tree.display.less
+++ b/src/less/base/tree/tree.display.less
@ -2,7 +2,7 @@

 .bi-display-tree{
  .ztree * {
-    color: @color-bi-text-gray;
+    color: @color-bi-text-display-tree;
  }

  & .ztree li a, & .ztree li span{
--- a/src/less/base/tree/tree.expander.less
+++ b/src/less/base/tree/tree.expander.less
@ -2,7 +2,7 @@
 .bi-tree-expander-popup.line:before {
  position: absolute;
  content: "";
-  border-left: 1px dashed @color-bi-border-dark-gray-line;
+  border-left: 1px dashed @color-bi-border-tree-expander-popup-line;
  height: 100%;
  left: 11px;
 }
--- a/src/less/base/view/popupview.less
+++ b/src/less/base/view/popupview.less
@ -15,12 +15,12 @@
    padding-bottom: 5px;
  }
  & .list-view-shadow {
-    .box-shadow(0 1px 5px 0, fade(@color-bi-background-black, 20));
+    .box-shadow(0 1px 5px 0, fade(@color-bi-background-list-view-shadow, 20));
  }
  & .list-view-toolbar {
    line-height: 24px;
    & > .center-element {
-      border-left: 1px solid @color-bi-border-line;
+      border-left: 1px solid @color-bi-border-list-view-toolbar;
    }
    & > .first-element {
      border-left: none;
--- a/src/less/lib/theme.less
+++ b/src/less/lib/theme.less
@ -14,6 +14,9 @@

 //按钮的mask颜色
@color-bi-background-button-mask: @color-bi-background-black;
+@color-bi-background-hover-button-mask: @color-bi-background-default;
+@color-bi-background-ignore-button-mask: @color-bi-background-highlight;
+@color-bi-background-hover-ignore-button-mask: @color-bi-blue-10;

 //水印字体颜色
@color-bi-text-water-mark: @color-bi-text-tips;
@ -54,6 +57,45 @@
 // 按钮
@color-bi-border-button: @color-bi-border-highlight;
@color-bi-background-button: @color-bi-background-highlight;
+@color-bi-text-common-button: @color-bi-text;
+@color-bi-text-common-clear-button: @color-bi-text-highlight;
+@color-bi-text-common-ghost-button: @color-bi-text-highlight;
+@color-bi-text-common-ghost-button-theme-dark: @color-bi-text;
+@color-bi-text-disabled-common-ghost-button-theme-dark: @color-bi-text;
+@color-bi-border-disabled-common-ghost-button-theme-dark: @color-bi-border-default;
+@color-bi-border-common-ghost-button-theme-dark: @color-bi-border-default;
+@color-bi-background-hover-common-ghost-button: @color-bi-background-highlight;
+@color-bi-text-hover-common-ghost-button-theme-dark: @color-bi-text-normal;
+@color-bi-background-hover-common-ghost-button-theme-dark: @color-bi-background-default;
+@color-bi-background-active-common-ghost-button: @color-bi-background-highlight;
+@color-bi-background-active-common-ghost-button-theme-dark: @color-bi-background-default;
+@color-bi-text-ignore-button: @color-bi-text-highlight;
+@color-bi-border-ignore-button: @color-bi-border-highlight;
+@color-bi-background-hover-ignore-button-theme-dark: @color-bi-blue-10;
+@color-bi-background-active-ignore-button-theme-dark: @color-bi-blue-10;
+@color-bi-text-success-button: @color-bi-text;
+@color-bi-background-success-button: @color-bi-background-success;
+@color-bi-border-success-button: @color-bi-border-success;
+@color-bi-text-success-clear-button: @color-bi-text-success;
+@color-bi-text-warning-button: @color-bi-text;
+@color-bi-background-warning-button: @color-bi-background-warning;
+@color-bi-border-warning-button: @color-bi-border-warning;
+@color-bi-text-warning-clear-button: @color-bi-text-redmark;
+@color-bi-text-error-button: @color-bi-text;
+@color-bi-background-error-button: @color-bi-background-failure;
+@color-bi-border-error-button: @color-bi-border-failure;
+@color-bi-text-clear-error-button: @color-bi-text-failure;
+@color-bi-text-disabled-button: @color-bi-text-disabled;
+@color-bi-background-disabled-button: @color-bi-background-light-disabled;
+@color-bi-border-disabled-button: @color-bi-border-disabled;
+@color-bi-text-disabled-ignore-button: @color-bi-text-disabled;
+@color-bi-background-disabled-ignore-button: @color-bi-background-default;
+@color-bi-border-disabled-ignore-button: @color-bi-border-line;
+@color-bi-text-disabled-ignore-clear-button: @color-bi-text-disabled;
+@color-bi-text-disabled-ignore-ghost-button: @color-bi-text-highlight;
+@color-bi-border-disabled-ignore-ghost-button: @color-bi-border-highlight;
+@color-bi-background-disabled-button-theme-dark: @color-bi-background-light-disabled-theme-dark;
+
 // 单选按钮
@color-bi-border-radio: @color-bi-border-dark-line;
@color-bi-border-radio-theme-dark: @color-bi-border-dark-line-theme-dark;
@ -89,3 +131,68 @@
@color-bi-background-hover-slider-button: @color-bi-background-normal;
@color-bi-border-disabled-slider-button: @color-bi-border-disabled;
@color-bi-background-hover-disabled-slider-button: @color-bi-background-normal;
+@color-bi-background-slider-button-theme-dark: @color-bi-background-default-theme-dark;
+@color-bi-background-hover-slider-button-theme-dark: @color-bi-background-normal-theme-dark;
+@color-bi-background-hover-disabled-slider-button-theme-dark: @color-bi-background-normal-theme-dark;
+@color-bi-background-slider-gray-track: @color-bi-background-light-black;
+@color-bi-background-slider-gray-track-theme-dark: @color-bi-background-light-black-theme-dark;
+@color-bi-background-disabled-slider-blue-track: @color-bi-background-dark-gray;
+@color-bi-background-disabled-slider-blue-track-theme-dark: @color-bi-background-dark-gray-theme-dark;
+// 颜色选择器
+@color-bi-border-picker-button-mask: @color-bi-border-black;
+@color-bi-border-picker-button-mask-theme-dark: @color-bi-border-default;
+@color-bi-border-active-chooser-show-button: @color-bi-border-highlight;
+@color-bi-background-disabled-chooser-popup-mask: @color-bi-background-default;
+// combo
+@color-bi-border-hover-combo: @color-bi-border-highlight;
+@color-bi-border-hover-disabled-combo: @color-bi-border-line;
+@color-bi-border-hover-disabled-combo-theme-dark: @color-bi-border-line-theme-dark;
+@color-bi-border-hover-text-value-down-list-combo: @color-bi-border-highlight;
+@color-bi-border-hover-text-value-check-combo: @color-bi-border-highlight;
+@color-bi-text-error-hover-text-value-combo: @color-bi-text-failure;
+@color-bi-text-error-hover-text-value-icon-combo: @color-bi-text-failure;
+@color-bi-text-error-hover-search-text-value-combo: @color-bi-text-failure;
+@color-bi-background-bubble-combo-triangle: @color-bi-background-default;
+@color-bi-background-bubble-combo-triangle-theme-dark: @color-bi-background-default-theme-dark;
+@color-bi-border-bubble-combo-triangle-theme-dark: @border-color-light-line-theme-dark;
+// 排序列表
+@color-bi-border-sortable-holder: @color-bi-border-line;
+// 分页
+@color-bi-text-all-count-pager-row-count: @color-bi-text-highlight;
+// segment
+@color-bi-text-segment-button: @color-bi-text-highlight;
+@color-bi-split-segment: @color-bi-border-highlight;
+@color-bi-split-segment-theme-dark: @color-bi-border-line-theme-dark;
+@color-bi-split-disabled-segment: @color-bi-border-disabled;
+// 半选
+@color-bi-background-half-button-content: @color-bi-background-highlight;
+// items
+@color-bi-text-active-single-select-icon-text-item: @color-bi-text-highlight;
+// editor
+@color-bi-color-error-input-text-area: @color-bi-text-failure;
+// tree
+@color-bi-text-display-tree: @color-bi-text-gray;
+@color-bi-border-tree-expander-popup-line: @color-bi-border-dark-gray-line;
+// popup
+@color-bi-background-list-view-shadow: @color-bi-background-black;
+@color-bi-border-list-view-toolbar: @color-bi-border-line;
+// pane
+@color-bi-background-pane-loading: @color-bi-background-normal;
+@color-bi-background-pane-animate-rect: @background-color-highlight;
+// interactive arrangement
+@color-bi-background-interactive-arrangement-dragtag-line: @color-bi-text-redmark;
+// 复选下拉
+@color-bi-text-multi-select-search-pane-toolbar: @color-bi-text-redmark;
+@color-bi-text-error-multi-select-trigger: @color-bi-text-failure;
+// 复选树
+@color-bi-text-multi-tree-check-pane-check-button: @color-bi-text-highlight;
+// 单选下拉
+@color-bi-text-single-select-search-pane-toolbar: @color-bi-text-redmark;
+// 时间控件
+@color-bi-text-error-date-interval: @color-bi-text-failure;
+@color-bi-text-error-time-interval: @color-bi-text-failure;
+@color-bi-border-year-popup: @color-bi-border-line;
+@color-bi-border-year-popup-theme-dark: @color-bi-border-line-theme-dark;
+@color-bi-text-error-year-interval: @color-bi-text-failure;
+@color-bi-text-error-year-month-interval: @color-bi-text-failure;
+@color-bi-text-error-year-quarter-interval: @color-bi-text-failure;
--- a/src/less/widget/interactivearrangement/interactivearrangement.less
+++ b/src/less/widget/interactivearrangement/interactivearrangement.less
@ -3,7 +3,7 @@
 .bi-interactive-arrangement {
  & .interactive-arrangement-dragtag-line {
    z-index: @zIndex-tip;
-    background-color: @color-bi-text-redmark;
+    background-color: @color-bi-background-interactive-arrangement-dragtag-line;
  }
  & .interactive-arrangement-dragtag-icon {
    z-index: @zIndex-tip;
--- a/src/less/widget/multiselect/search/multiselect.search.pane.less
+++ b/src/less/widget/multiselect/search/multiselect.search.pane.less
@ -3,6 +3,6 @@

 .bi-multi-select-search-pane{
  .multi-select-toolbar{
-    color: @color-bi-text-redmark;
+    color: @color-bi-text-multi-select-search-pane-toolbar;
  }
 }
--- a/src/less/widget/multitree/check/multi.tree.check.pane.less
+++ b/src/less/widget/multitree/check/multi.tree.check.pane.less
@ -4,6 +4,6 @@
  & .multi-tree-continue-select {
  }
  & .multi-tree-check-selected {
-    color: @color-bi-text-highlight;
+    color: @color-bi-text-multi-tree-check-pane-check-button;
  }
 }
--- a/src/less/widget/multitree/trigger/multi.tree.button.checkselected.less
+++ b/src/less/widget/multitree/trigger/multi.tree.button.checkselected.less
@ -2,7 +2,7 @@

 .bi-multi-tree-check-selected-button {
  & .trigger-check-selected{
-    color: @color-bi-text-highlight;
+    color: @color-bi-text-multi-tree-check-pane-check-button;
    z-index: 1;
  }
  .trigger-check-text {
--- a/src/less/widget/searchmultiselect/searchmultiselect.less
+++ b/src/less/widget/searchmultiselect/searchmultiselect.less
@ -7,7 +7,7 @@
  &.combo-error {
    & .bi-multi-select-searcher {
      & .tip-text-style{
-        color: @color-bi-text-failure;
+        color: @color-bi-text-error-multi-select-trigger;
      }
    }
  }
--- a/src/less/widget/singleselect/search/singleselect.search.pane.less
+++ b/src/less/widget/singleselect/search/singleselect.search.pane.less
@ -3,6 +3,6 @@

 .bi-single-select-search-pane{
  & .single-select-toolbar{
-    color: @color-bi-text-redmark;
+    color: @color-bi-text-single-select-search-pane-toolbar;
  }
 }
--- a/src/less/widget/singleslider/slider/widget.slider.less
+++ b/src/less/widget/singleslider/slider/widget.slider.less
@ -35,13 +35,13 @@
 .bi-theme-dark {
  .bi-single-slider-button {
    & .slider-button {
-      background-color: @color-bi-background-default-theme-dark;
+      background-color: @color-bi-background-slider-button;
      &:hover, &.hover {
-        background-color: @color-bi-background-normal-theme-dark;
+        background-color: @color-bi-background-hover-slider-button-theme-dark;
      }
      &.disabled {
        &:hover, &.hover {
-          background-color: @color-bi-background-normal-theme-dark;
+          background-color: @color-bi-background-hover-disabled-slider-button-theme-dark;
        }
      }
    }
--- a/src/less/widget/singleslider/track/widget.track.less
+++ b/src/less/widget/singleslider/track/widget.track.less
@ -2,14 +2,14 @@

 .bi-slider-track {
  & .gray-track {
-    .background-color(@color-bi-background-light-black, 10%);
+    .background-color(@color-bi-background-slider-gray-track, 10%);
    .border-radius(3px);
  }
  & .blue-track {
    .border-radius(3px);
  }
  & .disabled-blue-track {
-    background-color: @color-bi-background-dark-gray;
+    background-color: @color-bi-background-disabled-slider-blue-track;
    .border-radius(3px);
  }
 }
@ -17,11 +17,11 @@
 .bi-theme-dark {
  .bi-slider-track {
    & .gray-track {
-      .background-color(@color-bi-background-light-black-theme-dark, 10%);
+      .background-color(@color-bi-background-slider-gray-track-theme-dark, 10%);
      .border-radius(3px);
    }
    & .disabled-blue-track {
-      background-color: @color-bi-background-dark-gray-theme-dark;
+      background-color: @color-bi-background-disabled-slider-blue-track-theme-dark;
      .border-radius(3px);
    }
  }
--- a/src/less/widget/timeinterval/dateinterval.less
+++ b/src/less/widget/timeinterval/dateinterval.less
@ -2,9 +2,9 @@

 .bi-date-interval{
  &.time-error .bi-input{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-date-interval;
  }
  &.time-error .sign-editor-text{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-date-interval;
  }
 }
--- a/src/less/widget/timeinterval/timeinterval.less
+++ b/src/less/widget/timeinterval/timeinterval.less
@ -7,10 +7,10 @@
  &.time-error {
    & .bi-date-time-trigger{
      & .bi-input{
-        color:@color-bi-text-failure
+        color: @color-bi-text-error-time-interval;
      }
      & .sign-editor-text{
-        color:@color-bi-text-failure
+        color: @color-bi-text-error-time-interval;
      }
    }
  }
--- a/src/less/widget/year/popup.year.less
+++ b/src/less/widget/year/popup.year.less
@ -4,7 +4,7 @@
  & .year-popup-navigation {
    line-height: 30px;
    & > .center-element {
-      border-left: 1px solid @color-bi-border-line;
+      border-left: 1px solid @color-bi-border-year-popup;
    }
    & > .first-element {
      border-left: none;
@ -19,7 +19,7 @@
  .bi-year-popup {
    & .year-popup-navigation {
      & > .center-element {
-        border-left: 1px solid @color-bi-border-line-theme-dark;
+        border-left: 1px solid @color-bi-border-year-popup-theme-dark;
      }
      & > .first-element {
        border-left: none;
--- a/src/less/widget/yearinterval/yearinterval.less
+++ b/src/less/widget/yearinterval/yearinterval.less
@ -2,9 +2,9 @@

 .bi-year-interval{
  &.time-error .bi-input{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-interval;
  }
  &.time-error .sign-editor-text{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-interval;
  }
 }
--- a/src/less/widget/yearmonthinterval/yearmonthinterval.less
+++ b/src/less/widget/yearmonthinterval/yearmonthinterval.less
@ -2,9 +2,9 @@

 .bi-year-month-interval{
  &.time-error .bi-input{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-month-interval;
  }
  &.time-error .sign-editor-text{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-month-interval;
  }
 }
--- a/src/less/widget/yearquarterinterval/yearquarterinterval.less
+++ b/src/less/widget/yearquarterinterval/yearquarterinterval.less
@ -2,9 +2,9 @@

 .bi-year-quarter-interval{
  &.time-error .bi-input{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-quarter-interval;
  }
  &.time-error .sign-editor-text{
-    color:@color-bi-text-failure
+    color: @color-bi-text-error-year-quarter-interval;
  }
 }