@import 'inc';
@import '_config.scss';
@import '_lz.scss';

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

body * {
  box-sizing: border-box;
}

:global .site-container {
  height: 100%;
  display: flex;
  flex-direction: column;
}

// 辅助类
:global {
  // React报错层
  .react-hot-loader-error-overlay {
    position: relative;
    z-index: 99999;
  }

  // 按钮导航
  .btn-link {
    background-color: $COLOR_PRIMARY;
    color: white;
    display: inline-block;
    text-align: center;
    border-radius: 5px;
    line-height: 30px;
    padding: 0 15px;
    &:hover {
      color: white;
    }
  }
  .custom-divide {
    height: 14px;
    width: 2px;
    background: $COLOR_PRIMARY;
  }

  .btn-default-link {
    background-color: #fff;
    color: $COLOR_PRIMARY;
    display: inline-block;
    text-align: center;
    border-radius: 5px;
    line-height: 30px;
    padding: 0 15px;
    border: 1px solid $COLOR_PRIMARY;
  }

  .none {
    display: none !important;
  }
  // 表格搜索的“共搜索到xx条数据”样式
  .th-table-count {
    span {
      span {
        color: $COLOR_PRIMARY;
      }
    }
  }

  .text-left {
    text-align: left;
  }
  .text-center {
    text-align: center;
  }
  .text-right {
    text-align: right;
  }

  .text-link {
    cursor: pointer;
  }

  .text-primary {
    color: $COLOR_PRIMARY;
  }
  .text-warning {
    color: $COLOR_WARNING;
  }
  .text-danger {
    color: $COLOR_DANGER;
  }
  .text-success {
    color: $COLOR_SUCCESS;
  }
  .text-gray {
    color: $COLOR_TEXT_INFO;
  }

  .ant-input {
    &[data-error='true'] {
      border-color: $COLOR_DANGER;
      box-shadow: 0 0 0 2px rgba($COLOR_DANGER, 0.2);
    }
  }

  // 输入框基本样式
  body {
    .input-short {
      width: 80px;
    }
    .input-medium {
      width: 200px;
    }
    .input-long {
      width: 400px;
    }
  }

  .page-loading {
    padding-top: 150px;
  }

  @for $i from 1 to 50 {
    .w#{$i*5} {
      width: #{$i * 5}px !important;
    }
  }

  @for $i from 1 to 20 {
    .m#{$i*5} {
      margin: #{$i * 5}px !important;
    }
    .mr#{$i*5} {
      margin-right: #{$i * 5}px !important;
    }
    .ml#{$i*5} {
      margin-left: #{$i * 5}px !important;
    }
    .mt#{$i*5} {
      margin-top: #{$i * 5}px !important;
    }
    .mb#{$i*5} {
      margin-bottom: #{$i * 5}px !important;
    }
    .p#{$i*5} {
      padding: #{$i * 5}px !important;
    }
    .pr#{$i*5} {
      padding-right: #{$i * 5}px !important;
    }
    .pl#{$i*5} {
      padding-left: #{$i * 5}px !important;
    }
    .pt#{$i*5} {
      padding-top: #{$i * 5}px !important;
    }
    .pb#{$i*5} {
      padding-bottom: #{$i * 5}px !important;
    }

    .w#{$i*5} {
      width: #{$i * 5}px !important;
    }
  }
}