@cw-devops/bk-magic-vue/lib/ui/table-plus.css

基于蓝鲸 Magicbox 和 Vue 的前端组件库

.bk-table-plus{

  position:relative;
  overflow:hidden;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  -webkit-box-flex:1;
      -ms-flex:1;
          flex:1;
  width:100%;
  max-width:100%;
  background-color:#FFFFFF;
  font-size:12px;
  color:#081E40;
  border-top:1px solid #EBEEF5;
}
  .bk-table-plus .bk-table-plus-column--index .cell, .bk-table-plus .bk-table-plus-column--selection .cell{
      text-align:center;
      -webkit-box-pack:center;
          -ms-flex-pack:center;
              justify-content:center;
    }
  .bk-table-plus ::-webkit-scrollbar{
    	width:8px;
    	height:8px;
    	background-color:#F5F5F5;
    }
  .bk-table-plus ::-webkit-scrollbar-track{
    -webkit-box-shadow:inset 0 0 6px #fff;
    border-radius:10px;
    background-color:#fff;
  }
  .bk-table-plus ::-webkit-scrollbar-thumb{
    border-radius:10px;
    -webkit-box-shadow:inset 0 0 6px #CBD5E0;
    background-color:rgba(203, 213, 224, 0.5);
  }
  .bk-table-plus ::-webkit-scrollbar-thumb:hover{
    background-color:#CBD5E0;

  }
  .bk-table-plus .bk-icon{
    color:#8797aa;
  }
  .bk-table-plus th{
    font-weight:normal;
    height:40px;
  }
  .bk-table-plus tr{
    height:40px;
  }
  .bk-table-plus .bk-button-text{
    padding:0 10px 0 0;
  }
.bk-table-plus__empty-block{
  min-height:60px;
  text-align:center;
  width:100%;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
      -ms-flex-pack:center;
          justify-content:center;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
}
.bk-table-plus__empty-text{
  line-height:60px;
  width:50%;
  color:#8797aa;
}
.bk-table-plus__expand-column .cell{
  padding:0;
  text-align:center;
}
.bk-table-plus__expand-icon{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  position:relative;
  cursor:pointer;
  color:#666;
  font-size:20px;
  -webkit-transition:-webkit-transform 0.2s ease-in-out;
  transition:-webkit-transform 0.2s ease-in-out;
  transition:transform 0.2s ease-in-out;
  transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
  height:20px;
}
.bk-table-plus__expand-icon--expanded{
  -webkit-transform:rotate(90deg);
          transform:rotate(90deg);
}
.bk-table-plus__expand-icon > .el-icon{
  position:absolute;
  left:50%;
  top:50%;
  margin-left:-5px;
  margin-top:-5px;
}
.bk-table-plus__expanded-cell{
  background-color:#FFFFFF;
}
.bk-table-plus__expanded-cell[class*=cell]{
  padding:20px 50px;
}
.bk-table-plus__expanded-cell:hover{
  background-color:transparent !important;
}
.bk-table-plus__placeholder{
  display:inline-block;
  width:20px;
}
.bk-table-plus__append-wrapper{
  overflow:hidden;
}
.bk-table-plus--fit{
  border-right:0;
  border-bottom:0;
}
.bk-table-plus--fit .bk-table-plus__cell.gutter{
  border-right-width:1px;
}
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper::-webkit-scrollbar,
  .bk-table-plus--scrollable-y .bk-table-plus__body-wrapper::-webkit-scrollbar{
    width:8px;
    height:8px;
    background-color:#fff;
  }
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper,
.bk-table-plus--scrollable-y .bk-table-plus__body-wrapper{
}
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper::-webkit-scrollbar-track,
  .bk-table-plus--scrollable-y .bk-table-plus__body-wrapper::-webkit-scrollbar-track{
    border-radius:4px;
    background-color:#fff;
  }
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper,
.bk-table-plus--scrollable-y .bk-table-plus__body-wrapper{
}
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper::-webkit-scrollbar-thumb,
  .bk-table-plus--scrollable-y .bk-table-plus__body-wrapper::-webkit-scrollbar-thumb{
    border-radius:4px;
    border-color:rgba(203, 213, 224, 0.5);
    background-color:rgba(203, 213, 224, 0.5);
  }
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper::-webkit-scrollbar-thumb:hover, .bk-table-plus--scrollable-y .bk-table-plus__body-wrapper::-webkit-scrollbar-thumb:hover{
    border-color:#CBD5E0;
    background-color:#CBD5E0;
  }
