diff --git a/examples/插件设计.html b/examples/插件设计.html index de44bd6f5..ca6954a06 100644 --- a/examples/插件设计.html +++ b/examples/插件设计.html @@ -2,7 +2,7 @@ - + @@ -81,6 +81,12 @@ text: store.model.text, handler: function () { console.log("click"); + BI.Msg.toast("123", { + autoClose: false, + callback: function(){ + BI.Msg.alert("提示", "点击了关闭") + } + }) } }, { type: "bi.label", @@ -95,7 +101,7 @@ var Widget = BI.inherit(BI.Widget, { props: { - vdom: true + // vdom: true }, watch: { text: function () { diff --git a/src/less/base/pager/pager.all.count.less b/src/less/base/pager/pager.all.count.less index f8d5a1469..f9f7227db 100644 --- a/src/less/base/pager/pager.all.count.less +++ b/src/less/base/pager/pager.all.count.less @@ -1,8 +1,6 @@ @import "../../index"; .bi-all-count-pager { - & .pager-editor { - } & .all-pager-prev { font-size: @font-size-16; } diff --git a/src/less/base/trigger/trigger.editor.less b/src/less/base/trigger/trigger.editor.less deleted file mode 100644 index 538f62946..000000000 --- a/src/less/base/trigger/trigger.editor.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-editor-trigger{ -} \ No newline at end of file diff --git a/src/less/base/trigger/trigger.icon.less b/src/less/base/trigger/trigger.icon.less deleted file mode 100644 index b3b364e1b..000000000 --- a/src/less/base/trigger/trigger.icon.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-icon-trigger { - -} \ No newline at end of file diff --git a/src/less/index-modern.less b/src/less/index-modern.less index a237198e7..3edda1ca0 100644 --- a/src/less/index-modern.less +++ b/src/less/index-modern.less @@ -1,342 +1,2 @@ @import "lib/colors-modern"; @import "lib/theme-modern"; - -:root{ - --font-size-12: 12px; - --font-size-13: 13px; - --font-size-14: 14px; - --font-size-15: 15px; - --font-size-16: 16px; - --font-size-18: 18px; - --font-size-20: 20px; - --font-size-22: 22px; - --font-size-24: 24px; - --font-size-30: 30px; - --font-size-40: 40px; - --font-size-50: 50px; - --font-size-60: 60px; - --font-size-70: 70px; - --radius-2: 2px; - --radius-6: 6px; - - --opacity-15: 0.15; - --opacity-20: 0.2; - - //font color - --font-color-black: #232e40; - --font-color-normal: #3d4d66; - --font-color-normal-theme-dark: #d6e0dc; - --font-color-light-gray: #647185; - --font-color-light-gray-theme-dark: #afb7c6; - --font-color-disabled: #9ea6b2; - --font-color-disabled-theme-dark: #878d9f; - --font-color-tips: #9ea6b2; - --font-color-tips-theme-dark: #6b7084; - --font-color-light-disabled: #d0d4da; - --font-color-light-disabled-theme-dark: #606479; - --font-color-gray: #999999; - --font-color-white: #ffffff; - --font-color-white-theme-dark: #20263b; - --font-color-light-highlight: #eaf2fd; - --font-color-medium-highlight: #d7e7fc; - --font-color-highlight: #3685f2; - --font-color-blue: #23beef; - --font-color-light-blue: #e9f8fd; - --font-color-success: #13cd66; - --font-color-warning: #faaa39; - --font-color-negative: #e65251; - --font-color-yellow: #ffc101; - - //background color - --background-color-black: #232E40; - --background-color-black-theme-dark: #606479; - --background-color-light-black: #3d4d66; - --background-color-light-black-theme-dark: #d6e0dc; - --background-color-default: #ffffff; - --background-color-default-theme-dark: #20263b; - --background-color-normal: #f7f8fa; - --background-color-normal-theme-dark: #191b2b; - --background-color-light-highlight: #eaf2fd; - --background-color-medium-highlight: #d7e7fc; - --background-color-highlight: #3685f2; - --background-color-blue: #23beef; - --background-color-light-blue: #e9f8fd; - --background-color-dark: #d4dadd; - --background-color-light-gray: #f2f4f7; - --background-color-light-gray-theme-dark: #292f45; - --background-color-medium-gray: #e8eaed; - --background-color-medium-gray-theme-dark: #363e55; - --background-color-dark-gray: #d0d4da; - --background-color-dark-gray-theme-dark: #606479; - --background-color-disabled: #f2f4f7; - --background-color-disabled-theme-dark: #292f45; - --background-color-light-disabled: #9ea6b2; - --background-color-light-disabled-theme-dark: #878d9f; - --background-color-yellow: #ffc101; - - --background-color-negative: #e65251; - --background-color-light-negative: #ffecec; - --background-color-dark-negative: #3A2940; - --background-color-light-warning: #feeed7; - --background-color-warning: #faaa39; - - --background-color-dark-success: #13cd66; - --background-color-light-success: #e1f4e7; - --background-color-normal-success: #647185; - - //border color - --border-color-default: #ffffff; - --border-color-black: #232e40; - --border-color-line: #e8eaed; - --border-color-line-theme-dark: #363e55; - --border-color-light-line: #f2f4f7; - --border-color-light-line-theme-dark: #292f45; - --border-color-dark-gray-line: #d0d4da; - --border-color-dark-gray-line-theme-dark: #606479; - --border-color-dark-line: #9ea6b2; - --border-color-dark-line-theme-dark: #878d9f; - --border-color-highlight: #3685f2; - - --border-color-warning: #fbb03b; - --border-color-negative: #e65251; - --border-color-success: #13cd66; - --border-color-light-negative: #f4cbcb; - --border-color-normal-success: #eddea2; - - //split color - --border-color-disabled: #e8eaed; - --border-color-disabled-theme-dark: #363e55; - - //scroll color - --scroll-color: #232e40; - --scroll-color-theme-dark: #ffffff; - --scroll-thumb-color: #232e40; - --scroll-thumb-color-theme-dark: #232e40; - - //默认字体颜色 - --color-bi-text-normal: var(--font-color-normal); - //深色主题默认字体颜色 - --color-bi-text-theme-dark: var(--font-color-normal-theme-dark); - --color-bi-text-normal-theme-dark: var(--font-color-normal-theme-dark); - //黑色字体颜色 - --color-bi-text-black: var(--font-color-black); - //深色主题黑色字体颜色 - --color-bi-text-black-theme-dark: var(--font-color-normal-theme-dark); - //灰色字体颜色 - --color-bi-text-gray: var(--font-color-gray); - //浅灰色字体 - --color-bi-text-light-gray: var(--font-color-light-gray); - //深色主题浅灰色字体 - --color-bi-text-light-gray-theme-dark: var(--font-color-light-gray-theme-dark); - //白色字体颜色 - --color-bi-text: var(--font-color-white); - --color-bi-text-white: var(--font-color-white); - //深色主题白色字体颜色 - --color-bi-text-white-theme-dark: var(--font-color-white-theme-dark); - //灰化字体颜色 - --color-bi-text-disabled: var(--font-color-disabled); - //深色主题灰化字体颜色 - --color-bi-text-disabled-theme-dark: var(--font-color-disabled-theme-dark); - //灰化图标色 - --color-bi-icon-disabled: var(--font-color-light-disabled); - //深色主题灰化图标颜色 - --color-bi-icon-disabled-theme-dark: var(--font-color-light-disabled-theme-dark); - //提示字体颜色 - --color-bi-text-tips: var(--font-color-tips); - //深色主题提示字体颜色 - --color-bi-text-tips-theme-dark: var(--font-color-tips-theme-dark); - //成功字体颜色 - --color-bi-text-success: var(--font-color-success); - //失败字体颜色 - --color-bi-text-failure: var(--font-color-negative); - //基本提亮颜色 - --color-bi-text-highlight: var(--font-color-highlight); - //标红色 - --color-bi-text-redmark: var(--font-color-warning); - - //普通背景 - --color-bi-background-normal: var(--background-color-normal); - //深色主题普通背景 - --color-bi-background-normal-theme-dark: var(--background-color-normal-theme-dark); - //默认背景 - --color-bi-background-default: var(--background-color-default); - //深色主题默认背景 - --color-bi-background-default-theme-dark: var(--background-color-default-theme-dark); - //黑色背景 - --color-bi-background-black: var(--background-color-black); - //深色主题黑色背景 - --color-bi-background-black-theme-dark: var(--background-color-black-theme-dark); - //浅黑色背景 - --color-bi-background-light-black: var(--background-color-light-black); - //深色主题浅黑色背景 - --color-bi-background-light-black-theme-dark: var(--background-color-light-black-theme-dark); - //深灰色背景 - --color-bi-background-dark-gray: var(--background-color-dark-gray); - //深色主题深灰色背景 - --color-bi-background-dark-gray-theme-dark: var(--background-color-dark-gray-theme-dark); - //灰色背景(浅) - --color-bi-background-light-gray: var(--background-color-light-gray); - //深色主题灰色背景(浅) - --color-bi-background-light-gray-theme-dark: var(--background-color-light-gray-theme-dark); - //灰色背景(中) - --color-bi-background-medium-gray: var(--background-color-medium-gray); - //深色主题灰色背景(中) - --color-bi-background-medium-gray-theme-dark: var(--background-color-medium-gray-theme-dark); - //灰化背景 - --color-bi-background-disabled: var(--background-color-disabled); - //深色主题灰化背景 - --color-bi-background-disabled-theme-dark: var(--background-color-disabled-theme-dark); - //浅灰化背景 - --color-bi-background-light-disabled: var(--background-color-light-disabled); - //深色主题浅灰化背景 - --color-bi-background-light-disabled-theme-dark: var(--background-color-light-disabled-theme-dark); - //成功背景色 - --color-bi-background-success: var(--background-color-dark-success); - //成功背景色(浅) - --color-bi-background-light-success: var(--background-color-light-success); - //失败背景色 - --color-bi-background-failure: var(--background-color-negative); - //失败背景色(浅) - --color-bi-background-light-failure: var(--background-color-light-negative); - //失败背景色(深) - --color-bi-background-dark-failure: var(--background-color-dark-negative); - //警示背景色 - --color-bi-background-warning: var(--background-color-warning); - //警示背景色(浅) - --color-bi-background-light-warning: var(--background-color-light-warning); - //背景提亮色 - --color-bi-background-highlight: var(--background-color-highlight); - //背景提亮色(浅) - --color-bi-background-light-highlight: var(--background-color-light-highlight); - - //黑色边框色 - --color-bi-border-black: var(--border-color-black); - //默认边框色 - --color-bi-border-default: var(--border-color-default); - //边框线色 - --color-bi-border-line: var(--border-color-line); - //深色主题边框线色 - --color-bi-border-line-theme-dark: var(--border-color-line-theme-dark); - //深灰色边框线 - --color-bi-border-dark-gray-line: var(--border-color-dark-gray-line); - //深灰色主题深色边框线 - --color-bi-border-dark-gray-line-theme-dark: var(--border-color-dark-gray-line-theme-dark); - //深色边框线 - --color-bi-border-dark-line: var(--border-color-dark-line); - //深色主题深色边框线 - --color-bi-border-dark-line-theme-dark: var(--border-color-dark-line-theme-dark); - //灰化边框 - --color-bi-border-disabled: var(--border-color-disabled); - //深色主题灰化边框 - --color-bi-border-disabled-theme-dark: var(--border-color-disabled-theme-dark); - //成功边框色 - --color-bi-border-success: var(--border-color-success); - //失败边框色 - --color-bi-border-failure: var(--border-color-negative); - //警示边框色 - --color-bi-border-warning: var(--border-color-warning); - //边框提亮 - --color-bi-border-highlight: var(--border-color-highlight); - - //颜色百分比 - //green - --color-bi-green-80: fade(@font-color-success, 80); - --color-bi-green-60: fade(@font-color-success, 60); - --color-bi-green-40: fade(@font-color-success, 40); - --color-bi-green-30: fade(@font-color-success, 30); - --color-bi-green-20: fade(@font-color-success, 20); - --color-bi-green-10: fade(@font-color-success, 10); - --color-bi-green-5: fade(@font-color-success, 5); - - //blue - --color-bi-blue-80: fade(@font-color-highlight, 80); - --color-bi-blue-60: fade(@font-color-highlight, 60); - --color-bi-blue-40: fade(@font-color-highlight, 40); - --color-bi-blue-30: fade(@font-color-highlight, 30); - --color-bi-blue-20: fade(@font-color-highlight, 20); - --color-bi-blue-10: fade(@font-color-highlight, 10); - --color-bi-blue-5: fade(@font-color-highlight, 5); - - //light-blue - --color-bi-light-blue-80: fade(@font-color-light-highlight, 80); - --color-bi-light-blue-60: fade(@font-color-light-highlight, 60); - --color-bi-light-blue-40: fade(@font-color-light-highlight, 40); - --color-bi-light-blue-30: fade(@font-color-light-highlight, 30); - --color-bi-light-blue-20: fade(@font-color-light-highlight, 20); - --color-bi-light-blue-10: fade(@font-color-light-highlight, 10); - --color-bi-light-blue-5: fade(@font-color-light-highlight, 5); - - // orange - --color-bi-orange-80: fade(@font-color-warning, 80); - --color-bi-orange-60: fade(@font-color-warning, 60); - --color-bi-orange-40: fade(@font-color-warning, 40); - --color-bi-orange-30: fade(@font-color-warning, 30); - --color-bi-orange-20: fade(@font-color-warning, 20); - --color-bi-orange-10: fade(@font-color-warning, 10); - --color-bi-orange-5: fade(@font-color-warning, 5); - - // red - --color-bi-red-80: fade(@font-color-negative, 80); - --color-bi-red-60: fade(@font-color-negative, 60); - --color-bi-red-40: fade(@font-color-negative, 40); - --color-bi-red-30: fade(@font-color-negative, 30); - --color-bi-red-20: fade(@font-color-negative, 20); - --color-bi-red-10: fade(@font-color-negative, 10); - --color-bi-red-5: fade(@font-color-negative, 5); - - // yellow - --color-bi-yellow-80: fade(@font-color-yellow, 90); - --color-bi-yellow-60: fade(@font-color-yellow, 60); - --color-bi-yellow-40: fade(@font-color-yellow, 40); - --color-bi-yellow-20: fade(@font-color-yellow, 20); - --color-bi-yellow-5: fade(@font-color-yellow, 5); - - - //tooltip - //成功背景(专属配色) - --color-bi-background-tooltip-success: var(--background-color-normal-success); - //成功边框(专属配色) - --color-bi-border-tooltip-success: var(--border-color-normal-success); - //失败背景 - --color-bi-background-tooltip-failure: var(--color-bi-background-failure); - //失败边框 - --color-bi-border-tooltip-failure: var(--color-bi-border-failure); - - //按钮的mask颜色 - --color-bi-background-button-mask: var(--color-bi-background-black); - - //水印字体颜色 - --color-bi-text-water-mark: var(--color-bi-text-tips); - --color-bi-text-water-mark-theme-dark: var(--color-bi-text-tips-theme-dark); - - //toast - --color-bi-background-toast-success: var(--color-bi-background-success); - --color-bi-background-toast-warning: var(--color-bi-background-warning); - --color-bi-background-toast-error: var(--color-bi-background-failure); - --color-bi-background-toast-normal: var(--color-bi-background-highlight); - - //bubble - --color-bi-background-bubble-success: var(--color-bi-background-light-success); - --color-bi-background-bubble-warning: var(--color-bi-background-light-warning); - --color-bi-background-bubble-error: var(--color-bi-background-light-failure); - --color-bi-background-bubble-error-theme-dark: var(--color-bi-background-dark-failure); - --color-bi-background-bubble-normal: var(--color-bi-background-light-highlight); - - //bi-background背景 - --color-bi-background-background: var(--color-bi-background-normal); - --color-bi-background-background-theme-dark: var(--color-bi-background-normal-theme-dark); - --color-bi-text-background: var(--color-bi-text-normal); - --color-bi-text-background-theme-dark: var(--color-bi-text-theme-dark); - - //bi-header-background背景 - --color-bi-background-header-background: var(--color-bi-background-light-gray); - --color-bi-background-header-background-theme-dark: var(--color-bi-background-light-gray-theme-dark); - --color-bi-text-header-background: var(--color-bi-text-light-gray); - --color-bi-text-header-background-theme-dark: var(--color-bi-text-light-gray-theme-dark); - - //bi-card卡片 - --color-bi-background-card: var(--color-bi-background-default); - --color-bi-background-card-theme-dark: var(--color-bi-background-default-theme-dark); - --color-bi-text-card: var(--color-bi-text-normal); - --color-bi-text-card-theme-dark: var(--color-bi-text-theme-dark); -} diff --git a/src/less/modern.less b/src/less/modern.less new file mode 100644 index 000000000..7a5928dca --- /dev/null +++ b/src/less/modern.less @@ -0,0 +1,466 @@ +@import "lib/colors-modern"; +@import "lib/theme-modern"; + +//core +@import "core/normalize.less"; +@import "core/normalize2.less"; +@import "core/utils/animation.less"; +@import "core/utils/common.less"; +@import "core/utils/cursor.less"; +@import "core/utils/list-item.less"; +@import "core/utils/position.less"; +@import "core/utils/size.less"; +@import "core/utils/sizing.less"; +@import "core/utils/typographic.less"; +@import "core/wrapper/flex.horizontal.less"; +@import "core/wrapper/flex.vertical.less"; +@import "core/wrapper/flex.wrapper.horizontal.less"; +@import "core/wrapper/flex.wrapper.vertical.less"; +@import "core/wrapper/float.absolute.less"; +@import "core/wrapper/inline.less"; + +//base case +@import "base/pane.less"; +@import "base/calendar/calendar.year.less"; +@import "base/colorchooser/colorchooser.trigger.less"; +@import "base/colorchooser/colorchooser.popup.less"; +@import "base/colorchooser/colorpicker/button.colorpicker.less"; +@import "base/colorchooser/colorpicker/button.colorshow.less"; +@import "base/colorchooser/colorpicker/editor.colorpicker.less"; +@import "base/colorchooser/farbtastic/farbtastic.less"; +@import "base/combo/combo.bubble.less"; +@import "base/combo/combo.less"; +@import "base/combo/combo.searchtextvalue.less"; +@import "base/combo/combo.textvalue.icon.less"; +@import "base/combo/combo.textvalue.less"; +@import "base/combo/combo.textvaluecheck.less"; +@import "base/combo/combo.textvaluedownlist.less"; +@import "base/combo/popup.bubble.bar.less"; +@import "base/combo/popup.bubble.less"; +@import "base/editor/editor.search.less"; +@import "base/editor/editor.search.small.less"; +@import "base/foundation/bi.message.less"; +@import "base/layer/layer.multiselect.less"; +@import "base/layer/panel.less"; +@import "base/loader/sort.list.less"; +@import "base/pager/pager.all.count.less"; +@import "base/pager/pager.direction.less"; +@import "base/pager/pager.less"; +@import "base/segment/button.segment.less"; +@import "base/segment/segment.less"; +@import "base/single/html.less"; +@import "base/single/icon.less"; +@import "base/single/label.less"; +@import "base/single/text.less"; +@import "base/single/button/button.half.less"; +@import "base/single/button/button.less"; +@import "base/single/button/item.singleselect.icontext.less"; +@import "base/single/button/switch.less"; +@import "base/single/editor/editor.multifile.less"; +@import "base/single/editor/editor.textarea.less"; +@import "base/single/input/checkbox.less"; +@import "base/single/input/file.less"; +@import "base/single/input/input.less"; +@import "base/single/input/radio.less"; +@import "base/single/tip/tip.bubble.less"; +@import "base/single/tip/tip.less"; +@import "base/single/tip/tip.toast.less"; +@import "base/single/tip/tip.tooltip.less"; +@import "base/tree/tree.branch.less"; +@import "base/tree/tree.display.less"; +@import "base/tree/tree.expander.less"; +@import "base/tree/tree.list.display.less"; +@import "base/tree/ztree.less"; +@import "base/trigger/trigger.less"; +@import "base/trigger/trigger.selecttext.less"; +@import "base/trigger/trigger.selecttextsmall.less"; +@import "base/view/popover.less"; +@import "base/view/popupview.less"; + +//widget +@import "widget/date/trigger.date.less"; +@import "widget/downlist/popup.downlist.less"; +@import "widget/dynamicdatecombo/dynamicdatepopup.less"; +@import "widget/dynamicdatecombo/dynamicdatetime.combo.less"; +@import "widget/dynamicdatecombo/dynamicdatetimepopup.less"; +@import "widget/interactivearrangement/interactivearrangement.less"; +@import "widget/intervalslider/intervalslider.label.less"; +@import "widget/intervalslider/intervalslider.less"; +@import "widget/month/trigger.month.less"; +@import "widget/multilayerselecttree/multilayerselecttree.combo.less"; +@import "widget/multilayerselecttree/multilayerselecttree.leveltree.less"; +@import "widget/multilayersingletree/multilayersingletree.combo.less"; +@import "widget/multilayersingletree/multilayersingletree.leveltree.less"; +@import "widget/multiselect/multiselect.combo.less"; +@import "widget/multiselect/multiselect.insert.combo.less"; +@import "widget/multiselect/check/multiselect.check.pane.less"; +@import "widget/multiselect/search/multiselect.search.pane.less"; +@import "widget/multiselect/trigger/button.checkselected.less"; +@import "widget/multistringlist/multistringlist.insert.less"; +@import "widget/multistringlist/multistringlist.less"; +@import "widget/multitree/multi.tree.combo.less"; +@import "widget/multitree/popup.multi.tree.less"; +@import "widget/multitree/check/multi.tree.check.pane.less"; +@import "widget/multitree/trigger/multi.tree.button.checkselected.less"; +@import "widget/numbereditor/number.editor.less"; +@import "widget/numberinterval/numberinterval.less"; +@import "widget/quarter/trigger.quarter.less"; +@import "widget/searchmultiselect/searchmultiselect.less"; +@import "widget/singleselect/singleselect.combo.less"; +@import "widget/singleselect/search/singleselect.search.pane.less"; +@import "widget/singleslider/singlelider.label.less"; +@import "widget/singleslider/singlelider.normal.less"; +@import "widget/singleslider/singleslider.less"; +@import "widget/singleslider/slider/widget.slider.less"; +@import "widget/singleslider/track/widget.track.less"; +@import "widget/timecombo/timecombo.less"; +@import "widget/timeinterval/dateinterval.less"; +@import "widget/timeinterval/timeinterval.less"; +@import "widget/year/popup.year.less"; +@import "widget/year/trigger.year.less"; +@import "widget/yearinterval/yearinterval.less"; +@import "widget/yearmonth/popup.yearmonth.less"; +@import "widget/yearmonthinterval/yearmonthinterval.less"; +@import "widget/yearquarter/popup.yearquarter.less"; +@import "widget/yearquarterinterval/yearquarterinterval.less"; + + +:root{ + --font-size-12: 12px; + --font-size-13: 13px; + --font-size-14: 14px; + --font-size-15: 15px; + --font-size-16: 16px; + --font-size-18: 18px; + --font-size-20: 20px; + --font-size-22: 22px; + --font-size-24: 24px; + --font-size-30: 30px; + --font-size-40: 40px; + --font-size-50: 50px; + --font-size-60: 60px; + --font-size-70: 70px; + --radius-2: 2px; + --radius-6: 6px; + + --opacity-15: 0.15; + --opacity-20: 0.2; + + //font color + --font-color-black: #232e40; + --font-color-normal: #3d4d66; + --font-color-normal-theme-dark: #d6e0dc; + --font-color-light-gray: #647185; + --font-color-light-gray-theme-dark: #afb7c6; + --font-color-disabled: #9ea6b2; + --font-color-disabled-theme-dark: #878d9f; + --font-color-tips: #9ea6b2; + --font-color-tips-theme-dark: #6b7084; + --font-color-light-disabled: #d0d4da; + --font-color-light-disabled-theme-dark: #606479; + --font-color-gray: #999999; + --font-color-white: #ffffff; + --font-color-white-theme-dark: #20263b; + --font-color-light-highlight: #eaf2fd; + --font-color-medium-highlight: #d7e7fc; + --font-color-highlight: #3685f2; + --font-color-blue: #23beef; + --font-color-light-blue: #e9f8fd; + --font-color-success: #13cd66; + --font-color-warning: #faaa39; + --font-color-negative: #e65251; + --font-color-yellow: #ffc101; + + //background color + --background-color-black: #232E40; + --background-color-black-theme-dark: #606479; + --background-color-light-black: #3d4d66; + --background-color-light-black-theme-dark: #d6e0dc; + --background-color-default: #ffffff; + --background-color-default-theme-dark: #20263b; + --background-color-normal: #f7f8fa; + --background-color-normal-theme-dark: #191b2b; + --background-color-light-highlight: #eaf2fd; + --background-color-medium-highlight: #d7e7fc; + --background-color-highlight: #3685f2; + --background-color-blue: #23beef; + --background-color-light-blue: #e9f8fd; + --background-color-dark: #d4dadd; + --background-color-light-gray: #f2f4f7; + --background-color-light-gray-theme-dark: #292f45; + --background-color-medium-gray: #e8eaed; + --background-color-medium-gray-theme-dark: #363e55; + --background-color-dark-gray: #d0d4da; + --background-color-dark-gray-theme-dark: #606479; + --background-color-disabled: #f2f4f7; + --background-color-disabled-theme-dark: #292f45; + --background-color-light-disabled: #9ea6b2; + --background-color-light-disabled-theme-dark: #878d9f; + --background-color-yellow: #ffc101; + + --background-color-negative: #e65251; + --background-color-light-negative: #ffecec; + --background-color-dark-negative: #3A2940; + --background-color-light-warning: #feeed7; + --background-color-warning: #faaa39; + + --background-color-dark-success: #13cd66; + --background-color-light-success: #e1f4e7; + --background-color-normal-success: #647185; + + //border color + --border-color-default: #ffffff; + --border-color-black: #232e40; + --border-color-line: #e8eaed; + --border-color-line-theme-dark: #363e55; + --border-color-light-line: #f2f4f7; + --border-color-light-line-theme-dark: #292f45; + --border-color-dark-gray-line: #d0d4da; + --border-color-dark-gray-line-theme-dark: #606479; + --border-color-dark-line: #9ea6b2; + --border-color-dark-line-theme-dark: #878d9f; + --border-color-highlight: #3685f2; + + --border-color-warning: #fbb03b; + --border-color-negative: #e65251; + --border-color-success: #13cd66; + --border-color-light-negative: #f4cbcb; + --border-color-normal-success: #eddea2; + + //split color + --border-color-disabled: #e8eaed; + --border-color-disabled-theme-dark: #363e55; + + //scroll color + --scroll-color: #232e40; + --scroll-color-theme-dark: #ffffff; + --scroll-thumb-color: #232e40; + --scroll-thumb-color-theme-dark: #232e40; + + //默认字体颜色 + --color-bi-text-normal: var(--font-color-normal); + //深色主题默认字体颜色 + --color-bi-text-theme-dark: var(--font-color-normal-theme-dark); + --color-bi-text-normal-theme-dark: var(--font-color-normal-theme-dark); + //黑色字体颜色 + --color-bi-text-black: var(--font-color-black); + //深色主题黑色字体颜色 + --color-bi-text-black-theme-dark: var(--font-color-normal-theme-dark); + //灰色字体颜色 + --color-bi-text-gray: var(--font-color-gray); + //浅灰色字体 + --color-bi-text-light-gray: var(--font-color-light-gray); + //深色主题浅灰色字体 + --color-bi-text-light-gray-theme-dark: var(--font-color-light-gray-theme-dark); + //白色字体颜色 + --color-bi-text: var(--font-color-white); + --color-bi-text-white: var(--font-color-white); + //深色主题白色字体颜色 + --color-bi-text-white-theme-dark: var(--font-color-white-theme-dark); + //灰化字体颜色 + --color-bi-text-disabled: var(--font-color-disabled); + //深色主题灰化字体颜色 + --color-bi-text-disabled-theme-dark: var(--font-color-disabled-theme-dark); + //灰化图标色 + --color-bi-icon-disabled: var(--font-color-light-disabled); + //深色主题灰化图标颜色 + --color-bi-icon-disabled-theme-dark: var(--font-color-light-disabled-theme-dark); + //提示字体颜色 + --color-bi-text-tips: var(--font-color-tips); + //深色主题提示字体颜色 + --color-bi-text-tips-theme-dark: var(--font-color-tips-theme-dark); + //成功字体颜色 + --color-bi-text-success: var(--font-color-success); + //失败字体颜色 + --color-bi-text-failure: var(--font-color-negative); + //基本提亮颜色 + --color-bi-text-highlight: var(--font-color-highlight); + //标红色 + --color-bi-text-redmark: var(--font-color-warning); + + //普通背景 + --color-bi-background-normal: var(--background-color-normal); + //深色主题普通背景 + --color-bi-background-normal-theme-dark: var(--background-color-normal-theme-dark); + //默认背景 + --color-bi-background-default: var(--background-color-default); + //深色主题默认背景 + --color-bi-background-default-theme-dark: var(--background-color-default-theme-dark); + //黑色背景 + --color-bi-background-black: var(--background-color-black); + //深色主题黑色背景 + --color-bi-background-black-theme-dark: var(--background-color-black-theme-dark); + //浅黑色背景 + --color-bi-background-light-black: var(--background-color-light-black); + //深色主题浅黑色背景 + --color-bi-background-light-black-theme-dark: var(--background-color-light-black-theme-dark); + //深灰色背景 + --color-bi-background-dark-gray: var(--background-color-dark-gray); + //深色主题深灰色背景 + --color-bi-background-dark-gray-theme-dark: var(--background-color-dark-gray-theme-dark); + //灰色背景(浅) + --color-bi-background-light-gray: var(--background-color-light-gray); + //深色主题灰色背景(浅) + --color-bi-background-light-gray-theme-dark: var(--background-color-light-gray-theme-dark); + //灰色背景(中) + --color-bi-background-medium-gray: var(--background-color-medium-gray); + //深色主题灰色背景(中) + --color-bi-background-medium-gray-theme-dark: var(--background-color-medium-gray-theme-dark); + //灰化背景 + --color-bi-background-disabled: var(--background-color-disabled); + //深色主题灰化背景 + --color-bi-background-disabled-theme-dark: var(--background-color-disabled-theme-dark); + //浅灰化背景 + --color-bi-background-light-disabled: var(--background-color-light-disabled); + //深色主题浅灰化背景 + --color-bi-background-light-disabled-theme-dark: var(--background-color-light-disabled-theme-dark); + //成功背景色 + --color-bi-background-success: var(--background-color-dark-success); + //成功背景色(浅) + --color-bi-background-light-success: var(--background-color-light-success); + //失败背景色 + --color-bi-background-failure: var(--background-color-negative); + //失败背景色(浅) + --color-bi-background-light-failure: var(--background-color-light-negative); + //失败背景色(深) + --color-bi-background-dark-failure: var(--background-color-dark-negative); + //警示背景色 + --color-bi-background-warning: var(--background-color-warning); + //警示背景色(浅) + --color-bi-background-light-warning: var(--background-color-light-warning); + //背景提亮色 + --color-bi-background-highlight: var(--background-color-highlight); + //背景提亮色(浅) + --color-bi-background-light-highlight: var(--background-color-light-highlight); + + //黑色边框色 + --color-bi-border-black: var(--border-color-black); + //默认边框色 + --color-bi-border-default: var(--border-color-default); + //边框线色 + --color-bi-border-line: var(--border-color-line); + //深色主题边框线色 + --color-bi-border-line-theme-dark: var(--border-color-line-theme-dark); + //深灰色边框线 + --color-bi-border-dark-gray-line: var(--border-color-dark-gray-line); + //深灰色主题深色边框线 + --color-bi-border-dark-gray-line-theme-dark: var(--border-color-dark-gray-line-theme-dark); + //深色边框线 + --color-bi-border-dark-line: var(--border-color-dark-line); + //深色主题深色边框线 + --color-bi-border-dark-line-theme-dark: var(--border-color-dark-line-theme-dark); + //灰化边框 + --color-bi-border-disabled: var(--border-color-disabled); + //深色主题灰化边框 + --color-bi-border-disabled-theme-dark: var(--border-color-disabled-theme-dark); + //成功边框色 + --color-bi-border-success: var(--border-color-success); + //失败边框色 + --color-bi-border-failure: var(--border-color-negative); + //警示边框色 + --color-bi-border-warning: var(--border-color-warning); + //边框提亮 + --color-bi-border-highlight: var(--border-color-highlight); + + //颜色百分比 + //green + --color-bi-green-80: fade(@font-color-success, 80); + --color-bi-green-60: fade(@font-color-success, 60); + --color-bi-green-40: fade(@font-color-success, 40); + --color-bi-green-30: fade(@font-color-success, 30); + --color-bi-green-20: fade(@font-color-success, 20); + --color-bi-green-10: fade(@font-color-success, 10); + --color-bi-green-5: fade(@font-color-success, 5); + + //blue + --color-bi-blue-80: fade(@font-color-highlight, 80); + --color-bi-blue-60: fade(@font-color-highlight, 60); + --color-bi-blue-40: fade(@font-color-highlight, 40); + --color-bi-blue-30: fade(@font-color-highlight, 30); + --color-bi-blue-20: fade(@font-color-highlight, 20); + --color-bi-blue-10: fade(@font-color-highlight, 10); + --color-bi-blue-5: fade(@font-color-highlight, 5); + + //light-blue + --color-bi-light-blue-80: fade(@font-color-light-highlight, 80); + --color-bi-light-blue-60: fade(@font-color-light-highlight, 60); + --color-bi-light-blue-40: fade(@font-color-light-highlight, 40); + --color-bi-light-blue-30: fade(@font-color-light-highlight, 30); + --color-bi-light-blue-20: fade(@font-color-light-highlight, 20); + --color-bi-light-blue-10: fade(@font-color-light-highlight, 10); + --color-bi-light-blue-5: fade(@font-color-light-highlight, 5); + + // orange + --color-bi-orange-80: fade(@font-color-warning, 80); + --color-bi-orange-60: fade(@font-color-warning, 60); + --color-bi-orange-40: fade(@font-color-warning, 40); + --color-bi-orange-30: fade(@font-color-warning, 30); + --color-bi-orange-20: fade(@font-color-warning, 20); + --color-bi-orange-10: fade(@font-color-warning, 10); + --color-bi-orange-5: fade(@font-color-warning, 5); + + // red + --color-bi-red-80: fade(@font-color-negative, 80); + --color-bi-red-60: fade(@font-color-negative, 60); + --color-bi-red-40: fade(@font-color-negative, 40); + --color-bi-red-30: fade(@font-color-negative, 30); + --color-bi-red-20: fade(@font-color-negative, 20); + --color-bi-red-10: fade(@font-color-negative, 10); + --color-bi-red-5: fade(@font-color-negative, 5); + + // yellow + --color-bi-yellow-80: fade(@font-color-yellow, 90); + --color-bi-yellow-60: fade(@font-color-yellow, 60); + --color-bi-yellow-40: fade(@font-color-yellow, 40); + --color-bi-yellow-20: fade(@font-color-yellow, 20); + --color-bi-yellow-5: fade(@font-color-yellow, 5); + + + //tooltip + //成功背景(专属配色) + --color-bi-background-tooltip-success: var(--background-color-normal-success); + //成功边框(专属配色) + --color-bi-border-tooltip-success: var(--border-color-normal-success); + //失败背景 + --color-bi-background-tooltip-failure: var(--color-bi-background-failure); + //失败边框 + --color-bi-border-tooltip-failure: var(--color-bi-border-failure); + + //按钮的mask颜色 + --color-bi-background-button-mask: var(--color-bi-background-black); + + //水印字体颜色 + --color-bi-text-water-mark: var(--color-bi-text-tips); + --color-bi-text-water-mark-theme-dark: var(--color-bi-text-tips-theme-dark); + + //toast + --color-bi-background-toast-success: var(--color-bi-background-success); + --color-bi-background-toast-warning: var(--color-bi-background-warning); + --color-bi-background-toast-error: var(--color-bi-background-failure); + --color-bi-background-toast-normal: var(--color-bi-background-highlight); + + //bubble + --color-bi-background-bubble-success: var(--color-bi-background-light-success); + --color-bi-background-bubble-warning: var(--color-bi-background-light-warning); + --color-bi-background-bubble-error: var(--color-bi-background-light-failure); + --color-bi-background-bubble-error-theme-dark: var(--color-bi-background-dark-failure); + --color-bi-background-bubble-normal: var(--color-bi-background-light-highlight); + + //bi-background背景 + --color-bi-background-background: var(--color-bi-background-normal); + --color-bi-background-background-theme-dark: var(--color-bi-background-normal-theme-dark); + --color-bi-text-background: var(--color-bi-text-normal); + --color-bi-text-background-theme-dark: var(--color-bi-text-theme-dark); + + //bi-header-background背景 + --color-bi-background-header-background: var(--color-bi-background-light-gray); + --color-bi-background-header-background-theme-dark: var(--color-bi-background-light-gray-theme-dark); + --color-bi-text-header-background: var(--color-bi-text-light-gray); + --color-bi-text-header-background-theme-dark: var(--color-bi-text-light-gray-theme-dark); + + //bi-card卡片 + --color-bi-background-card: var(--color-bi-background-default); + --color-bi-background-card-theme-dark: var(--color-bi-background-default-theme-dark); + --color-bi-text-card: var(--color-bi-text-normal); + --color-bi-text-card-theme-dark: var(--color-bi-text-theme-dark); +} diff --git a/src/less/widget/date/calendar/picker.date.less b/src/less/widget/date/calendar/picker.date.less deleted file mode 100644 index 056092493..000000000 --- a/src/less/widget/date/calendar/picker.date.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../../index"; - -.bi-date-picker { -} \ No newline at end of file diff --git a/src/less/widget/downlist/combo.downlist.less b/src/less/widget/downlist/combo.downlist.less deleted file mode 100644 index c8b5e3112..000000000 --- a/src/less/widget/downlist/combo.downlist.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-down-list-combo { - -} \ No newline at end of file diff --git a/src/less/widget/month/combo.month.less b/src/less/widget/month/combo.month.less deleted file mode 100644 index 91abdd62d..000000000 --- a/src/less/widget/month/combo.month.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-month-combo{ - -} \ No newline at end of file diff --git a/src/less/widget/month/popup.month.less b/src/less/widget/month/popup.month.less deleted file mode 100644 index 127b4ba32..000000000 --- a/src/less/widget/month/popup.month.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-month-popup{ - -} \ No newline at end of file diff --git a/src/less/widget/multiselect/check/multiselect.display.less b/src/less/widget/multiselect/check/multiselect.display.less deleted file mode 100644 index ed80af730..000000000 --- a/src/less/widget/multiselect/check/multiselect.display.less +++ /dev/null @@ -1,6 +0,0 @@ -@import "../../../index"; - -.bi-display-list { - & .display-list-item { - } -} \ No newline at end of file diff --git a/src/less/widget/multiselect/multiselect.popup.view.less b/src/less/widget/multiselect/multiselect.popup.view.less deleted file mode 100644 index 06a3c8c5f..000000000 --- a/src/less/widget/multiselect/multiselect.popup.view.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - - -.bi-multi-select-popup-view{ -} \ No newline at end of file diff --git a/src/less/widget/multiselect/multiselect.trigger.less b/src/less/widget/multiselect/multiselect.trigger.less deleted file mode 100644 index 32a887595..000000000 --- a/src/less/widget/multiselect/multiselect.trigger.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-multi-select-trigger { - -} \ No newline at end of file diff --git a/src/less/widget/multitree/display.multi.tree.less b/src/less/widget/multitree/display.multi.tree.less deleted file mode 100644 index 9fb5f46c4..000000000 --- a/src/less/widget/multitree/display.multi.tree.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-multi-tree-display{ -} \ No newline at end of file diff --git a/src/less/widget/multitree/search.multi.tree.less b/src/less/widget/multitree/search.multi.tree.less deleted file mode 100644 index 8fa57274d..000000000 --- a/src/less/widget/multitree/search.multi.tree.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-multi-tree-search-pane { -} \ No newline at end of file diff --git a/src/less/widget/multitreelist/multitreelist.popup.less b/src/less/widget/multitreelist/multitreelist.popup.less deleted file mode 100644 index 645ce93d7..000000000 --- a/src/less/widget/multitreelist/multitreelist.popup.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-tree-list-popup { -} \ No newline at end of file diff --git a/src/less/widget/numberinterval/popup.numberinterval.less b/src/less/widget/numberinterval/popup.numberinterval.less deleted file mode 100644 index 70da463c5..000000000 --- a/src/less/widget/numberinterval/popup.numberinterval.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-number-interval-popup{ -} \ No newline at end of file diff --git a/src/less/widget/quarter/combo.quarter.less b/src/less/widget/quarter/combo.quarter.less deleted file mode 100644 index 526ccde48..000000000 --- a/src/less/widget/quarter/combo.quarter.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-quarter-combo{ - -} \ No newline at end of file diff --git a/src/less/widget/quarter/popup.quarter.less b/src/less/widget/quarter/popup.quarter.less deleted file mode 100644 index bd30897ba..000000000 --- a/src/less/widget/quarter/popup.quarter.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-quarter-popup{ - -} \ No newline at end of file diff --git a/src/less/widget/singletree/combo.single.tree.less b/src/less/widget/singletree/combo.single.tree.less deleted file mode 100644 index 127ebf58c..000000000 --- a/src/less/widget/singletree/combo.single.tree.less +++ /dev/null @@ -1,4 +0,0 @@ -@import "../../index"; - -.bi-singletree-combo { -} \ No newline at end of file diff --git a/src/less/widget/year/combo.year.less b/src/less/widget/year/combo.year.less deleted file mode 100644 index 78f368bf6..000000000 --- a/src/less/widget/year/combo.year.less +++ /dev/null @@ -1,5 +0,0 @@ -@import "../../index"; - -.bi-year-combo{ - -} \ No newline at end of file diff --git a/webpack/attachments.js b/webpack/attachments.js index 16ae13072..7b426b8e6 100644 --- a/webpack/attachments.js +++ b/webpack/attachments.js @@ -102,16 +102,8 @@ const bundle = [].concat( ); const bundleModern = [].concat( - basicAttachmentMap.core, - basicAttachmentMap.fixProxy, - basicAttachmentMap.base, - basicAttachmentMap.case, - basicAttachmentMap.widget, + sync(["src/less/modern.less"]), sync(["public/modern/app.less", "public/modern/**/*.less"]), - [fixCompact, workerCompact], - basicAttachmentMap.router, - sync(["public/js/**/*.js", "public/js/index.js", "i18n/i18n.cn.js"]), - basicAttachmentMap.ts, ); const coreJs = [].concat( @@ -179,19 +171,11 @@ const fineui = [].concat( ); const fineuiModern = [].concat( - basicAttachmentMap.core, - basicAttachmentMap.fixProxy, - basicAttachmentMap.base, - basicAttachmentMap.case, - basicAttachmentMap.widget, - basicAttachmentMap.router, - [fixCompact, workerCompact], + sync(["src/less/modern.less"]), sync([ 'ui/modern/app.less', 'ui/modern/**/*.less', - 'ui/js/**/*.js', ]), - basicAttachmentMap.ts, ); const fineuiProxy = [].concat(