From 252aedc334fca9a0138afb22467447d24dcfa2c3 Mon Sep 17 00:00:00 2001 From: windy <1374721899@qq.com> Date: Sat, 30 Jun 2018 10:59:30 +0800 Subject: [PATCH] =?UTF-8?q?BI-25416=20=E7=BA=BF=E5=9E=8B=E6=8C=89=E9=92=AE?= =?UTF-8?q?=E7=81=B0=E5=8C=96=E5=90=8E=E7=9A=84=E9=A2=9C=E8=89=B2=E4=B8=8D?= =?UTF-8?q?=E7=AC=A6=E5=90=88=E8=A7=86=E8=A7=89=E6=96=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dist/base.css | 21 ++++++--- dist/case.js | 2 +- dist/core.css | 47 ++++++++++++------- dist/core_without_normalize.css | 47 ++++++++++++------- src/case/segment/button.segment.js | 2 +- src/css/base/colorchooser/colorchooser.css | 6 +-- src/css/base/segment/button.css | 3 ++ src/css/base/segment/segment.css | 12 +++-- src/css/core/utils/common.css | 47 ++++++++++++------- .../colorchooser/colorchooser.trigger.less | 2 +- src/less/base/segment/button.segment.less | 1 + src/less/base/segment/segment.less | 11 +++-- src/less/core/utils/common.less | 27 +++++++++-- src/less/lib/colors.less | 2 +- 14 files changed, 155 insertions(+), 75 deletions(-) diff --git a/dist/base.css b/dist/base.css index b1b90adeb..7097b4637 100644 --- a/dist/base.css +++ b/dist/base.css @@ -8,9 +8,9 @@ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; - box-shadow: 0px 0px 2px 1px #d4dadd inset; - -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset; - -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset; + box-shadow: 0px 0px 2px 1px #d0d4da inset; + -webkit-box-shadow: 0px 0px 2px 1px #d0d4da inset; + -moz-box-shadow: 0px 0px 2px 1px #d0d4da inset; } .bi-color-picker-button .color-picker-button-mask { border: 1px solid #232e40; @@ -784,17 +784,20 @@ li.CodeMirror-hint-active { .bi-rich-editor-text-toolbar .text-toolbar-button { font-size: 16px; } +.bi-segment-button { + color: #3685f2; +} .bi-segment > .center-element { overflow: hidden; overflow-x: hidden; overflow-y: hidden; background: #ffffff; - border-right: 1px solid #e8eaed; - border-top: 1px solid #e8eaed; - border-bottom: 1px solid #e8eaed; + border-right: 1px solid #3685f2; + border-top: 1px solid #3685f2; + border-bottom: 1px solid #3685f2; } .bi-segment > .first-element { - border-left: 1px solid #e8eaed; + border-left: 1px solid #3685f2; -webkit-border-radius: 6px 0px 0px 6px; -moz-border-radius: 6px 0px 0px 6px; border-radius: 6px 0px 0px 6px; @@ -804,6 +807,10 @@ li.CodeMirror-hint-active { -moz-border-radius: 0px 6px 6px 0px; border-radius: 0px 6px 6px 0px; } +.bi-segment.disabled > .center-element, +.bi-segment.disabled > .first-element { + border-color: #F0F3F7; +} .bi-theme-dark .bi-segment > .center-element { overflow: hidden; overflow-x: hidden; diff --git a/dist/case.js b/dist/case.js index 2d5456197..64f60e6cd 100644 --- a/dist/case.js +++ b/dist/case.js @@ -11775,7 +11775,7 @@ BI.SegmentButton = BI.inherit(BI.BasicButton, { _defaultConfig: function () { var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments); return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-active", + baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select", shadow: true, readonly: true, hgap: 5 diff --git a/dist/core.css b/dist/core.css index 35d5804d0..8e34f8b8e 100644 --- a/dist/core.css +++ b/dist/core.css @@ -1081,30 +1081,41 @@ textarea { .bi-list-item-select.button-warning.active.bi-high-light-border { border-color: #e85050; } -.bi-list-item-select.disabled, -.bi-list-item-select.disabled:hover, -.bi-list-item-select.disabled:active { +.bi-list-item-select.disabled { color: #9ea6b2 !important; background-color: transparent !important; } -.bi-list-item-select.disabled .bi-input, -.bi-list-item-select.disabled:hover .bi-input, -.bi-list-item-select.disabled:active .bi-input { +.bi-list-item-select.disabled .bi-input { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-textarea, -.bi-list-item-select.disabled:hover .bi-textarea, -.bi-list-item-select.disabled:active .bi-textarea { +.bi-list-item-select.disabled .bi-textarea { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-high-light, -.bi-list-item-select.disabled:hover .bi-high-light, -.bi-list-item-select.disabled:active .bi-high-light { +.bi-list-item-select.disabled .bi-high-light { color: #9ea6b2 !important; } -.bi-list-item-select.disabled.bi-high-light-border, -.bi-list-item-select.disabled:hover.bi-high-light-border, -.bi-list-item-select.disabled:active.bi-high-light-border { +.bi-list-item-select.disabled.bi-high-light-border { + border-color: #F0F3F7; +} +.bi-list-item-select.disabled.hover, +.bi-list-item-select.disabled.active { + color: #ffffff !important; + background-color: #d0d4da !important; +} +.bi-list-item-select.disabled.hover .bi-input, +.bi-list-item-select.disabled.active .bi-input { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-textarea, +.bi-list-item-select.disabled.active .bi-textarea { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-high-light, +.bi-list-item-select.disabled.active .bi-high-light { + color: #9ea6b2 !important; +} +.bi-list-item-select.disabled.hover.bi-high-light-border, +.bi-list-item-select.disabled.active.bi-high-light-border { border-color: #F0F3F7; } .bi-list-item-select2:hover, @@ -1113,7 +1124,7 @@ textarea { } .bi-list-item-select2:active, .bi-list-item-select2.active { - color: #3685f2; + color: #ffffff; background-color: #f7f8fa; } .bi-list-item-select2:active .bi-input, @@ -1124,6 +1135,10 @@ textarea { .bi-list-item-select2.active .bi-textarea { color: #3685f2; } +.bi-list-item-select2:active .bi-high-light, +.bi-list-item-select2.active .bi-high-light { + color: #ffffff; +} .bi-theme-dark .bi-list-item-select:hover, .bi-theme-dark .bi-list-item-select.hover { color: #ffffff; diff --git a/dist/core_without_normalize.css b/dist/core_without_normalize.css index a13ba9999..514b6da96 100644 --- a/dist/core_without_normalize.css +++ b/dist/core_without_normalize.css @@ -803,30 +803,41 @@ textarea { .bi-list-item-select.button-warning.active.bi-high-light-border { border-color: #e85050; } -.bi-list-item-select.disabled, -.bi-list-item-select.disabled:hover, -.bi-list-item-select.disabled:active { +.bi-list-item-select.disabled { color: #9ea6b2 !important; background-color: transparent !important; } -.bi-list-item-select.disabled .bi-input, -.bi-list-item-select.disabled:hover .bi-input, -.bi-list-item-select.disabled:active .bi-input { +.bi-list-item-select.disabled .bi-input { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-textarea, -.bi-list-item-select.disabled:hover .bi-textarea, -.bi-list-item-select.disabled:active .bi-textarea { +.bi-list-item-select.disabled .bi-textarea { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-high-light, -.bi-list-item-select.disabled:hover .bi-high-light, -.bi-list-item-select.disabled:active .bi-high-light { +.bi-list-item-select.disabled .bi-high-light { color: #9ea6b2 !important; } -.bi-list-item-select.disabled.bi-high-light-border, -.bi-list-item-select.disabled:hover.bi-high-light-border, -.bi-list-item-select.disabled:active.bi-high-light-border { +.bi-list-item-select.disabled.bi-high-light-border { + border-color: #F0F3F7; +} +.bi-list-item-select.disabled.hover, +.bi-list-item-select.disabled.active { + color: #ffffff !important; + background-color: #d0d4da !important; +} +.bi-list-item-select.disabled.hover .bi-input, +.bi-list-item-select.disabled.active .bi-input { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-textarea, +.bi-list-item-select.disabled.active .bi-textarea { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-high-light, +.bi-list-item-select.disabled.active .bi-high-light { + color: #9ea6b2 !important; +} +.bi-list-item-select.disabled.hover.bi-high-light-border, +.bi-list-item-select.disabled.active.bi-high-light-border { border-color: #F0F3F7; } .bi-list-item-select2:hover, @@ -835,7 +846,7 @@ textarea { } .bi-list-item-select2:active, .bi-list-item-select2.active { - color: #3685f2; + color: #ffffff; background-color: #f7f8fa; } .bi-list-item-select2:active .bi-input, @@ -846,6 +857,10 @@ textarea { .bi-list-item-select2.active .bi-textarea { color: #3685f2; } +.bi-list-item-select2:active .bi-high-light, +.bi-list-item-select2.active .bi-high-light { + color: #ffffff; +} .bi-theme-dark .bi-list-item-select:hover, .bi-theme-dark .bi-list-item-select.hover { color: #ffffff; diff --git a/src/case/segment/button.segment.js b/src/case/segment/button.segment.js index bd024ed07..0abac9041 100644 --- a/src/case/segment/button.segment.js +++ b/src/case/segment/button.segment.js @@ -10,7 +10,7 @@ BI.SegmentButton = BI.inherit(BI.BasicButton, { _defaultConfig: function () { var conf = BI.SegmentButton.superclass._defaultConfig.apply(this, arguments); return BI.extend(conf, { - baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-active", + baseCls: (conf.baseCls || "") + " bi-segment-button bi-list-item-select", shadow: true, readonly: true, hgap: 5 diff --git a/src/css/base/colorchooser/colorchooser.css b/src/css/base/colorchooser/colorchooser.css index f49d79fc2..2161422d0 100644 --- a/src/css/base/colorchooser/colorchooser.css +++ b/src/css/base/colorchooser/colorchooser.css @@ -8,7 +8,7 @@ -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; - box-shadow: 0px 0px 2px 1px #d4dadd inset; - -webkit-box-shadow: 0px 0px 2px 1px #d4dadd inset; - -moz-box-shadow: 0px 0px 2px 1px #d4dadd inset; + box-shadow: 0px 0px 2px 1px #d0d4da inset; + -webkit-box-shadow: 0px 0px 2px 1px #d0d4da inset; + -moz-box-shadow: 0px 0px 2px 1px #d0d4da inset; } diff --git a/src/css/base/segment/button.css b/src/css/base/segment/button.css index e69de29bb..579852f6c 100644 --- a/src/css/base/segment/button.css +++ b/src/css/base/segment/button.css @@ -0,0 +1,3 @@ +.bi-segment-button { + color: #3685f2; +} diff --git a/src/css/base/segment/segment.css b/src/css/base/segment/segment.css index f5d717124..db51ddb5e 100644 --- a/src/css/base/segment/segment.css +++ b/src/css/base/segment/segment.css @@ -3,12 +3,12 @@ overflow-x: hidden; overflow-y: hidden; background: #ffffff; - border-right: 1px solid #e8eaed; - border-top: 1px solid #e8eaed; - border-bottom: 1px solid #e8eaed; + border-right: 1px solid #3685f2; + border-top: 1px solid #3685f2; + border-bottom: 1px solid #3685f2; } .bi-segment > .first-element { - border-left: 1px solid #e8eaed; + border-left: 1px solid #3685f2; -webkit-border-radius: 6px 0px 0px 6px; -moz-border-radius: 6px 0px 0px 6px; border-radius: 6px 0px 0px 6px; @@ -18,6 +18,10 @@ -moz-border-radius: 0px 6px 6px 0px; border-radius: 0px 6px 6px 0px; } +.bi-segment.disabled > .center-element, +.bi-segment.disabled > .first-element { + border-color: #F0F3F7; +} .bi-theme-dark .bi-segment > .center-element { overflow: hidden; overflow-x: hidden; diff --git a/src/css/core/utils/common.css b/src/css/core/utils/common.css index ec06e3e74..871235f11 100644 --- a/src/css/core/utils/common.css +++ b/src/css/core/utils/common.css @@ -803,30 +803,41 @@ textarea { .bi-list-item-select.button-warning.active.bi-high-light-border { border-color: #e85050; } -.bi-list-item-select.disabled, -.bi-list-item-select.disabled:hover, -.bi-list-item-select.disabled:active { +.bi-list-item-select.disabled { color: #9ea6b2 !important; background-color: transparent !important; } -.bi-list-item-select.disabled .bi-input, -.bi-list-item-select.disabled:hover .bi-input, -.bi-list-item-select.disabled:active .bi-input { +.bi-list-item-select.disabled .bi-input { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-textarea, -.bi-list-item-select.disabled:hover .bi-textarea, -.bi-list-item-select.disabled:active .bi-textarea { +.bi-list-item-select.disabled .bi-textarea { color: #9ea6b2 !important; } -.bi-list-item-select.disabled .bi-high-light, -.bi-list-item-select.disabled:hover .bi-high-light, -.bi-list-item-select.disabled:active .bi-high-light { +.bi-list-item-select.disabled .bi-high-light { color: #9ea6b2 !important; } -.bi-list-item-select.disabled.bi-high-light-border, -.bi-list-item-select.disabled:hover.bi-high-light-border, -.bi-list-item-select.disabled:active.bi-high-light-border { +.bi-list-item-select.disabled.bi-high-light-border { + border-color: #F0F3F7; +} +.bi-list-item-select.disabled.hover, +.bi-list-item-select.disabled.active { + color: #ffffff !important; + background-color: #d0d4da !important; +} +.bi-list-item-select.disabled.hover .bi-input, +.bi-list-item-select.disabled.active .bi-input { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-textarea, +.bi-list-item-select.disabled.active .bi-textarea { + color: #ffffff !important; +} +.bi-list-item-select.disabled.hover .bi-high-light, +.bi-list-item-select.disabled.active .bi-high-light { + color: #9ea6b2 !important; +} +.bi-list-item-select.disabled.hover.bi-high-light-border, +.bi-list-item-select.disabled.active.bi-high-light-border { border-color: #F0F3F7; } .bi-list-item-select2:hover, @@ -835,7 +846,7 @@ textarea { } .bi-list-item-select2:active, .bi-list-item-select2.active { - color: #3685f2; + color: #ffffff; background-color: #f7f8fa; } .bi-list-item-select2:active .bi-input, @@ -846,6 +857,10 @@ textarea { .bi-list-item-select2.active .bi-textarea { color: #3685f2; } +.bi-list-item-select2:active .bi-high-light, +.bi-list-item-select2.active .bi-high-light { + color: #ffffff; +} .bi-theme-dark .bi-list-item-select:hover, .bi-theme-dark .bi-list-item-select.hover { color: #ffffff; diff --git a/src/less/base/colorchooser/colorchooser.trigger.less b/src/less/base/colorchooser/colorchooser.trigger.less index 15bf5fec0..73fb70dfc 100644 --- a/src/less/base/colorchooser/colorchooser.trigger.less +++ b/src/less/base/colorchooser/colorchooser.trigger.less @@ -2,5 +2,5 @@ .bi-color-chooser-trigger { .border-radius(2px); - .box-shadow(0px, 0px, 2px, 1px, @color-bi-background-dark, inset); + .box-shadow(0px, 0px, 2px, 1px, @color-bi-background-dark-gray, inset); } \ No newline at end of file diff --git a/src/less/base/segment/button.segment.less b/src/less/base/segment/button.segment.less index 1f9bad1c0..002372513 100644 --- a/src/less/base/segment/button.segment.less +++ b/src/less/base/segment/button.segment.less @@ -1,4 +1,5 @@ @import "../../index"; .bi-segment-button{ + color: @color-bi-text-highlight; } \ No newline at end of file diff --git a/src/less/base/segment/segment.less b/src/less/base/segment/segment.less index c4126d540..6326344e4 100644 --- a/src/less/base/segment/segment.less +++ b/src/less/base/segment/segment.less @@ -4,17 +4,20 @@ & > .center-element{ .overflow-hidden(); background: @color-bi-background-default; - border-right: 1px solid @color-bi-border-line; - border-top: 1px solid @color-bi-border-line; - border-bottom: 1px solid @color-bi-border-line; + border-right: 1px solid @color-bi-border-highlight; + border-top: 1px solid @color-bi-border-highlight; + border-bottom: 1px solid @color-bi-border-highlight; } & > .first-element{ - border-left: 1px solid @color-bi-border-line; + border-left: 1px solid @color-bi-border-highlight; .border-corner-radius(6px,0px,0px,6px) } & > .last-element{ .border-corner-radius(0px,6px,6px,0px) } + &.disabled > .center-element, &.disabled > .first-element{ + border-color: @color-bi-border-disabled; + } } .bi-theme-dark { diff --git a/src/less/core/utils/common.less b/src/less/core/utils/common.less index aa6c961fb..aba81e305 100644 --- a/src/less/core/utils/common.less +++ b/src/less/core/utils/common.less @@ -793,15 +793,29 @@ textarea { } } &.disabled { - &, &:hover, &:active { + color: @color-bi-text-disabled !important; + & .bi-input { + color: @color-bi-text-disabled !important; + } + & .bi-textarea { color: @color-bi-text-disabled !important; + } + background-color: transparent !important; + & .bi-high-light { + color: @color-bi-text-disabled !important; + } + &.bi-high-light-border { + border-color: @color-bi-border-disabled; + } + &.hover, &.active { + color: @color-bi-text !important; & .bi-input { - color: @color-bi-text-disabled !important; + color: @color-bi-text !important; } & .bi-textarea { - color: @color-bi-text-disabled !important; + color: @color-bi-text !important; } - background-color: transparent !important; + background-color: @color-bi-background-dark-gray !important; & .bi-high-light { color: @color-bi-text-disabled !important; } @@ -818,7 +832,7 @@ textarea { background-color: @color-bi-background-normal; } &:active, &.active { - color: @color-bi-text-highlight; + color: @color-bi-text; & .bi-input { color: @color-bi-text-highlight; } @@ -826,6 +840,9 @@ textarea { color: @color-bi-text-highlight; } background-color: @color-bi-background-normal; + & .bi-high-light { + color: @color-bi-text; + } } } diff --git a/src/less/lib/colors.less b/src/less/lib/colors.less index e8c469be8..aad538cb7 100644 --- a/src/less/lib/colors.less +++ b/src/less/lib/colors.less @@ -41,7 +41,7 @@ //黑色背景 @color-bi-background-black: @background-color-black; //深灰色背景 -@color-bi-background-dark: @background-color-dark; +@color-bi-background-dark-gray: @background-color-dark-gray; //灰色背景(浅) @color-bi-background-light-gray: @background-color-light-gray; //灰化背景