.bk-table-plus--scrollable-x .bk-table-plus__body-wrapper{
  overflow-x:auto;
}
.bk-table-plus--scrollable-y .bk-table-plus__body-wrapper{
  overflow-y:auto;
}
.bk-table-plus thead{

  color:#8797aa;
  font-weight:400;
}
.bk-table-plus thead.is-group th.bk-table-plus__cell{
  background:#fafbfd;
}
.bk-table-plus .bk-table-plus__cell{
  min-width:0;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  text-overflow:ellipsis;
  vertical-align:middle;
  position:relative;
  text-align:left;
}
.bk-table-plus .bk-table-plus__cell.is-center{
  text-align:center;
}
.bk-table-plus .bk-table-plus__cell.is-right{
  text-align:right;
}
.bk-table-plus .bk-table-plus__cell.gutter{
  width:15px;
  border-right-width:0;
  border-bottom-width:0;
  padding:0;
}
.bk-table-plus .bk-table-plus__cell.is-hidden > *{
  visibility:hidden;
}
.bk-table-plus--medium .bk-table-plus__cell{
  padding:10px 0;
}
.bk-table-plus--small{
  font-size:12px;
}
.bk-table-plus--small .bk-table-plus__cell{
  padding:8px 0;
}
.bk-table-plus--mini{
  font-size:12px;
}
.bk-table-plus--mini .bk-table-plus__cell{
  padding:6px 0;
}
.bk-table-plus tr{
  background-color:#FFFFFF;
}
.bk-table-plus tr input[type=checkbox]{
  margin:0;
}
.bk-table-plus th.bk-table-plus__cell.is-leaf,
.bk-table-plus td.bk-table-plus__cell{
  border-bottom:1px solid #EBEEF5;
}
.bk-table-column-filter-trigger{
  font-size:20px;
  display:-webkit-inline-box;
  display:-ms-inline-flexbox;
  display:inline-flex;
}
.bk-table-plus th.bk-table-plus__cell.is-sortable,
.bk-table-column-filter-trigger{
  cursor:pointer;
}
.bk-table-plus th.bk-table-plus__cell{
  overflow:hidden;
  -webkit-user-select:none;
     -moz-user-select:none;
      -ms-user-select:none;
          user-select:none;
  background-color:#fafbfd;
}
.bk-table-plus th.bk-table-plus__cell > .cell{
  display:inline-block;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  position:relative;
  vertical-align:middle;
  padding-left:10px;
  padding-right:10px;
  width:100%;
}
.bk-table-plus th.bk-table-plus__cell > .cell.highlight{
  color:#3a84ff;
}
.bk-table-plus th.bk-table-plus__cell.required > div::before{
  display:inline-block;
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ff4d51;
  margin-right:5px;
  vertical-align:middle;
}
.bk-table-plus td.bk-table-plus__cell div{
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
}
.bk-table-plus td.bk-table-plus__cell.gutter{
  width:0;
}
.bk-table-plus .cell{
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  word-break:break-all;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  padding-left:10px;
  padding-right:10px;
}
.bk-table-plus--group, .bk-table-plus--border{
  border:1px solid #EBEEF5;
}
.bk-table-plus::before, .bk-table-plus--group::after, .bk-table-plus--border::after{
  content:"";
  position:absolute;
  background-color:#EBEEF5;
  z-index:1;
}
.bk-table-plus--group::after, .bk-table-plus--border::after{
  top:0;
  right:0px;
  width:1px;
  height:100%;
}
.bk-table-plus::before{
  left:0;
  bottom:0px;
  width:100%;
  height:1px;
}
.bk-table-plus--border{
  border-right:none;
  border-bottom:none;
}
.bk-table-plus--border.el-loading-parent--relative{
  border-color:transparent;
}
.bk-table-plus--border .bk-table-plus__cell{
  border-right:1px solid #EBEEF5;
}
.bk-table-plus--border .bk-table-plus__cell:first-child .cell{
  padding-left:10px;
}
.bk-table-plus--border th.bk-table-plus__cell.gutter:last-of-type{
  border-bottom:1px solid #EBEEF5;
  border-bottom-width:1px;
}
.bk-table-plus--border th.bk-table-plus__cell{
  border-bottom:1px solid #EBEEF5;
}
.bk-table-plus--hidden{
  visibility:hidden;
}
.bk-table-plus__fixed, .bk-table-plus__fixed-right{
  position:absolute;
  top:0;
  left:0;
  overflow-x:hidden;
  overflow-y:hidden;
  -webkit-box-shadow:0 0 8px rgba(0, 0, 0, 0.12);
          box-shadow:0 0 8px rgba(0, 0, 0, 0.12);
}
.bk-table-plus--fluid-height .bk-table-plus__fixed::before{
    bottom:-1px;
  }
