@import "../../index.less"; .base-disabled { cursor: not-allowed !important; .cursor-pointer { cursor: not-allowed !important; } .cursor-default { cursor: not-allowed !important; } .cursor-move { cursor: not-allowed !important; } .cursor-text{ cursor: not-allowed !important; } color: @color-bi-text-disabled !important; & .bi-input { color: @color-bi-text-disabled !important; -webkit-text-fill-color: @color-bi-text-disabled; } & .bi-textarea { color: @color-bi-text-disabled !important; -webkit-text-fill-color: @color-bi-text-disabled; } & .b-font:before { color: @color-bi-icon-disabled !important; } } .bi-theme-dark { .base-disabled { color: @color-bi-text-disabled-theme-dark !important; & .bi-input { color: @color-bi-text-disabled-theme-dark !important; -webkit-text-fill-color: @color-bi-text-disabled-theme-dark; } & .bi-textarea { color: @color-bi-text-disabled-theme-dark !important; -webkit-text-fill-color: @color-bi-text-disabled-theme-dark; } & .b-font:before { color: @color-bi-icon-disabled-theme-dark !important; } } } .base-invalid { cursor: default !important; .cursor-pointer { cursor: default !important; } .cursor-default { cursor: default !important; } .cursor-move { cursor: default !important; } .cursor-text{ cursor: default !important; } } //focus时边框高亮 .bi-focus-shadow { &:focus, &:hover { border-color: @color-bi-border-highlight; } // ie下不支持focus-within, 和上面写在一起会导致ie下:hover不生效 &:focus-within { border-color: @color-bi-border-highlight; } &.disabled { &:hover { border-color: @border-color-line; } } } .base-disabled { .bi-focus-shadow { &:hover { border-color: @border-color-line; } } } .bi-theme-dark { .bi-focus-shadow { &.disabled { &:hover { border-color: @border-color-line-theme-dark; } } } } .bi-theme-dark { .base-disabled { .bi-focus-shadow { &:hover { border-color: @border-color-line-theme-dark; } } } } .clearfix { .clearfix(); } //基本背景 .bi-background { background-color: @color-bi-background-normal; color: @color-bi-text-background; & .bi-input { color: @color-bi-text-background; } & .bi-textarea { color: @color-bi-text-background; } } .bi-theme-dark { .bi-background { background-color: @color-bi-background-normal-theme-dark; color: @color-bi-text-background-theme-dark; & .bi-input { color: @color-bi-text-background-theme-dark; } & .bi-textarea { color: @color-bi-text-background-theme-dark; } } } .bi-header-background { background-color: @color-bi-background-header-background; color: @color-bi-text-header-background; & .bi-input { color: @color-bi-text-header-background; } & .bi-textarea { color: @color-bi-text-header-background; } } .bi-theme-dark { .bi-header-background { background-color: @color-bi-background-header-background-theme-dark; color: @color-bi-text-header-background-theme-dark; & .bi-input { color: @color-bi-text-header-background-theme-dark; } & .bi-textarea { color: @color-bi-text-header-background-theme-dark; } } } //card .bi-card { background-color: @color-bi-background-card; color: @color-bi-text-card; & .bi-input { color: @color-bi-text-card; } & .bi-textarea { color: @color-bi-text-card; } &.bi-primary { background-color: @background-color-card-primary; color: @color-card-primary; } } .bi-theme-dark { .bi-card { background-color: @color-bi-background-card-theme-dark; color: @color-bi-text-card-theme-dark; & .bi-input { color: @color-bi-text-card-theme-dark; } & .bi-textarea { color: @color-bi-text-card-theme-dark; } } } //灰化 .bi-disabled { color: @color-bi-text-disabled; & .bi-input { color: @color-bi-text-disabled; } & .bi-textarea { color: @color-bi-text-disabled; } } .bi-theme-dark { .bi-disabled { color: @color-bi-text-disabled-theme-dark; & .bi-input { color: @color-bi-text-disabled-theme-dark; } & .bi-textarea { color: @color-bi-text-disabled-theme-dark; } } } // 提示区域, 灰色字体 .bi-tips { color: @color-bi-text-tips; & .bi-input { color: @color-bi-text-tips; } & .bi-textarea { color: @color-bi-text-tips; } } .bi-theme-dark { .bi-tips { color: @color-bi-text-tips-theme-dark; & .bi-input { color: @color-bi-text-tips-theme-dark;; } & .bi-textarea { color: @color-bi-text-tips-theme-dark; } } } // 边框 .bi-border { border: 1px solid @color-bi-border-line; &.disabled { border-color: @color-bi-border-disabled !important; } &.error { border-color: @border-color-negative; } } .bi-border-top { border-top: 1px solid @color-bi-border-line; &.disabled { border-color: @color-bi-border-disabled !important; } &.error { border-color: @border-color-negative; } } .bi-border-right { border-right: 1px solid @color-bi-border-line; &.disabled { border-color: @color-bi-border-disabled !important; } &.error { border-color: @border-color-negative; } } .bi-border-bottom { border-bottom: 1px solid @color-bi-border-line; &.disabled { border-color: @color-bi-border-disabled !important; } &.error { border-color: @border-color-negative; } } .bi-border-left { border-left: 1px solid @color-bi-border-line; &.disabled { border-color: @color-bi-border-disabled !important; } &.error { border-color: @border-color-negative; } } .bi-theme-dark { .bi-border { border: 1px solid @color-bi-border-line-theme-dark; &.disabled { border-color: @color-bi-border-disabled-theme-dark !important; } } .bi-border-top { border-top: 1px solid @color-bi-border-line-theme-dark; &.disabled { border-color: @color-bi-border-disabled-theme-dark !important; } } .bi-border-right { border-right: 1px solid @color-bi-border-line-theme-dark; &.disabled { border-color: @color-bi-border-disabled-theme-dark !important; } } .bi-border-bottom { border-bottom: 1px solid @color-bi-border-line-theme-dark; &.disabled { border-color: @color-bi-border-disabled-theme-dark !important; } } .bi-border-left { border-left: 1px solid @color-bi-border-line-theme-dark; &.disabled { border-color: @color-bi-border-disabled-theme-dark !important; } } } // 分割线 .bi-split { border: 1px solid @border-color-light-line; } .bi-split-top { border-top: 1px solid @border-color-light-line; } .bi-split-right { border-right: 1px solid @border-color-light-line; } .bi-split-bottom { border-bottom: 1px solid @border-color-light-line; } .bi-split-left { border-left: 1px solid @border-color-light-line; } .bi-theme-dark { .bi-split { border: 1px solid @border-color-light-line-theme-dark; } .bi-split-top { border-top: 1px solid @border-color-light-line-theme-dark; } .bi-split-right { border-right: 1px solid @border-color-light-line-theme-dark; } .bi-split-bottom { border-bottom: 1px solid @border-color-light-line-theme-dark; } .bi-split-left { border-left: 1px solid @border-color-light-line-theme-dark; } } // 字体 .bi-font-helvetica-neue { font-family: "Helvetica Neue", Arial, Verdana, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Heiti, serif; } .bi-font-verdana { font-family: Verdana, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Heiti, serif; } .bi-font-arial { font-family: Arial, "Helvetica Neue", Verdana, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Heiti, serif; } .bi-font-PingFang { font-family: "PingFang SC", "Helvetica Neue", Verdana, Arial, "Hiragino Sans GB", "Microsoft YaHei", Heiti, serif; } .bi-font-hiragino-sans { font-family: "Hiragino Sans GB", "Helvetica Neue", Verdana, Arial, "PingFang SC", "Microsoft YaHei", Heiti, serif; } .bi-font-microsoft-yaHei { font-family: "Microsoft YaHei", "Helvetica Neue", Verdana, Arial, "PingFang SC", "Hiragino Sans GB", Heiti, serif; } .bi-font-heiti { font-family: Heiti, "Helvetica Neue", Verdana, Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", serif; } .bi-border-radius { .border-radius(2px); } .bi-border-corner-left-radius { .border-corner-left-radius(2px, 2px); } .bi-border-corner-right-radius { .border-corner-right-radius(2px, 2px); } .bi-font-bold { font-weight: 700; } // 标红 .bi-keyword-red-mark { color: @color-bi-text-redmark; & .bi-input { color: @color-bi-text-redmark; } & .bi-textarea { color: @color-bi-text-redmark; } } // 高亮 .bi-high-light { color: @color-bi-text-highlight; & .bi-input { color: @color-bi-text-highlight; } & .bi-textarea { color: @color-bi-text-highlight; } } .bi-error { color: @color-bi-text-failure; & .bi-input { color: @color-bi-text-failure; } & .bi-textarea { color: @color-bi-text-failure; } } .bi-high-light-background { background-color: @color-bi-background-highlight; color: @color-bi-text; & .bi-input { color: @color-bi-text; } & .bi-textarea { color: @color-bi-text; } } .bi-error-background { background-color: @color-bi-background-failure; color: @color-bi-text; & .bi-input { color: @color-bi-text; } & .bi-textarea { color: @color-bi-text; } } .bi-high-light-border { border: 1px solid @color-bi-border-highlight; &.disabled { border-color: @color-bi-border-disabled !important; } } .bi-high-light-border-top { border-top: 1px solid @color-bi-border-highlight; &.disabled { border-color: @color-bi-border-disabled !important; } } .bi-high-light-border-right { border-right: 1px solid @color-bi-border-highlight; &.disabled { border-color: @color-bi-border-disabled !important; } } .bi-high-light-border-bottom { border-bottom: 1px solid @color-bi-border-highlight; &.disabled { border-color: @color-bi-border-disabled !important; } } .bi-high-light-border-left { border-left: 1px solid @color-bi-border-highlight; &.disabled { border-color: @color-bi-border-disabled !important; } } // 水印 .bi-water-mark { color: @color-bi-text-water-mark; cursor: text; .user-select-disable(); & .bi-input { color: @color-bi-text-water-mark; } & .bi-textarea { color: @color-bi-text-water-mark; } } .bi-theme-dark { .bi-water-mark { color: @color-bi-text-water-mark-theme-dark; & .bi-input { color: @color-bi-text-water-mark-theme-dark; } & .bi-textarea { color: @color-bi-text-water-mark-theme-dark; } } } // resizer .bi-resizer { background: @color-bi-background-black; .opacity(0.2); z-index: @zIndex-tip !important; } .bi-theme-dark { .bi-resizer { background: @color-bi-background-default; } } // 蒙板 .bi-mask { color: @color-bi-text; & .bi-input { color: @color-bi-text; } & .bi-textarea { color: @color-bi-text; } .background-color(@color-bi-background-black, 20%); } .bi-theme-dark { .bi-mask { color: @color-bi-text-white-theme-dark; & .bi-input { color: @color-bi-text-white-theme-dark; } & .bi-textarea { color: @color-bi-text-white-theme-dark; } .background-color(@color-bi-background-default, 20%); } } // 遮罩 .bi-z-index-mask { .background-color(@color-bi-background-black, 50%); } .bi-theme-dark { .bi-z-index-mask { //color: @color-bi-background-default; //& .bi-input { // color: @color-bi-background-default; //} //& .bi-textarea { // color: @color-bi-background-default; //} .background-color(@color-bi-background-black-theme-dark, 50%); } } // hover-visible的原子化形式 .bi-hover-visible-container { &:where(:not(&:hover)) .bi-hover-visible-item:not(.bi-combo-popup) { display: none; } //& .bi-hover-visible-item { // display: none; //} //&:hover .bi-hover-visible-item { // display: block; // &.bi-f-h, &.bi-f-v, &.bi-f-s-h, &.bi-f-s-v { // display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ // display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ // display: -ms-flexbox; /* TWEENER - IE 10 */ // display: -webkit-flex; /* NEW - Chrome */ // display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ // } // &.i-item { // display: inline-block; // } //} & .bi-hover-visible-item:not(.bi-combo-popup) { visibility: hidden; } &:hover .bi-hover-visible-item:not(.bi-combo-popup) { visibility: visible; } }