From b59d7dd6437423874ea2aaffb9f8d79bbf87e443 Mon Sep 17 00:00:00 2001 From: guy Date: Sat, 8 Apr 2017 21:27:04 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=BB=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- bi/base.css | 54 +++++++++++++------ bi/case.js | 2 +- bi/core.css | 24 ++++----- bi/core.js | 20 ++++++- docs/base.css | 54 +++++++++++++------ docs/case.js | 2 +- docs/core.css | 24 ++++----- docs/core.js | 20 ++++++- docs/resource.css | 2 +- src/case/colorchooser/colorchooser.popup.js | 2 +- src/core/func/function.js | 20 ++++++- .../base/colorchooser/colorchooser.popup.css | 7 ++- src/css/base/foundation/bi.message.css | 8 +++ src/css/base/layer/layer.panel.css | 3 ++ src/css/base/table/table.grid.scrollbar.css | 24 +++++---- src/css/base/view/floatboxview.css | 10 ++-- src/css/base/view/popupview.css | 2 +- src/css/core/utils/common.css | 24 ++++----- src/css/resource/app.css | 2 +- .../base/colorchooser/colorchooser.popup.less | 18 +++++-- src/less/base/foundation/bi.message.less | 16 ++++++ src/less/base/layer/layer.panel.less | 12 ++++- src/less/base/table/table.grid.scrollbar.less | 32 +++++++---- src/less/base/view/floatboxview.less | 16 +++--- src/less/base/view/popupview.less | 2 +- src/less/core/utils/common.less | 2 +- src/less/lib/colors.less | 7 +-- src/less/lib/constant.less | 5 ++ src/less/resource/app.less | 4 +- src/less/theme/dark.less | 2 +- .../trigger/button.checkselected.less | 2 +- 31 files changed, 294 insertions(+), 128 deletions(-) diff --git a/bi/base.css b/bi/base.css index 239c28f0b..3243ffdc6 100644 --- a/bi/base.css +++ b/bi/base.css @@ -11,8 +11,11 @@ .bi-color-chooser-popup .color-chooser-popup-more { background: #f4f4f4; } -.bi-color-chooser-popup .color-chooser-popup-more:hover { - background: #d4dadd; +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-title { + background: #191a2c; +} +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-more { + background: #191a2c; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -667,6 +670,10 @@ li.CodeMirror-hint-active { font-size: 16px; cursor: pointer; } +.bi-theme-dark .bi-message-title { + background-color: #191a2c; + color: #b2b2b2; +} .bi-message-text { font-size: 16px; -webkit-user-select: text; @@ -681,6 +688,10 @@ li.CodeMirror-hint-active { color: #808080; font-size: 16px; } +.bi-theme-dark .bi-message-content { + background-color: #202237; + color: #b2b2b2; +} .bi-message-close { font-size: 25px; } @@ -698,6 +709,9 @@ li.CodeMirror-hint-active { background: #f4f4f4; border-bottom: 1px solid #d4dadd; } +.bi-theme-dark .bi-popup-panel .popup-panel-title { + background: #191a2c; +} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ @@ -1176,6 +1190,9 @@ li.CodeMirror-hint-active { .bi-grid-table-cell.first-col { border-left: 1px solid #eaeaea; } +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ .scrollbar-layout-main { box-sizing: border-box; outline: none; @@ -1184,10 +1201,13 @@ li.CodeMirror-hint-active { transition-duration: 250ms; transition-timing-function: ease; user-select: none; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; border-radius: 5px; } +.bi-theme-dark .scrollbar-layout-main { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); +} .scrollbar-layout-main-vertical { bottom: 0; right: 0; @@ -1204,8 +1224,11 @@ li.CodeMirror-hint-active { height: 10px; left: 0; transition-property: background-color; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; +} +.bi-theme-dark .scrollbar-layout-main-horizontal { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); } /* Touching the scroll-track directly makes the scroll-track bolder */ .scrollbar-layout-main-horizontal.public-scrollbar-main-active, @@ -1258,7 +1281,7 @@ li.CodeMirror-hint-active { */ /* Touching the scroll-track directly makes the scroll-track bolder */ .public-scrollbar-face:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .bi-theme-dark .public-scrollbar-face:after { background-color: #7d7d7d; @@ -1271,15 +1294,12 @@ li.CodeMirror-hint-active { .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-faceActive:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .horizontal-scrollbar { bottom: 0; position: absolute; } -.horizontal-scrollbar .public-scrollbar-main-horizontal { - background-color: #fff; -} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ @@ -1389,12 +1409,12 @@ li.CodeMirror-hint-active { /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ .bi-float-box { - background: #ffffff; + background-color: #ffffff; + color: #1a1a1a; } -.bi-float-box .float-box-button { - color: #ffffff; - background: #009de3; - border: 1px solid #d4dadd; +.bi-theme-dark .bi-float-box { + background-color: #202237; + color: #b2b2b2; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -1428,5 +1448,5 @@ li.CodeMirror-hint-active { } .bi-theme-dark .bi-list-view .list-view-outer { color: #b2b2b2; - background: #191a2c; + background: #202237; } diff --git a/bi/case.js b/bi/case.js index 1ec01058d..d0c7eff60 100644 --- a/bi/case.js +++ b/bi/case.js @@ -2479,7 +2479,7 @@ BI.ColorChooserPopup = BI.inherit(BI.Widget, { isNeedAdjustHeight: false, el: { type: "bi.text_item", - cls: "color-chooser-popup-more", + cls: "color-chooser-popup-more bi-list-item", textAlign: "center", height: 20, text: BI.i18nText("BI-Basic_More") + "..." diff --git a/bi/core.css b/bi/core.css index 42772d827..8cb3057e8 100644 --- a/bi/core.css +++ b/bi/core.css @@ -3062,29 +3062,29 @@ .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } -.bi-theme-dark .list-item-select:hover, -.bi-theme-dark .list-item-select.hover { +.bi-theme-dark .bi-list-item-select:hover, +.bi-theme-dark .bi-list-item-select.hover { color: #009de3; background-color: #04070d; } -.bi-theme-dark .list-item-select:active, -.bi-theme-dark .list-item-select.active { +.bi-theme-dark .bi-list-item-select:active, +.bi-theme-dark .bi-list-item-select.active { color: #ffffff; background-color: #009de3; } -.bi-theme-dark .list-item-select:active .bi-high-light, -.bi-theme-dark .list-item-select.active .bi-high-light { +.bi-theme-dark .bi-list-item-select:active .bi-high-light, +.bi-theme-dark .bi-list-item-select.active .bi-high-light { color: #ffffff; } -.bi-theme-dark .list-item-select.disabled, -.bi-theme-dark .list-item-select.disabled:hover, -.bi-theme-dark .list-item-select.disabled:active { +.bi-theme-dark .bi-list-item-select.disabled, +.bi-theme-dark .bi-list-item-select.disabled:hover, +.bi-theme-dark .bi-list-item-select.disabled:active { color: #c4c6c6 !important; background-color: transparent !important; } -.bi-theme-dark .list-item-select.disabled .bi-high-light, -.bi-theme-dark .list-item-select.disabled:hover .bi-high-light, -.bi-theme-dark .list-item-select.disabled:active .bi-high-light { +.bi-theme-dark .bi-list-item-select.disabled .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:hover .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } /*****************cursor*****************/ diff --git a/bi/core.js b/bi/core.js index c111edbd8..543d92175 100644 --- a/bi/core.js +++ b/bi/core.js @@ -17007,6 +17007,24 @@ $(function () { }); }, + isColor: function (color) { + return this.isRGBColor(color) || this.isHexColor(color); + }, + + isRGBColor: function (color) { + if (!color) { + return false; + } + return color.substr(0, 3) === "rgb"; + }, + + isHexColor: function (color) { + if (!color) { + return false; + } + return color[0] === "#" && color.length === 7; + }, + isDarkColor: function (hex) { if (!hex) { return false; @@ -17022,7 +17040,7 @@ $(function () { //获取对比颜色 getContrastColor: function (color) { if (this.isDarkColor(color)) { - return "#ffffff"; + return "#b2b2b2"; } return "#1a1a1a"; }, diff --git a/docs/base.css b/docs/base.css index 239c28f0b..3243ffdc6 100644 --- a/docs/base.css +++ b/docs/base.css @@ -11,8 +11,11 @@ .bi-color-chooser-popup .color-chooser-popup-more { background: #f4f4f4; } -.bi-color-chooser-popup .color-chooser-popup-more:hover { - background: #d4dadd; +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-title { + background: #191a2c; +} +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-more { + background: #191a2c; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -667,6 +670,10 @@ li.CodeMirror-hint-active { font-size: 16px; cursor: pointer; } +.bi-theme-dark .bi-message-title { + background-color: #191a2c; + color: #b2b2b2; +} .bi-message-text { font-size: 16px; -webkit-user-select: text; @@ -681,6 +688,10 @@ li.CodeMirror-hint-active { color: #808080; font-size: 16px; } +.bi-theme-dark .bi-message-content { + background-color: #202237; + color: #b2b2b2; +} .bi-message-close { font-size: 25px; } @@ -698,6 +709,9 @@ li.CodeMirror-hint-active { background: #f4f4f4; border-bottom: 1px solid #d4dadd; } +.bi-theme-dark .bi-popup-panel .popup-panel-title { + background: #191a2c; +} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ @@ -1176,6 +1190,9 @@ li.CodeMirror-hint-active { .bi-grid-table-cell.first-col { border-left: 1px solid #eaeaea; } +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ .scrollbar-layout-main { box-sizing: border-box; outline: none; @@ -1184,10 +1201,13 @@ li.CodeMirror-hint-active { transition-duration: 250ms; transition-timing-function: ease; user-select: none; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; border-radius: 5px; } +.bi-theme-dark .scrollbar-layout-main { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); +} .scrollbar-layout-main-vertical { bottom: 0; right: 0; @@ -1204,8 +1224,11 @@ li.CodeMirror-hint-active { height: 10px; left: 0; transition-property: background-color; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; +} +.bi-theme-dark .scrollbar-layout-main-horizontal { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); } /* Touching the scroll-track directly makes the scroll-track bolder */ .scrollbar-layout-main-horizontal.public-scrollbar-main-active, @@ -1258,7 +1281,7 @@ li.CodeMirror-hint-active { */ /* Touching the scroll-track directly makes the scroll-track bolder */ .public-scrollbar-face:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .bi-theme-dark .public-scrollbar-face:after { background-color: #7d7d7d; @@ -1271,15 +1294,12 @@ li.CodeMirror-hint-active { .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-faceActive:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .horizontal-scrollbar { bottom: 0; position: absolute; } -.horizontal-scrollbar .public-scrollbar-main-horizontal { - background-color: #fff; -} /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ @@ -1389,12 +1409,12 @@ li.CodeMirror-hint-active { /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ .bi-float-box { - background: #ffffff; + background-color: #ffffff; + color: #1a1a1a; } -.bi-float-box .float-box-button { - color: #ffffff; - background: #009de3; - border: 1px solid #d4dadd; +.bi-theme-dark .bi-float-box { + background-color: #202237; + color: #b2b2b2; } /****添加计算宽度的--运算符直接需要space****/ /****** common color(常用颜色,可用于普遍场景) *****/ @@ -1428,5 +1448,5 @@ li.CodeMirror-hint-active { } .bi-theme-dark .bi-list-view .list-view-outer { color: #b2b2b2; - background: #191a2c; + background: #202237; } diff --git a/docs/case.js b/docs/case.js index 1ec01058d..d0c7eff60 100644 --- a/docs/case.js +++ b/docs/case.js @@ -2479,7 +2479,7 @@ BI.ColorChooserPopup = BI.inherit(BI.Widget, { isNeedAdjustHeight: false, el: { type: "bi.text_item", - cls: "color-chooser-popup-more", + cls: "color-chooser-popup-more bi-list-item", textAlign: "center", height: 20, text: BI.i18nText("BI-Basic_More") + "..." diff --git a/docs/core.css b/docs/core.css index 42772d827..8cb3057e8 100644 --- a/docs/core.css +++ b/docs/core.css @@ -3062,29 +3062,29 @@ .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } -.bi-theme-dark .list-item-select:hover, -.bi-theme-dark .list-item-select.hover { +.bi-theme-dark .bi-list-item-select:hover, +.bi-theme-dark .bi-list-item-select.hover { color: #009de3; background-color: #04070d; } -.bi-theme-dark .list-item-select:active, -.bi-theme-dark .list-item-select.active { +.bi-theme-dark .bi-list-item-select:active, +.bi-theme-dark .bi-list-item-select.active { color: #ffffff; background-color: #009de3; } -.bi-theme-dark .list-item-select:active .bi-high-light, -.bi-theme-dark .list-item-select.active .bi-high-light { +.bi-theme-dark .bi-list-item-select:active .bi-high-light, +.bi-theme-dark .bi-list-item-select.active .bi-high-light { color: #ffffff; } -.bi-theme-dark .list-item-select.disabled, -.bi-theme-dark .list-item-select.disabled:hover, -.bi-theme-dark .list-item-select.disabled:active { +.bi-theme-dark .bi-list-item-select.disabled, +.bi-theme-dark .bi-list-item-select.disabled:hover, +.bi-theme-dark .bi-list-item-select.disabled:active { color: #c4c6c6 !important; background-color: transparent !important; } -.bi-theme-dark .list-item-select.disabled .bi-high-light, -.bi-theme-dark .list-item-select.disabled:hover .bi-high-light, -.bi-theme-dark .list-item-select.disabled:active .bi-high-light { +.bi-theme-dark .bi-list-item-select.disabled .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:hover .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } /*****************cursor*****************/ diff --git a/docs/core.js b/docs/core.js index 774818b34..36d40e006 100644 --- a/docs/core.js +++ b/docs/core.js @@ -22631,6 +22631,24 @@ $(function () { }); }, + isColor: function (color) { + return this.isRGBColor(color) || this.isHexColor(color); + }, + + isRGBColor: function (color) { + if (!color) { + return false; + } + return color.substr(0, 3) === "rgb"; + }, + + isHexColor: function (color) { + if (!color) { + return false; + } + return color[0] === "#" && color.length === 7; + }, + isDarkColor: function (hex) { if (!hex) { return false; @@ -22646,7 +22664,7 @@ $(function () { //获取对比颜色 getContrastColor: function (color) { if (this.isDarkColor(color)) { - return "#ffffff"; + return "#b2b2b2"; } return "#1a1a1a"; }, diff --git a/docs/resource.css b/docs/resource.css index 958773be0..e0f9d5b7f 100644 --- a/docs/resource.css +++ b/docs/resource.css @@ -109,7 +109,7 @@ textarea::-webkit-scrollbar-thumb { .bi-theme-dark div::-webkit-scrollbar, .bi-theme-dark textarea::-webkit-scrollbar { -webkit-appearance: none; - background-color: #191a2c; + background-color: rgba(255, 255, 255, 0.1); width: 6px; height: 6px; } diff --git a/src/case/colorchooser/colorchooser.popup.js b/src/case/colorchooser/colorchooser.popup.js index cb79bd9d9..4cfac3c29 100644 --- a/src/case/colorchooser/colorchooser.popup.js +++ b/src/case/colorchooser/colorchooser.popup.js @@ -94,7 +94,7 @@ BI.ColorChooserPopup = BI.inherit(BI.Widget, { isNeedAdjustHeight: false, el: { type: "bi.text_item", - cls: "color-chooser-popup-more", + cls: "color-chooser-popup-more bi-list-item", textAlign: "center", height: 20, text: BI.i18nText("BI-Basic_More") + "..." diff --git a/src/core/func/function.js b/src/core/func/function.js index 5ad687db6..0732ef15a 100644 --- a/src/core/func/function.js +++ b/src/core/func/function.js @@ -105,6 +105,24 @@ $(function () { }); }, + isColor: function (color) { + return this.isRGBColor(color) || this.isHexColor(color); + }, + + isRGBColor: function (color) { + if (!color) { + return false; + } + return color.substr(0, 3) === "rgb"; + }, + + isHexColor: function (color) { + if (!color) { + return false; + } + return color[0] === "#" && color.length === 7; + }, + isDarkColor: function (hex) { if (!hex) { return false; @@ -120,7 +138,7 @@ $(function () { //获取对比颜色 getContrastColor: function (color) { if (this.isDarkColor(color)) { - return "#ffffff"; + return "#b2b2b2"; } return "#1a1a1a"; }, diff --git a/src/css/base/colorchooser/colorchooser.popup.css b/src/css/base/colorchooser/colorchooser.popup.css index cfaf63670..1ef4e321f 100644 --- a/src/css/base/colorchooser/colorchooser.popup.css +++ b/src/css/base/colorchooser/colorchooser.popup.css @@ -8,6 +8,9 @@ .bi-color-chooser-popup .color-chooser-popup-more { background: #f4f4f4; } -.bi-color-chooser-popup .color-chooser-popup-more:hover { - background: #d4dadd; +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-title { + background: #191a2c; +} +.bi-theme-dark .bi-color-chooser-popup .color-chooser-popup-more { + background: #191a2c; } diff --git a/src/css/base/foundation/bi.message.css b/src/css/base/foundation/bi.message.css index 1a6c77e76..df2469258 100644 --- a/src/css/base/foundation/bi.message.css +++ b/src/css/base/foundation/bi.message.css @@ -12,6 +12,10 @@ font-size: 16px; cursor: pointer; } +.bi-theme-dark .bi-message-title { + background-color: #191a2c; + color: #b2b2b2; +} .bi-message-text { font-size: 16px; -webkit-user-select: text; @@ -26,6 +30,10 @@ color: #808080; font-size: 16px; } +.bi-theme-dark .bi-message-content { + background-color: #202237; + color: #b2b2b2; +} .bi-message-close { font-size: 25px; } diff --git a/src/css/base/layer/layer.panel.css b/src/css/base/layer/layer.panel.css index 11907bf3c..25faba555 100644 --- a/src/css/base/layer/layer.panel.css +++ b/src/css/base/layer/layer.panel.css @@ -5,3 +5,6 @@ background: #f4f4f4; border-bottom: 1px solid #d4dadd; } +.bi-theme-dark .bi-popup-panel .popup-panel-title { + background: #191a2c; +} diff --git a/src/css/base/table/table.grid.scrollbar.css b/src/css/base/table/table.grid.scrollbar.css index 700a03a17..d6fdfce98 100644 --- a/src/css/base/table/table.grid.scrollbar.css +++ b/src/css/base/table/table.grid.scrollbar.css @@ -1,3 +1,6 @@ +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ .scrollbar-layout-main { box-sizing: border-box; outline: none; @@ -6,10 +9,13 @@ transition-duration: 250ms; transition-timing-function: ease; user-select: none; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; border-radius: 5px; } +.bi-theme-dark .scrollbar-layout-main { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); +} .scrollbar-layout-main-vertical { bottom: 0; right: 0; @@ -26,8 +32,11 @@ height: 10px; left: 0; transition-property: background-color; - background-color: rgba(0, 0, 0, 0.1); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000); + background-color: #f4f4f4; +} +.bi-theme-dark .scrollbar-layout-main-horizontal { + background-color: rgba(255, 255, 255, 0.1); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff); } /* Touching the scroll-track directly makes the scroll-track bolder */ .scrollbar-layout-main-horizontal.public-scrollbar-main-active, @@ -80,7 +89,7 @@ */ /* Touching the scroll-track directly makes the scroll-track bolder */ .public-scrollbar-face:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .bi-theme-dark .public-scrollbar-face:after { background-color: #7d7d7d; @@ -93,12 +102,9 @@ .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-faceActive:after { - background-color: #c2c2c2; + background-color: #e2e2e2; } .horizontal-scrollbar { bottom: 0; position: absolute; } -.horizontal-scrollbar .public-scrollbar-main-horizontal { - background-color: #fff; -} diff --git a/src/css/base/view/floatboxview.css b/src/css/base/view/floatboxview.css index b1d8bc3c4..e10187191 100644 --- a/src/css/base/view/floatboxview.css +++ b/src/css/base/view/floatboxview.css @@ -2,10 +2,10 @@ /****** common color(常用颜色,可用于普遍场景) *****/ /**** custom color(自定义颜色,用于特定场景) ****/ .bi-float-box { - background: #ffffff; + background-color: #ffffff; + color: #1a1a1a; } -.bi-float-box .float-box-button { - color: #ffffff; - background: #009de3; - border: 1px solid #d4dadd; +.bi-theme-dark .bi-float-box { + background-color: #202237; + color: #b2b2b2; } diff --git a/src/css/base/view/popupview.css b/src/css/base/view/popupview.css index 09d70b917..eebfefe89 100644 --- a/src/css/base/view/popupview.css +++ b/src/css/base/view/popupview.css @@ -30,5 +30,5 @@ } .bi-theme-dark .bi-list-view .list-view-outer { color: #b2b2b2; - background: #191a2c; + background: #202237; } diff --git a/src/css/core/utils/common.css b/src/css/core/utils/common.css index 23708de8e..a3d9f990d 100644 --- a/src/css/core/utils/common.css +++ b/src/css/core/utils/common.css @@ -160,28 +160,28 @@ .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } -.bi-theme-dark .list-item-select:hover, -.bi-theme-dark .list-item-select.hover { +.bi-theme-dark .bi-list-item-select:hover, +.bi-theme-dark .bi-list-item-select.hover { color: #009de3; background-color: #04070d; } -.bi-theme-dark .list-item-select:active, -.bi-theme-dark .list-item-select.active { +.bi-theme-dark .bi-list-item-select:active, +.bi-theme-dark .bi-list-item-select.active { color: #ffffff; background-color: #009de3; } -.bi-theme-dark .list-item-select:active .bi-high-light, -.bi-theme-dark .list-item-select.active .bi-high-light { +.bi-theme-dark .bi-list-item-select:active .bi-high-light, +.bi-theme-dark .bi-list-item-select.active .bi-high-light { color: #ffffff; } -.bi-theme-dark .list-item-select.disabled, -.bi-theme-dark .list-item-select.disabled:hover, -.bi-theme-dark .list-item-select.disabled:active { +.bi-theme-dark .bi-list-item-select.disabled, +.bi-theme-dark .bi-list-item-select.disabled:hover, +.bi-theme-dark .bi-list-item-select.disabled:active { color: #c4c6c6 !important; background-color: transparent !important; } -.bi-theme-dark .list-item-select.disabled .bi-high-light, -.bi-theme-dark .list-item-select.disabled:hover .bi-high-light, -.bi-theme-dark .list-item-select.disabled:active .bi-high-light { +.bi-theme-dark .bi-list-item-select.disabled .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:hover .bi-high-light, +.bi-theme-dark .bi-list-item-select.disabled:active .bi-high-light { color: #c4c6c6 !important; } diff --git a/src/css/resource/app.css b/src/css/resource/app.css index 85b8a7464..f1b00ab8b 100644 --- a/src/css/resource/app.css +++ b/src/css/resource/app.css @@ -109,7 +109,7 @@ textarea::-webkit-scrollbar-thumb { .bi-theme-dark div::-webkit-scrollbar, .bi-theme-dark textarea::-webkit-scrollbar { -webkit-appearance: none; - background-color: #191a2c; + background-color: rgba(255, 255, 255, 0.1); width: 6px; height: 6px; } diff --git a/src/less/base/colorchooser/colorchooser.popup.less b/src/less/base/colorchooser/colorchooser.popup.less index a51528852..d5a80edea 100644 --- a/src/less/base/colorchooser/colorchooser.popup.less +++ b/src/less/base/colorchooser/colorchooser.popup.less @@ -1,14 +1,22 @@ @import "../../bibase"; -.bi-color-chooser-popup{ - & .color-chooser-popup-title{ +.bi-color-chooser-popup { + & .color-chooser-popup-title { background: @color-bi-background-gray; border-bottom: 1px solid @color-bi-split-dark; } - & .color-chooser-popup-more{ + & .color-chooser-popup-more { background: @color-bi-background-gray; - &:hover{ - background: @color-bi-background-dark; + } +} + +.bi-theme-dark { + .bi-color-chooser-popup { + & .color-chooser-popup-title { + background: @color-bi-background-normal-theme-dark; + } + & .color-chooser-popup-more { + background: @color-bi-background-normal-theme-dark; } } } \ No newline at end of file diff --git a/src/less/base/foundation/bi.message.less b/src/less/base/foundation/bi.message.less index d063d4e15..84cd82de8 100644 --- a/src/less/base/foundation/bi.message.less +++ b/src/less/base/foundation/bi.message.less @@ -11,16 +11,32 @@ font-size: 16px; cursor: pointer; } + +.bi-theme-dark { + .bi-message-title { + background-color: @color-bi-background-normal-theme-dark; + color: @color-bi-text-theme-dark; + } +} + .bi-message-text { font-size: 16px; .user-select(text); } + .bi-message-content { background-color: @color-bi-background-default; color: @color-bi-text-gray; font-size: 16px; } +.bi-theme-dark { + .bi-message-content { + background-color: @color-bi-background-default-theme-dark; + color: @color-bi-text-theme-dark; + } +} + .bi-message-close { font-size: 25px; } \ No newline at end of file diff --git a/src/less/base/layer/layer.panel.less b/src/less/base/layer/layer.panel.less index 6abe916e0..e041d7267 100644 --- a/src/less/base/layer/layer.panel.less +++ b/src/less/base/layer/layer.panel.less @@ -1,8 +1,16 @@ @import "../../bibase"; -.bi-popup-panel{ - & .popup-panel-title{ +.bi-popup-panel { + & .popup-panel-title { background: @color-bi-background-gray; border-bottom: 1px solid @color-bi-split-dark; } +} + +.bi-theme-dark { + .bi-popup-panel { + & .popup-panel-title { + background: @color-bi-background-normal-theme-dark; + } + } } \ No newline at end of file diff --git a/src/less/base/table/table.grid.scrollbar.less b/src/less/base/table/table.grid.scrollbar.less index de809ce30..6344c92c3 100644 --- a/src/less/base/table/table.grid.scrollbar.less +++ b/src/less/base/table/table.grid.scrollbar.less @@ -1,3 +1,4 @@ +@import "../../bibase"; .scrollbar-layout-main { box-sizing: border-box; outline: none; @@ -6,11 +7,17 @@ transition-duration: 250ms; transition-timing-function: ease; user-select: none; - background-color: rgba(0, 0, 0, 0.1); - filter:~"progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000)"; + background-color: @scroll-color; border-radius: 5px; } +.bi-theme-dark { + .scrollbar-layout-main { + background-color: @scroll-color-theme-dark; + filter:~"progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff)"; + } +} + .scrollbar-layout-main-vertical { bottom: 0; right: 0; @@ -29,8 +36,14 @@ height: 10px; left: 0; transition-property: background-color; - background-color: rgba(0, 0, 0, 0.1); - filter:~"progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000)"; + background-color: @scroll-color; +} + +.bi-theme-dark { + .scrollbar-layout-main-horizontal { + background-color: @scroll-color-theme-dark; + filter:~"progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff)"; + } } /* Touching the scroll-track directly makes the scroll-track bolder */ @@ -103,26 +116,26 @@ } .public-scrollbar-face:after { - background-color: #c2c2c2; + background-color: @scroll-thumb-color; } .bi-theme-dark { .public-scrollbar-face:after { - background-color: #7d7d7d; + background-color: @scroll-thumb-color-theme-dark; } } .public-scrollbar-main:hover .public-scrollbar-face:after, .public-scrollbar-main-active .public-scrollbar-face:after, .public-scrollbar-faceActive:after { - background-color: #7d7d7d; + background-color: @scroll-thumb-focus-color; } .bi-theme-dark { .public-scrollbar-main:hover .public-scrollbar-face:after, .public-scrollbar-main-active .public-scrollbar-face:after, .public-scrollbar-faceActive:after { - background-color: #c2c2c2; + background-color: @scroll-thumb-focus-color-theme-dark; } } @@ -130,8 +143,5 @@ .horizontal-scrollbar { bottom: 0; position: absolute; - & .public-scrollbar-main-horizontal { - background-color: #fff; - } } diff --git a/src/less/base/view/floatboxview.less b/src/less/base/view/floatboxview.less index 962c7f581..161750084 100644 --- a/src/less/base/view/floatboxview.less +++ b/src/less/base/view/floatboxview.less @@ -1,9 +1,13 @@ @import "../../bibase"; -.bi-float-box{ - background: @color-bi-background-default; - & .float-box-button{ - color: @color-bi-text; - background: @color-bi-background-highlight; - border: 1px solid @color-bi-border-normal; + +.bi-float-box { + background-color: @color-bi-background-default; + color: @color-bi-text-black; +} + +.bi-theme-dark { + .bi-float-box { + background-color: @color-bi-background-default-theme-dark; + color: @color-bi-text-theme-dark; } } \ No newline at end of file diff --git a/src/less/base/view/popupview.less b/src/less/base/view/popupview.less index 4894479c5..99b34f13a 100644 --- a/src/less/base/view/popupview.less +++ b/src/less/base/view/popupview.less @@ -30,7 +30,7 @@ .bi-list-view { & .list-view-outer { color: @color-bi-text-theme-dark; - background: @color-bi-background-theme-dark; + background: @color-bi-background-default-theme-dark; } } } \ No newline at end of file diff --git a/src/less/core/utils/common.less b/src/less/core/utils/common.less index 7dd5086ee..0df20df7f 100644 --- a/src/less/core/utils/common.less +++ b/src/less/core/utils/common.less @@ -132,7 +132,7 @@ } .bi-theme-dark { - .list-item-select { + .bi-list-item-select { &:hover, &.hover { color: @color-bi-text-highlight; background-color: @color-list-item-hover; diff --git a/src/less/lib/colors.less b/src/less/lib/colors.less index 1d15c62a0..15349103d 100644 --- a/src/less/lib/colors.less +++ b/src/less/lib/colors.less @@ -26,12 +26,13 @@ //标红色 @color-bi-text-redmark: @font-color-redmark; +//普通背景 +@color-bi-background-normal: @background-color-normal; +@color-bi-background-normal-theme-dark: #191A2C; //默认背景 @color-bi-background-default: @background-color-default; //深色主题默认背景 -@color-bi-background-theme-dark: #191A2C; -//普通背景 -@color-bi-background-normal: @background-color-normal; +@color-bi-background-default-theme-dark: #202237; //黑色背景 @color-bi-background-black: @background-color-black; //深灰色背景 diff --git a/src/less/lib/constant.less b/src/less/lib/constant.less index 5b5d2dd96..4646d1f5c 100644 --- a/src/less/lib/constant.less +++ b/src/less/lib/constant.less @@ -80,6 +80,11 @@ //scroll color @scroll-color: #f4f4f4; @scroll-thumb-color: #e2e2e2; +@scroll-thumb-focus-color: #7d7d7d; + +@scroll-color-theme-dark: rgba(255,255,255,.1); +@scroll-thumb-color-theme-dark: #7d7d7d; +@scroll-thumb-focus-color-theme-dark: #e2e2e2; @water-mark-color: #cccccc; diff --git a/src/less/resource/app.less b/src/less/resource/app.less index 12f841f65..220c2f575 100644 --- a/src/less/resource/app.less +++ b/src/less/resource/app.less @@ -112,13 +112,13 @@ div, textarea { div, textarea { &::-webkit-scrollbar { -webkit-appearance: none; - background-color: @color-bi-background-theme-dark; + background-color: @scroll-color-theme-dark; width: 6px; height: 6px; } &::-webkit-scrollbar-thumb { .border-radius(0); - background-color: #7d7d7d; + background-color: @scroll-thumb-color-theme-dark; } } } \ No newline at end of file diff --git a/src/less/theme/dark.less b/src/less/theme/dark.less index 7957da6f1..ab8aa3eeb 100644 --- a/src/less/theme/dark.less +++ b/src/less/theme/dark.less @@ -1,7 +1,7 @@ @import "../bibase"; .bi-theme-dark { - background-color: @color-bi-background-theme-dark; + background-color: @color-bi-background-normal-theme-dark; color: @color-bi-text-theme-dark; & .bi-input { color: @color-bi-text; diff --git a/src/less/widget/multiselect/trigger/button.checkselected.less b/src/less/widget/multiselect/trigger/button.checkselected.less index a185e1d0e..2e4cbd59e 100644 --- a/src/less/widget/multiselect/trigger/button.checkselected.less +++ b/src/less/widget/multiselect/trigger/button.checkselected.less @@ -10,6 +10,6 @@ .bi-theme-dark { .bi-multi-select-check-selected-button { - background-color: @color-bi-background-theme-dark; + background-color: @color-bi-background-normal-theme-dark; } } \ No newline at end of file