/*
 * @Description: 分割线样式
 * @Author: smileswlin
 * @LastEditor: smileswlin
 * @Date: 2020-12-16 15:44:44
 * @LastEditTime: 2020-12-17 15:42:47
 */
@import '../../var.less';

.divider {
  position: relative;
  padding: 0;
  margin: 0;
  font-size: 14px;
  line-height: 1.5715;
  vertical-align: middle;
  list-style: none;
  background: @gray-light-color;
  box-sizing: border-box;
  font-variant: tabular-nums;
  font-feature-settings: 'tnum';
}

.divider-inner-text {
  display: inline-block;
  padding: 0 10px;
}

.divider-horizontal {
  display: block;
  width: 100%;
  height: 1px;
  min-width: 100%;
  margin: 20px 0;
  clear: both;

  &.divider-with-text {
    display: table;
    margin: 16px 0;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
    background: transparent;
  }

  &.divider-with-text-center,
  &.divider-with-text-left,
  &.divider-with-text-right {
    display: table;
    margin: 16px 0;
    font-size: 16px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.85);
    text-align: center;
    white-space: nowrap;
    background: transparent;
  }

  &.divider-with-text-center::after,
  &.divider-with-text-center::before,
  &.divider-with-text-left::after,
  &.divider-with-text-left::before,
  &.divider-with-text-right::after,
  &.divider-with-text-right::before {
    position: relative;
    top: 50%;
    display: table-cell;
    width: 50%;
    border-top: 1px solid @gray-light-color;
    content: '';
    transform: translateY(50%);
    box-sizing: border-box;
  }

  &.divider-with-text-left::before {
    top: 50%;
    width: 5%;
  }

  &.divider-with-text-left::after,
  &.divider-with-text-right::before {
    top: 50%;
    width: 95%;
  }
}

.divider-dashed {
  background: none;
  border: dashed @gray-light-color;
  border-width: 1px 0 0;
}