.bk-table-plus__fixed::before, .bk-table-plus__fixed-right::before{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:1px;
  background-color:#EBEEF5;
  z-index:4;
}
.bk-table-plus__fixed::before{
  bottom:1px;
}
.bk-table-plus__fixed-right-patch{
  position:absolute;
  top:-1px;
  right:0;
  background-color:#FFFFFF;
  border-bottom:1px solid #EBEEF5;
}
.bk-table-plus__fixed-right{
  top:0;
  left:auto;
  right:0;
}
.bk-table-plus__fixed-right .bk-table-plus__fixed-header-wrapper,
.bk-table-plus__fixed-right .bk-table-plus__fixed-body-wrapper,
.bk-table-plus__fixed-right .bk-table-plus__fixed-footer-wrapper{
  left:auto;
  right:0;
}
.bk-table-plus__fixed-header-wrapper{
  position:absolute;
  left:0;
  top:0;
  z-index:3;
}
.bk-table-plus__fixed-footer-wrapper{
  position:absolute;
  left:0;
  bottom:0;
  z-index:3;
}
.bk-table-plus__fixed-footer-wrapper tbody td.bk-table-plus__cell{
  border-top:1px solid #EBEEF5;
  background-color:#F5F7FA;
  color:#081E40;
}
.bk-table-plus__fixed-body-wrapper{
  position:absolute;
  left:0;
  top:37px;
  overflow:hidden;
  z-index:3;
}
.bk-table-plus__header-wrapper, .bk-table-plus__body-wrapper, .bk-table-plus__footer-wrapper{
  width:100%;
}
.bk-table-plus__footer-wrapper{
  margin-top:-1px;
}
.bk-table-plus__footer-wrapper td.bk-table-plus__cell{
  border-top:1px solid #EBEEF5;
}
.bk-table-plus__header, .bk-table-plus__body, .bk-table-plus__footer{
  table-layout:fixed;
  border-collapse:separate;
}
.bk-table-plus__header-wrapper, .bk-table-plus__footer-wrapper{
  overflow:hidden;
}
.bk-table-plus__header-wrapper tbody td.bk-table-plus__cell, .bk-table-plus__footer-wrapper tbody td.bk-table-plus__cell{
  background-color:#F5F7FA;
  color:#081E40;
}
.bk-table-plus__body-wrapper{
  overflow:hidden;
  position:relative;
}
.bk-table-plus__body-wrapper.is-scrolling-none ~ .bk-table-plus__fixed,
.bk-table-plus__body-wrapper.is-scrolling-none ~ .bk-table-plus__fixed-right{
  -webkit-box-shadow:none;
          box-shadow:none;
}
.bk-table-plus__body-wrapper.is-scrolling-left ~ .bk-table-plus__fixed{
  -webkit-box-shadow:none;
          box-shadow:none;
}
.bk-table-plus__body-wrapper.is-scrolling-right ~ .bk-table-plus__fixed-right{
  -webkit-box-shadow:none;
          box-shadow:none;
}
.bk-table-plus__body-wrapper .bk-table-plus--border.is-scrolling-right ~ .bk-table-plus__fixed-right{
  border-left:1px solid #EBEEF5;
}
.bk-table-plus__body-wrapper .bk-table-plus--border.is-scrolling-left ~ .bk-table-plus__fixed{
  border-right:1px solid #EBEEF5;
}
.bk-table-plus .caret-wrapper{
  display:-webkit-inline-box;
  display:-ms-inline-flexbox;
  display:inline-flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
      -ms-flex-direction:column;
          flex-direction:column;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  height:34px;
  width:24px;
  vertical-align:middle;
  cursor:pointer;
  overflow:visible;
  overflow:initial;
  position:relative;
}
.bk-table-plus .sort-caret{
  width:0;
  height:0;
  border:solid 5px transparent;
  position:absolute;
  left:7px;
}
.bk-table-plus .sort-caret.ascending{
  border-bottom-color:#C0C4CC;
  top:5px;
}
.bk-table-plus .sort-caret.descending{
  border-top-color:#C0C4CC;
  bottom:7px;
}
.bk-table-plus .ascending .sort-caret.ascending{
  border-bottom-color:#3a84ff;
}
.bk-table-plus .descending .sort-caret.descending{
  border-top-color:#3a84ff;
}
.bk-table-plus .hidden-columns{
  visibility:hidden;
  position:absolute;
  z-index:-1;
}
.bk-table-plus--striped .bk-table-plus__body tr.bk-table-plus__row--striped td.bk-table-plus__cell{
  background:#FAFAFA;
}
.bk-table-plus--striped .bk-table-plus__body tr.bk-table-plus__row--striped.current-row td.bk-table-plus__cell{
  background-color:#ecf5ff;
}
.bk-table-plus__body tr.hover-row > td.bk-table-plus__cell, .bk-table-plus__body tr.hover-row.current-row > td.bk-table-plus__cell, .bk-table-plus__body tr.hover-row.bk-table-plus__row--striped > td.bk-table-plus__cell, .bk-table-plus__body tr.hover-row.bk-table-plus__row--striped.current-row > td.bk-table-plus__cell{
  background-color:rgba(58, 132, 255, 0.05);
}
.bk-table-plus__body tr.current-row > td.bk-table-plus__cell{
  background-color:#ecf5ff;
}
.bk-table-plus__column-resize-proxy{
  position:absolute;
  left:200px;
  top:0;
  bottom:0;
  width:0;
  border-left:1px solid #EBEEF5;
  z-index:10;
}
.bk-table-plus--enable-row-transition .bk-table-plus__body td.bk-table-plus__cell{
  -webkit-transition:background-color 0.25s ease;
  transition:background-color 0.25s ease;
}
.bk-table-plus--enable-row-hover .bk-table-plus__body tr:hover > td.bk-table-plus__cell{
  background-color:rgba(58, 132, 255, 0.05)
}
.bk-table-plus--fluid-height .bk-table-plus__fixed,
.bk-table-plus--fluid-height .bk-table-plus__fixed-right{
  bottom:0;
  overflow:hidden;
}
@-webkit-keyframes rotating{
0%{
    -webkit-transform:rotate(0deg);
            transform:rotate(0deg);
}
100%{
    -webkit-transform:rotate(1turn);
            transform:rotate(1turn);
}
}
@keyframes rotating{
0%{
    -webkit-transform:rotate(0deg);
            transform:rotate(0deg);
}
100%{
    -webkit-transform:rotate(1turn);
            transform:rotate(1turn);
}
}
.bk-table-plus [class*=bk-table-plus__row--level] .bk-table-plus__expand-icon{
  display:inline-block;
  width:20px;
  line-height:20px;
  height:20px;
  text-align:center;
  margin-right:3px;
}
.bk-table-plus [class*=bk-table-plus__row--level] .bk-table-plus__expand-icon .table-plus-icon-loading{
  -webkit-animation:rotating 2s linear infinite;
          animation:rotating 2s linear infinite;
  display:inline-block;
  width:20px;
  height:20px;
  background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAAIVBMVEUAAACHmKuJmKuImKuJmKuImKuImKuImKqHl6yJmKuHl6r8hSSQAAAACnRSTlMAqmyJUZWQcnFqN6LklgAAAEtJREFUCNdjAAJmAwYIYBQAU0EghiqQodXAKMC+CMhgX8nioNUAklNjYMhkQAKGgg4MDCyCwggGFEAVJ4Fo9kUg7XAD4VYgLIU7AwDRYwoBRncPUQAAAABJRU5ErkJggg==) no-repeat center center;
  background-size:12px 12px;
}
.bk-checkbox-plus{
  color:#081E40;
  font-weight:500;
  font-size:12px;
  height:14px;
  width:14px;
  position:relative;
  cursor:pointer;
  display:inline-block;
  white-space:nowrap;
  -webkit-user-select:none;
     -moz-user-select:none;
      -ms-user-select:none;
          user-select:none;
  margin-right:30px;
}
.bk-checkbox-plus.is-bordered{
  padding:9px 20px 9px 10px;
  border-radius:4px;
  border:1px solid #DCDFE6;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  line-height:normal;
  height:40px;
}
.bk-checkbox-plus.is-bordered.is-checked{
  border-color:#3a84ff;
}
.bk-checkbox-plus.is-bordered.is-disabled{
  border-color:#cbd5e0;
  cursor:not-allowed;
  color:#8797aa;
}
.bk-checkbox-plus.is-bordered + .bk-checkbox-plus.is-bordered{
  margin-left:10px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--medium{
  padding:7px 20px 7px 10px;
  border-radius:4px;
  height:36px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--medium .bk-checkbox-plus__label{
  line-height:17px;
  font-size:12px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--medium .bk-checkbox-plus__inner{
  height:14px;
  width:14px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--small{
  padding:5px 15px 5px 10px;
  border-radius:3px;
  height:32px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--small .bk-checkbox-plus__label{
  line-height:15px;
  font-size:12px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--small .bk-checkbox-plus__inner{
  height:12px;
  width:12px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--small .bk-checkbox-plus__inner::after{
  height:6px;
  width:2px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--mini{
  padding:3px 15px 3px 10px;
  border-radius:3px;
  height:28px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--mini .bk-checkbox-plus__label{
  line-height:12px;
  font-size:12px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--mini .bk-checkbox-plus__inner{
  height:12px;
  width:12px;
}
.bk-checkbox-plus.is-bordered.bk-checkbox-plus--mini .bk-checkbox-plus__inner::after{
  height:6px;
  width:2px;
}
.bk-checkbox-plus__input{
  height:14px;
  white-space:nowrap;
  cursor:pointer;
  outline:none;
  display:inline-block;
  line-height:1;
  position:relative;
}
.bk-checkbox-plus__input.is-disabled .bk-checkbox-plus__inner{
  background-color:#edf2fc;
  border-color:#DCDFE6;
  cursor:not-allowed;
}
.bk-checkbox-plus__input.is-disabled .bk-checkbox-plus__inner::after{
  cursor:not-allowed;
  border-color:#C0C4CC;
}
.bk-checkbox-plus__input.is-disabled .bk-checkbox-plus__inner + .bk-checkbox-plus__label{
  cursor:not-allowed;
}
.bk-checkbox-plus__input.is-disabled.is-checked .bk-checkbox-plus__inner{
  background-color:#F2F6FC;
  border-color:#DCDFE6;
}
.bk-checkbox-plus__input.is-disabled.is-checked .bk-checkbox-plus__inner::after{
  border-color:#C0C4CC;
}
.bk-checkbox-plus__input.is-disabled.is-indeterminate .bk-checkbox-plus__inner{
  background-color:#3a84ff;
  border-color:#3a84ff
}
.bk-checkbox-plus__input.is-disabled.is-indeterminate .bk-checkbox-plus__inner::after{
    content:'';
    width:6px;
    height:6px;
    background:#fff;
    position:absolute;
    -webkit-transform:translate(-50%, -50%);
            transform:translate(-50%, -50%);
    top:50%;
    left:50%;
    margin-left:-4px;
    border-radius:2px;
    margin-top:-1px;
    display:inline-block;
}
.bk-checkbox-plus__input.is-disabled.is-indeterminate .bk-checkbox-plus__inner::before{
  background-color:#C0C4CC;
  border-color:#C0C4CC;
}
.bk-checkbox-plus__input.is-disabled + span.bk-checkbox-plus__label{
  color:#C0C4CC;
  cursor:not-allowed;
}
.bk-checkbox-plus__input.is-checked .bk-checkbox-plus__inner{
  background-color:#3a84ff;
  border-color:#3a84ff;
}
.bk-checkbox-plus__input.is-checked .bk-checkbox-plus__inner::after{
  -webkit-transform:rotate(45deg) scaleY(1);
          transform:rotate(45deg) scaleY(1);
}
.bk-checkbox-plus__input.is-checked + .bk-checkbox-plus__label{
  color:#3a84ff;
}
.bk-checkbox-plus__input.is-focus .bk-checkbox-plus__inner{
  border-color:#3a84ff;
}
.bk-checkbox-plus__input.is-indeterminate .bk-checkbox-plus__inner{
  background-color:#fff;
  border-color:#DCDFE6;
}
.bk-checkbox-plus__input.is-indeterminate .bk-checkbox-plus__inner::before{
  content:"";
  position:absolute;
  display:block;
  background-color:#3a84ff;
  width:6px;
  height:6px;
  top:3px;
  left:3px;
}
.bk-checkbox-plus__input.is-indeterminate .bk-checkbox-plus__inner::after{
  display:none;
}
.bk-checkbox-plus__inner{
  display:inline-block;
  position:relative;
  border:1px solid #DCDFE6;
  border-radius:2px;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  width:14px;
  height:14px;
  background-color:#FFFFFF;
  z-index:1;
  -webkit-transition:border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
  transition:border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
}
.bk-checkbox-plus__inner:hover{
  border-color:#3a84ff;
  background-color:rgba(58, 132, 255, 0.1);
}
.bk-checkbox-plus__inner::after{
  -webkit-box-sizing:content-box;
          box-sizing:content-box;
  content:"";
  border:2px solid #FFFFFF;
  border-left:0;
  border-top:0;
  height:7px;
  left:3px;
  position:absolute;
  top:1px;
  -webkit-transform:rotate(45deg) scaleY(0);
          transform:rotate(45deg) scaleY(0);
  width:3px;
  -webkit-transition:-webkit-transform 0.15s ease-in 0.05s;
  transition:-webkit-transform 0.15s ease-in 0.05s;
  transition:transform 0.15s ease-in 0.05s;
  transition:transform 0.15s ease-in 0.05s, -webkit-transform 0.15s ease-in 0.05s;
  -webkit-transform-origin:center;
          transform-origin:center;
}
.bk-checkbox-plus__original{
  opacity:0;
  outline:none;
  position:absolute;
  margin:0;
  width:0;
  height:0;
  z-index:-1;
}
.bk-checkbox-plus__label{
  display:inline-block;
  padding-left:10px;
  line-height:19px;
  font-size:12px;
}
.bk-checkbox-plus:last-of-type{
  margin-right:0;
}
.bk-checkbox-plus-button{
  position:relative;
  display:inline-block;
}
.bk-checkbox-plus-button__inner{
  display:inline-block;
  line-height:1;
  font-weight:500;
  white-space:nowrap;
  vertical-align:middle;
  cursor:pointer;
  background:#FFFFFF;
  border:1px solid #DCDFE6;
  border-left:0;
  color:#081E40;
  -webkit-appearance:none;
  text-align:center;
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  outline:none;
  margin:0;
  position:relative;
  -webkit-transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  padding:12px 20px;
  font-size:12px;
  border-radius:0;
}
.bk-checkbox-plus-button__inner.is-round{
  padding:12px 20px;
}
.bk-checkbox-plus-button__inner:hover{
  color:#3a84ff;
}
.bk-checkbox-plus-button__inner [class*=el-icon-]{
  line-height:0.9;
}
.bk-checkbox-plus-button__inner [class*=el-icon-] + span{
  margin-left:5px;
}
.bk-checkbox-plus-button__original{
  opacity:0;
  outline:none;
  position:absolute;
  margin:0;
  z-index:-1;
}
.bk-checkbox-plus-button.is-checked .bk-checkbox-plus-button__inner{
  color:#FFFFFF;
  background-color:#3a84ff;
  border-color:#3a84ff;
  -webkit-box-shadow:-1px 0 0 0 #8cc5ff;
          box-shadow:-1px 0 0 0 #8cc5ff;
}
.bk-checkbox-plus-button.is-checked:first-child .bk-checkbox-plus-button__inner{
  border-left-color:#3a84ff;
}
.bk-checkbox-plus-button.is-disabled .bk-checkbox-plus-button__inner{
  color:#C0C4CC;
  cursor:not-allowed;
  background-image:none;
  background-color:#FFFFFF;
  border-color:#EBEEF5;
  -webkit-box-shadow:none;
          box-shadow:none;
}
.bk-checkbox-plus-button.is-disabled:first-child .bk-checkbox-plus-button__inner{
  border-left-color:#EBEEF5;
}
.bk-checkbox-plus-button:first-child .bk-checkbox-plus-button__inner{
  border-left:1px solid #DCDFE6;
  border-radius:4px 0 0 4px;
  -webkit-box-shadow:none !important;
          box-shadow:none !important;
}
.bk-checkbox-plus-button.is-focus .bk-checkbox-plus-button__inner{
  border-color:#3a84ff;
}
.bk-checkbox-plus-button:last-child .bk-checkbox-plus-button__inner{
  border-radius:0 4px 4px 0;
}
.bk-checkbox-plus-button--medium .bk-checkbox-plus-button__inner{
  padding:10px 20px;
  font-size:12px;
  border-radius:0;
}
.bk-checkbox-plus-button--medium .bk-checkbox-plus-button__inner.is-round{
  padding:10px 20px;
}
.bk-checkbox-plus-button--small .bk-checkbox-plus-button__inner{
  padding:9px 15px;
  font-size:12px;
  border-radius:0;
}
.bk-checkbox-plus-button--small .bk-checkbox-plus-button__inner.is-round{
  padding:9px 15px;
}
.bk-checkbox-plus-button--mini .bk-checkbox-plus-button__inner{
  padding:7px 15px;
  font-size:12px;
  border-radius:0;
}
.bk-checkbox-plus-button--mini .bk-checkbox-plus-button__inner.is-round{
  padding:7px 15px;
}
.bk-checkbox-plus-group{
  font-size:0;
}
.bk-table-plus-column--selection .cell{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
      -ms-flex-align:center;
          align-items:center;
  padding-left:10px;
  padding-right:10px;
}
.bk-table-plus-filter{
  border:solid 1px #EBEEF5;
  border-radius:2px;
  background-color:#FFFFFF;
  -webkit-box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.1);
          box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-sizing:border-box;
          box-sizing:border-box;
  margin:2px 0;
}
.bk-table-plus-filter__list{
  padding:5px 0;
  margin:0;
  list-style:none;
  min-width:100px;
}
.bk-table-plus-filter__list-item{
  line-height:36px;
  padding:0 10px;
  cursor:pointer;
  font-size:12px;
}
.bk-table-plus-filter__list-item:hover{
  background-color:#ecf5ff;
  color:#66b1ff;
}
.bk-table-plus-filter__list-item.is-active{
  background-color:#3a84ff;
  color:#FFFFFF;
}
.bk-table-plus-filter__content{
  min-width:100px;
}
.bk-table-plus-filter__bottom{
  border-top:1px solid #EBEEF5;
  padding:8px;
}
.bk-table-plus-filter__bottom button{
  background:transparent;
  border:none;
  color:#081E40;
  cursor:pointer;
  font-size:13px;
  padding:0 3px;
}
.bk-table-plus-filter__bottom button:hover{
  color:#3a84ff;
}
.bk-table-plus-filter__bottom button:focus{
  outline:none;
}
.bk-table-plus-filter__bottom button.is-disabled{
  color:#C0C4CC;
  cursor:not-allowed;
}
.bk-table-plus-filter__wrap{
  max-height:280px;
}
.bk-table-plus-filter__checkbox-group{
  padding:10px;
}
.bk-table-plus-filter__checkbox-group label.bk-checkbox-plus{
  display:block;
  margin-right:5px;
  margin-bottom:8px;
  margin-left:5px;
}
.bk-table-plus-filter__checkbox-group .bk-checkbox-plus:last-child{
  margin-bottom:0;
}