forked from fanruan/fineui
guy
3 years ago
9 changed files with 187 additions and 838 deletions
@ -1,2 +0,0 @@
|
||||
@import "lib/colors-modern"; |
||||
@import "lib/theme-modern"; |
||||
@ -1,181 +0,0 @@
|
||||
@import "constant"; |
||||
|
||||
// 通用色彩库。从constant.less中获取相关颜色,不要出现#xxxxxx |
||||
|
||||
//默认字体颜色 |
||||
@color-bi-text-normal: var(--color-bi-text-normal); |
||||
//深色主题默认字体颜色 |
||||
@color-bi-text-theme-dark: var(--color-bi-text-theme-dark); |
||||
@color-bi-text-normal-theme-dark: var(--color-bi-text-normal-theme-dark); |
||||
//黑色字体颜色 |
||||
@color-bi-text-black: var(--color-bi-text-black); |
||||
//深色主题黑色字体颜色 |
||||
@color-bi-text-black-theme-dark: var(--color-bi-text-black-theme-dark); |
||||
//灰色字体颜色 |
||||
@color-bi-text-gray: var(--color-bi-text-gray); |
||||
//浅灰色字体 |
||||
@color-bi-text-light-gray: var(--color-bi-text-light-gray); |
||||
//深色主题浅灰色字体 |
||||
@color-bi-text-light-gray-theme-dark: var(--color-bi-text-light-gray-theme-dark); |
||||
//白色字体颜色 |
||||
@color-bi-text: var(--color-bi-text); |
||||
@color-bi-text-white: var(--color-bi-text-white); |
||||
//深色主题白色字体颜色 |
||||
@color-bi-text-white-theme-dark: var(--color-bi-text-white-theme-dark); |
||||
//灰化字体颜色 |
||||
@color-bi-text-disabled: var(--color-bi-text-disabled); |
||||
//深色主题灰化字体颜色 |
||||
@color-bi-text-disabled-theme-dark: var(--color-bi-text-disabled-theme-dark); |
||||
//灰化图标色 |
||||
@color-bi-icon-disabled: var(--color-bi-icon-disabled); |
||||
//深色主题灰化图标颜色 |
||||
@color-bi-icon-disabled-theme-dark: var(--color-bi-icon-disabled-theme-dark); |
||||
//提示字体颜色 |
||||
@color-bi-text-tips: var(--color-bi-text-tips); |
||||
//深色主题提示字体颜色 |
||||
@color-bi-text-tips-theme-dark: var(--color-bi-text-tips-theme-dark); |
||||
//成功字体颜色 |
||||
@color-bi-text-success: var(--color-bi-text-success); |
||||
//失败字体颜色 |
||||
@color-bi-text-failure: var(--color-bi-text-failure); |
||||
//基本提亮颜色 |
||||
@color-bi-text-highlight: var(--color-bi-text-highlight); |
||||
//标红色 |
||||
@color-bi-text-redmark: var(--color-bi-text-redmark); |
||||
|
||||
//普通背景 |
||||
@color-bi-background-normal: var(--color-bi-background-normal); |
||||
//深色主题普通背景 |
||||
@color-bi-background-normal-theme-dark: var(--color-bi-background-normal-theme-dark); |
||||
//默认背景 |
||||
@color-bi-background-default: var(--color-bi-background-default); |
||||
//深色主题默认背景 |
||||
@color-bi-background-default-theme-dark: var(--color-bi-background-default-theme-dark); |
||||
//黑色背景 |
||||
@color-bi-background-black: var(--color-bi-background-black); |
||||
//深色主题黑色背景 |
||||
@color-bi-background-black-theme-dark: var(--color-bi-background-black-theme-dark); |
||||
//浅黑色背景 |
||||
@color-bi-background-light-black: var(--color-bi-background-light-black); |
||||
//深色主题浅黑色背景 |
||||
@color-bi-background-light-black-theme-dark: var(--color-bi-background-light-black-theme-dark); |
||||
//深灰色背景 |
||||
@color-bi-background-dark-gray: var(--color-bi-background-dark-gray); |
||||
//深色主题深灰色背景 |
||||
@color-bi-background-dark-gray-theme-dark: var(--color-bi-background-dark-gray-theme-dark); |
||||
//灰色背景(浅) |
||||
@color-bi-background-light-gray: var(--color-bi-background-light-gray); |
||||
//深色主题灰色背景(浅) |
||||
@color-bi-background-light-gray-theme-dark: var(--color-bi-background-light-gray-theme-dark); |
||||
//灰色背景(中) |
||||
@color-bi-background-medium-gray: var(--color-bi-background-medium-gray); |
||||
//深色主题灰色背景(中) |
||||
@color-bi-background-medium-gray-theme-dark: var(--color-bi-background-medium-gray-theme-dark); |
||||
//灰化背景 |
||||
@color-bi-background-disabled: var(--color-bi-background-disabled); |
||||
//深色主题灰化背景 |
||||
@color-bi-background-disabled-theme-dark: var(--color-bi-background-disabled-theme-dark); |
||||
//浅灰化背景 |
||||
@color-bi-background-light-disabled: var(--color-bi-background-light-disabled); |
||||
//深色主题浅灰化背景 |
||||
@color-bi-background-light-disabled-theme-dark: var(--color-bi-background-light-disabled-theme-dark); |
||||
//成功背景色 |
||||
@color-bi-background-success: var(--color-bi-background-success); |
||||
//成功背景色(浅) |
||||
@color-bi-background-light-success: var(--color-bi-background-light-success); |
||||
//失败背景色 |
||||
@color-bi-background-failure: var(--color-bi-background-failure); |
||||
//失败背景色(浅) |
||||
@color-bi-background-light-failure: var(--color-bi-background-light-failure); |
||||
//失败背景色(深) |
||||
@color-bi-background-dark-failure: var(--color-bi-background-dark-failure); |
||||
//警示背景色 |
||||
@color-bi-background-warning: var(--color-bi-background-warning); |
||||
//警示背景色(浅) |
||||
@color-bi-background-light-warning: var(--color-bi-background-light-warning); |
||||
//背景提亮色 |
||||
@color-bi-background-highlight: var(--color-bi-background-highlight); |
||||
//背景提亮色(浅) |
||||
@color-bi-background-light-highlight: var(--color-bi-background-light-highlight); |
||||
|
||||
//黑色边框色 |
||||
@color-bi-border-black: var(--color-bi-border-black); |
||||
//默认边框色 |
||||
@color-bi-border-default: var(--color-bi-border-default); |
||||
//边框线色 |
||||
@color-bi-border-line: var(--color-bi-border-line); |
||||
//深色主题边框线色 |
||||
@color-bi-border-line-theme-dark: var(--color-bi-border-line-theme-dark); |
||||
//深灰色边框线 |
||||
@color-bi-border-dark-gray-line: var(--color-bi-border-dark-gray-line); |
||||
//深灰色主题深色边框线 |
||||
@color-bi-border-dark-gray-line-theme-dark: var(--color-bi-border-dark-gray-line-theme-dark); |
||||
//深色边框线 |
||||
@color-bi-border-dark-line: var(--color-bi-border-dark-line); |
||||
//深色主题深色边框线 |
||||
@color-bi-border-dark-line-theme-dark: var(--color-bi-border-dark-line-theme-dark); |
||||
//灰化边框 |
||||
@color-bi-border-disabled: var(--color-bi-border-disabled); |
||||
//深色主题灰化边框 |
||||
@color-bi-border-disabled-theme-dark: var(--color-bi-border-disabled-theme-dark); |
||||
//成功边框色 |
||||
@color-bi-border-success: var(--color-bi-border-success); |
||||
//失败边框色 |
||||
@color-bi-border-failure: var(--color-bi-border-failure); |
||||
//警示边框色 |
||||
@color-bi-border-warning: var(--color-bi-border-warning); |
||||
//边框提亮 |
||||
@color-bi-border-highlight: var(--color-bi-border-highlight); |
||||
|
||||
//颜色百分比 |
||||
//green |
||||
@color-bi-green-80: var(--color-bi-green-80); |
||||
@color-bi-green-60: var(--color-bi-green-60); |
||||
@color-bi-green-40: var(--color-bi-green-40); |
||||
@color-bi-green-30: var(--color-bi-green-30); |
||||
@color-bi-green-20: var(--color-bi-green-20); |
||||
@color-bi-green-10: var(--color-bi-green-10); |
||||
@color-bi-green-5: var(--color-bi-green-5); |
||||
|
||||
//blue |
||||
@color-bi-blue-80: var(--color-bi-blue-80); |
||||
@color-bi-blue-60: var(--color-bi-blue-60); |
||||
@color-bi-blue-40: var(--color-bi-blue-40); |
||||
@color-bi-blue-30: var(--color-bi-blue-30); |
||||
@color-bi-blue-20: var(--color-bi-blue-20); |
||||
@color-bi-blue-10: var(--color-bi-blue-10); |
||||
@color-bi-blue-5: var(--color-bi-blue-5); |
||||
|
||||
//light-blue |
||||
@color-bi-light-blue-80: var(--color-bi-light-blue-80); |
||||
@color-bi-light-blue-60: var(--color-bi-light-blue-60); |
||||
@color-bi-light-blue-40: var(--color-bi-light-blue-40); |
||||
@color-bi-light-blue-30: var(--color-bi-light-blue-30); |
||||
@color-bi-light-blue-20: var(--color-bi-light-blue-20); |
||||
@color-bi-light-blue-10: var(--color-bi-light-blue-10); |
||||
@color-bi-light-blue-5: var(--color-bi-light-blue-5); |
||||
|
||||
// orange |
||||
@color-bi-orange-80: var(--color-bi-orange-80); |
||||
@color-bi-orange-60: var(--color-bi-orange-60); |
||||
@color-bi-orange-40: var(--color-bi-orange-40); |
||||
@color-bi-orange-30: var(--color-bi-orange-30); |
||||
@color-bi-orange-20: var(--color-bi-orange-20); |
||||
@color-bi-orange-10: var(--color-bi-orange-10); |
||||
@color-bi-orange-5: var(--color-bi-orange-5); |
||||
|
||||
// red |
||||
@color-bi-red-80: var(--color-bi-red-80); |
||||
@color-bi-red-60: var(--color-bi-red-60); |
||||
@color-bi-red-40: var(--color-bi-red-40); |
||||
@color-bi-red-30: var(--color-bi-red-30); |
||||
@color-bi-red-20: var(--color-bi-red-20); |
||||
@color-bi-red-10: var(--color-bi-red-10); |
||||
@color-bi-red-5: var(--color-bi-red-5); |
||||
|
||||
// yellow |
||||
@color-bi-yellow-80: var(--color-bi-yellow-80); |
||||
@color-bi-yellow-60: var(--color-bi-yellow-60); |
||||
@color-bi-yellow-40: var(--color-bi-yellow-40); |
||||
@color-bi-yellow-20: var(--color-bi-yellow-20); |
||||
@color-bi-yellow-5: var(--color-bi-yellow-5); |
||||
@ -1,467 +0,0 @@
|
||||
////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/utils/motion/fade.less"; |
||||
//@import "core/utils/motion/move.less"; |
||||
//@import "core/utils/motion/slide.less"; |
||||
//@import "core/utils/motion/zoom.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/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/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"; |
||||
|
||||
@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: #647185; |
||||
|
||||
//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); |
||||
} |
||||
Loading…
Reference in new issue