You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
771 lines
18 KiB
771 lines
18 KiB
@import "../../index.less"; |
|
|
|
// hover的时候背景变化,文字变黑 |
|
.bi-list-item { |
|
&:hover, &.hover { |
|
color: @color-bi-text-black; |
|
& .bi-input { |
|
color: @color-bi-text-black; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-black; |
|
} |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item { |
|
&:hover, &.hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
// active的时候边框高亮 |
|
.bi-list-item-border { |
|
&:active, &.active { |
|
border: 1px solid @color-bi-border-highlight; |
|
} |
|
} |
|
|
|
// 极简,hover的时候文字高亮 |
|
.bi-list-item-simple { |
|
&:hover, &.hover { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
} |
|
&.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; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-simple { |
|
&.disabled { |
|
&, &:hover, &:active { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候文字变黑 |
|
// active的时候文字高亮 |
|
.bi-list-item-effect { |
|
&:hover { |
|
color: @color-bi-text-black; |
|
& .bi-input { |
|
color: @color-bi-text-black; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-black; |
|
} |
|
} |
|
&.active, &:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
} |
|
&.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; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-effect { |
|
&:hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
} |
|
&.active, &:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候背景变化,文字变黑 |
|
// :active的时候文字高亮,背景变化 |
|
.bi-list-item-active { |
|
&:hover, &.hover { |
|
color: @color-bi-text-black; |
|
& .bi-input { |
|
color: @color-bi-text-black; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-black; |
|
} |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
.background-color(@color-bi-background-highlight, 15%); |
|
} |
|
&.active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-active { |
|
&:hover, &.hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
.background-color(@color-bi-background-default, 5%); |
|
} |
|
&.active, &:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
.background-color(@color-bi-background-default, 5%); |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候背景变化,文字变黑 |
|
// active的时候文字高亮,背景变化 |
|
.bi-list-item-active2 { |
|
&:hover, &.hover { |
|
color: @color-bi-text-black; |
|
& .bi-input { |
|
color: @color-bi-text-black; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-black; |
|
} |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&:active, &.active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
.background-color(@color-bi-background-highlight, 15%); |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-active2 { |
|
&:hover, &.hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&:active, &.active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
.background-color(@color-bi-background-highlight, 15%); |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候背景变化 -- 变灰 |
|
// active的时候文字高亮背景变化 -- 变灰 |
|
.bi-list-item-active3, .bi-list-item-select3 { |
|
&:hover, &.hover { |
|
background-color: @color-bi-background-normal; |
|
} |
|
&:active, &.active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
background-color: @color-bi-background-normal; |
|
} |
|
&.disabled { |
|
&:hover, &.hover, &:active, &.active { |
|
background-color: @color-bi-background-default !important; |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-active3, .bi-list-item-select3 { |
|
&:hover, &.hover { |
|
background-color: @color-bi-background-normal-theme-dark; |
|
} |
|
&:active, &.active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
background-color: @color-bi-background-normal-theme-dark; |
|
} |
|
&.disabled { |
|
&:hover, &.hover, &:active, &.active { |
|
background-color: @color-bi-background-default-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候背景变化 |
|
// active的时候背景高亮 |
|
.bi-list-item-select { |
|
&:hover, &.hover { |
|
.background-color(@color-bi-background-highlight, 10%); |
|
} |
|
&:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
.background-color(@color-bi-background-highlight, 15%); |
|
} |
|
&.active { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
background-color: @color-bi-background-highlight; |
|
& .bi-high-light { |
|
color: @color-bi-text; |
|
} |
|
} |
|
&.button-success { |
|
&:active, &.active { |
|
color: @color-bi-text; |
|
background-color: @color-bi-background-success; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text; |
|
} |
|
&.bi-high-light-border { |
|
border-color: @color-bi-border-success; |
|
} |
|
} |
|
} |
|
&.button-warning { |
|
& { |
|
color: @color-bi-text-failure; |
|
& .bi-input { |
|
color: @color-bi-text-failure; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-failure; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-failure; |
|
} |
|
&.bi-high-light-border { |
|
border-color: @color-bi-border-failure; |
|
} |
|
} |
|
&:hover, &.hover { |
|
color: @color-bi-text-failure; |
|
& .bi-input { |
|
color: @color-bi-text-failure; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-failure; |
|
} |
|
background-color: @color-bi-background-light-failure; |
|
& .bi-high-light { |
|
color: @color-bi-text-failure; |
|
} |
|
&.bi-high-light-border { |
|
border-color: @color-bi-border-failure; |
|
} |
|
} |
|
&:active, &.active { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
background-color: @color-bi-background-failure; |
|
& .bi-high-light { |
|
color: @color-bi-text; |
|
} |
|
&.bi-high-light-border { |
|
border-color: @color-bi-border-failure; |
|
} |
|
} |
|
} |
|
&.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 !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text !important; |
|
} |
|
background-color: @color-bi-background-dark-gray !important; |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
&.bi-high-light-border { |
|
border-color: @color-bi-border-disabled; |
|
} |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-select { |
|
&:hover, &.hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
.background-color(@color-bi-background-default, 5%); |
|
} |
|
&:active { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
.background-color(@color-bi-background-default, 5%); |
|
} |
|
&.active { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
background-color: @color-bi-background-highlight; |
|
& .bi-high-light { |
|
color: @color-bi-text; |
|
} |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
&.hover, &.active { |
|
background-color: @background-color-black-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
// hover的时候边框高亮,文字变黑 |
|
// :active的时候文字高亮，边框高亮 |
|
// .active的时候背景高亮，边框高亮 |
|
.bi-list-item-select2 { |
|
&:hover, &.hover { |
|
color: @color-bi-text-black; |
|
& .bi-input { |
|
color: @color-bi-text-black; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-black; |
|
} |
|
&.bi-border { |
|
border-color: @color-bi-border-highlight; |
|
} |
|
} |
|
&:active { |
|
color: @color-bi-text-highlight; |
|
& .bi-input { |
|
color: @color-bi-text-highlight; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-highlight; |
|
} |
|
&.bi-border { |
|
border-color: @color-bi-border-highlight; |
|
} |
|
} |
|
&.active { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
&.bi-border { |
|
border-color: @color-bi-border-highlight; |
|
} |
|
background-color: @color-bi-background-highlight; |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.bi-theme-dark { |
|
.bi-list-item-select2 { |
|
&:hover, &.hover { |
|
color: @color-bi-text; |
|
& .bi-input { |
|
color: @color-bi-text; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text; |
|
} |
|
} |
|
|
|
&.active { |
|
background-color: @color-bi-background-default-theme-dark; |
|
} |
|
|
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
&.active { |
|
background-color: @background-color-black-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
|
|
// 去掉list-item效果 |
|
.bi-list-item-none { |
|
&:hover, &.hover { |
|
color: inherit; |
|
& .bi-input { |
|
color: inherit; |
|
} |
|
& .bi-textarea { |
|
color: inherit; |
|
} |
|
background-color: transparent; |
|
} |
|
&:active, &.active { |
|
color: inherit; |
|
& .bi-input { |
|
color: inherit; |
|
} |
|
& .bi-textarea { |
|
color: inherit; |
|
} |
|
background-color: transparent; |
|
& .bi-high-light { |
|
color: inherit; |
|
} |
|
} |
|
&.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-theme-dark { |
|
.bi-list-item-none { |
|
&:hover, &.hover { |
|
color: inherit; |
|
& .bi-input { |
|
color: inherit; |
|
} |
|
& .bi-textarea { |
|
color: inherit; |
|
} |
|
background-color: transparent; |
|
} |
|
&:active, &.active { |
|
color: inherit; |
|
& .bi-input { |
|
color: inherit; |
|
} |
|
& .bi-textarea { |
|
color: inherit; |
|
} |
|
background-color: transparent; |
|
& .bi-high-light { |
|
color: inherit; |
|
} |
|
} |
|
&.disabled { |
|
&, &:hover, &:active { |
|
background-color: transparent !important; |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
& .bi-input { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-textarea { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
& .bi-high-light { |
|
color: @color-bi-text-disabled-theme-dark !important; |
|
} |
|
} |
|
} |
|
} |
|
}
|
|
|