全局样式

bi/base.css

@@ -1107,6 +1107,16 @@ li.CodeMirror-hint-active {
 .bi-collection-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-collection-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
@@ -1169,6 +1179,33 @@ li.CodeMirror-hint-active {
   border-top: 1px solid #eaeaea;
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-table > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-right > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-right > div > div > table {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > table > thead > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > thead > tr > td {
+  border-top: 1px solid #24273e;
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
@@ -1190,6 +1227,16 @@ li.CodeMirror-hint-active {
 .bi-grid-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-grid-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/

bi/widget.css

@@ -277,19 +277,19 @@
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-multi-select-check-pane .multi-select-continue-select {
+.bi-multi-select-check-pane {
   background-color: #f4f4f4;
 }
 .bi-multi-select-check-pane .multi-select-check-selected {
   color: #009de3;
   text-decoration: underline;
 }
+.bi-theme-dark .bi-multi-select-check-pane {
+  background-color: #191a2c;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-display-list {
-  background-color: #f4f4f4;
-}
 .bi-display-list .display-list-item {
   color: #808080;
 }

docs/base.css

@@ -1107,6 +1107,16 @@ li.CodeMirror-hint-active {
 .bi-collection-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-collection-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
@@ -1169,6 +1179,33 @@ li.CodeMirror-hint-active {
   border-top: 1px solid #eaeaea;
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-table > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-right > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-right > div > div > table {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > table > thead > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > thead > tr > td {
+  border-top: 1px solid #24273e;
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
@@ -1190,6 +1227,16 @@ li.CodeMirror-hint-active {
 .bi-grid-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-grid-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/

docs/widget.css

@@ -277,19 +277,19 @@
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-multi-select-check-pane .multi-select-continue-select {
+.bi-multi-select-check-pane {
   background-color: #f4f4f4;
 }
 .bi-multi-select-check-pane .multi-select-check-selected {
   color: #009de3;
   text-decoration: underline;
 }
+.bi-theme-dark .bi-multi-select-check-pane {
+  background-color: #191a2c;
+}
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-display-list {
-  background-color: #f4f4f4;
-}
 .bi-display-list .display-list-item {
   color: #808080;
 }

src/css/base/table/table.collection.cell.css

@@ -19,3 +19,13 @@
 .bi-collection-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-collection-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-collection-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}

src/css/base/table/table.css

@@ -52,3 +52,30 @@
   border-top: 1px solid #eaeaea;
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-table > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.top-right > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-left > div > div > table {
+  border-bottom: 1px solid #24273e;
+  border-right: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div.bottom-right > div > div > table {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-table > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > tbody > tr > td,
+.bi-theme-dark .bi-table > div > div > table > thead > tr > td,
+.bi-theme-dark .bi-table > div > div > div > table > thead > tr > td {
+  border-top: 1px solid #24273e;
+  border-left: 1px solid #24273e;
+}

src/css/base/table/table.grid.cell.css

@@ -19,3 +19,13 @@
 .bi-grid-table-cell.first-col {
   border-left: 1px solid #eaeaea;
 }
+.bi-theme-dark .bi-grid-table-cell {
+  border-right: 1px solid #24273e;
+  border-bottom: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-row {
+  border-top: 1px solid #24273e;
+}
+.bi-theme-dark .bi-grid-table-cell.first-col {
+  border-left: 1px solid #24273e;
+}

src/css/widget/multiselect/check/multiselect.check.pane.css

@@ -1,10 +1,13 @@
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-multi-select-check-pane .multi-select-continue-select {
+.bi-multi-select-check-pane {
   background-color: #f4f4f4;
 }
 .bi-multi-select-check-pane .multi-select-check-selected {
   color: #009de3;
   text-decoration: underline;
 }
+.bi-theme-dark .bi-multi-select-check-pane {
+  background-color: #191a2c;
+}

src/css/widget/multiselect/check/multiselect.display.css

@@ -1,9 +1,6 @@
 /****添加计算宽度的--运算符直接需要space****/
 /****** common color(常用颜色,可用于普遍场景) *****/
 /**** custom color(自定义颜色,用于特定场景) ****/
-.bi-display-list {
-  background-color: #f4f4f4;
-}
 .bi-display-list .display-list-item {
   color: #808080;
 }

src/less/base/table/table.collection.cell.less

@@ -11,3 +11,15 @@
     border-left: 1px solid @border-color-line;
   }
 }
+.bi-theme-dark{
+  .bi-collection-table-cell{
+    border-right: 1px solid @border-color-line-theme-dark;
+    border-bottom: 1px solid @border-color-line-theme-dark;
+    &.first-row {
+      border-top: 1px solid @border-color-line-theme-dark;
+    }
+    &.first-col {
+      border-left: 1px solid @border-color-line-theme-dark;
+    }
+  }
+}

src/less/base/table/table.grid.cell.less

@@ -11,3 +11,15 @@
     border-left: 1px solid @border-color-line;
   }
 }
+.bi-theme-dark{
+  .bi-grid-table-cell{
+    border-right: 1px solid @border-color-line-theme-dark;
+    border-bottom: 1px solid @border-color-line-theme-dark;
+    &.first-row {
+      border-top: 1px solid @border-color-line-theme-dark;
+    }
+    &.first-col {
+      border-left: 1px solid @border-color-line-theme-dark;
+    }
+  }
+}

src/less/base/table/table.less

@@ -77,3 +77,35 @@
     }
   }
 }
+
+.bi-theme-dark {
+  .bi-table {
+    & > div > div > table {
+      border-bottom: 1px solid @border-color-line-theme-dark;
+      border-right: 1px solid @border-color-line-theme-dark;
+    }
+    & > div.top-left > div > div > table {
+      border-bottom: 1px solid @border-color-line-theme-dark;
+      border-right: 1px solid @border-color-line-theme-dark;
+    }
+    & > div.top-right > div > div > table {
+      border-bottom: 1px solid @border-color-line-theme-dark;
+      border-right: 1px solid @border-color-line-theme-dark;
+    }
+    & > div.bottom-left > div > div > table {
+      border-bottom: 1px solid @border-color-line-theme-dark;
+      border-right: 1px solid @border-color-line-theme-dark;
+    }
+    & > div.bottom-right > div > div > table {
+      border-right: 1px solid @border-color-line-theme-dark;
+      border-bottom: 1px solid @border-color-line-theme-dark;
+    }
+
+    & > div > div > table, & > div > div > div > table {
+      & > tbody > tr > td, & > thead > tr > td {
+        border-top: 1px solid @border-color-line-theme-dark;
+        border-left: 1px solid @border-color-line-theme-dark;
+      }
+    }
+  }
+}

src/less/lib/colors.less

@@ -6,7 +6,7 @@
 //默认字体颜色
 @color-bi-text-black: @font-color-normal;
 //深色主题默认字体颜色
-@color-bi-text-theme-dark: #b2b2b2;
+@color-bi-text-theme-dark: @font-color-normal-theme-dark;
 //深灰色字体颜色
 @color-bi-text-dark: @font-color-dark;
 //灰色字体颜色
@@ -28,11 +28,11 @@
 
 //普通背景
 @color-bi-background-normal: @background-color-normal;
-@color-bi-background-normal-theme-dark: #191A2C;
+@color-bi-background-normal-theme-dark: @background-color-normal-theme-dark;
 //默认背景
 @color-bi-background-default: @background-color-default;
 //深色主题默认背景
-@color-bi-background-default-theme-dark: #202237;
+@color-bi-background-default-theme-dark: @background-color-default-theme-dark;
 //黑色背景
 @color-bi-background-black: @background-color-black;
 //深灰色背景
@@ -77,6 +77,8 @@
 @color-bi-border-outline: @border-color-outline;
 //边框线颜色
 @color-bi-border-line: @border-color-line;
+//深色系边框线色
+@color-bi-border-line-theme-dark: @border-color-line-theme-dark;
 //成功边框色
 @color-bi-border-success: @border-color-success;
 //失败边框色

src/less/lib/constant.less

@@ -16,6 +16,7 @@
 
 //font color
 @font-color-normal: #1a1a1a;
+@font-color-normal-theme-dark: #b2b2b2;
 @font-color-disabled: #c4c6c6;
 @font-color-tips: #c4c6c6;
 @font-color-dark: #d4dadd;
@@ -36,7 +37,9 @@
 @background-color-black: #1a1a1a;
 @background-color-light: #eaeaea;
 @background-color-default: #ffffff;
+@background-color-default-theme-dark: #202237;
 @background-color-normal: #f3f3f3;
+@background-color-normal-theme-dark: #191A2C;
 @background-color-active: #f4f4f4;
 @background-color-highlight: #009de3;
 @background-color-dark: #d4dadd;
@@ -61,6 +64,7 @@
 @border-color-black: #1a1a1a;
 @border-color-normal: #d4dadd;
 @border-color-line: #eaeaea;
+@border-color-line-theme-dark: #24273E;
 @border-color-main: #d3d9dc;
 @border-color-outline: #009de3;
 @border-color-highlight: #178cdf;

src/less/widget/multiselect/check/multiselect.check.pane.less

@@ -1,12 +1,15 @@
 @import "../../../bibase";
 
-
 .bi-multi-select-check-pane {
-  & .multi-select-continue-select{
   background-color: @color-bi-background-gray;
-  }
   & .multi-select-check-selected {
     color: @color-bi-text-highlight;
     text-decoration: underline;
   }
 }
+
+.bi-theme-dark {
+  .bi-multi-select-check-pane {
+    background-color: @color-bi-background-normal-theme-dark;
+  }
+}

src/less/widget/multiselect/check/multiselect.display.less

@@ -1,7 +1,6 @@
 @import "../../../bibase";
 
 .bi-display-list {
-    background-color: @color-bi-background-gray;
   & .display-list-item {
     color: @color-bi-text-gray;
   }