%boxSizing {
  box-sizing: border-box;
}

%TextEllipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[class*="table-plus-"] {
  font-variant: tabular-nums;
  font-feature-settings: 'tnum';
  @extend %boxSizing;
  // &:after, &:before,
  // *:after, *:before {
  //   @extend %boxSizing;
  // }
}

.table-plus-primary-color {
  color: $table-plus-primary-color;
}
.table-plus-success-color {
  color: $table-plus-success-color;
}
.table-plus-info-color {
  color: $table-plus-info-color;
}
.table-plus-warning-color {
  color: $table-plus-warning-color;
}
.table-plus-danger-color {
  color: $table-plus-danger-color;
}
.table-plus-perfect-color {
  color: $el-table-plus-header-background-color;
}

// 24 栅格布局
.table-plus-row {
  $spans: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%,
          37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%,
          70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%;
  &:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
    overflow: hidden;
    visibility: hidden;
  }
  @for $index from 0 to length($spans) {
    & > .table-plus-col--#{$index + 1} {
      float: left;
      width: nth($spans, $index + 1);
    }
  }
}

/*animat*/
.is--animat {
  .table-plus-sort--asc-btn,
  .table-plus-sort--desc-btn,
  .table-plus-filter--btn {
    &:before,
    &:after {
      @include animatTransition(border);
    }
  }
  .table-plus-input--wrapper {
    .table-plus-input {
      @include animatTransition(border);
    }
  }
  .el-table-plus--expand-btn,
  .table-plus-tree--node-btn {
    @include animatTransition(transform);
  }
  .table-plus-checkbox,
  .table-plus-radio {
    > input {
      &:checked+span {
        @include animatTransition(background-color);
      }
    }
  }
}