@import '../../styles/default.scss';

.#{$pkg-prefix}-button-cover-spin {
    display: inline-block;

  .ant-spin-nested-loading {
    display: inline-block;
  }

  .ant-spin-blur {
    overflow: unset;
  }
}

// 去除点击wave动画
button.#{$pkg-prefix}-button[ant-click-animating-without-extra-node]:after {
  border: 0 none;
  opacity: 0;
  animation: none 0 ease 0 1 normal;
}

button.#{$pkg-prefix}-button {

  // 增加优先级
  &.ant-btn {
    text-shadow: none;
    box-shadow: none !important;
  }

  // hovergreybg
  // &.#{$pkg-prefix}-button-grey.button-hovergreybg.ant-btn {
  //   &:hover {
  //     background-color: #f7f7f7;

  //     &[disabled] {
  //       background-color: transparent;
  //     }
  //   }
  // }

  @mixin btn-styles(
    $border-color,
    $bg-color, 
    $color, 
    $hover-border-color,
    $hover-bg-color, 
    $hover-color
  ) {
    &:not(.ant-btn-dangerous) {
      &,
      &[disabled] {
        border-color: $border-color;
        background-color: $bg-color;
        background: $bg-color;
        color: $color;
      }
  
      &:focus,
      &:active,
      &:hover {
        &:not([disabled]) {
          border-color: $hover-border-color;
          background-color: $hover-bg-color;
          background: $hover-bg-color;
          color: $hover-color;
        }
      }
  
      &[disabled] {
        opacity: $disabled-opacity;
      }
    }
  }

  // primary
  &.#{$pkg-prefix}-button-primary.ant-btn-primary {
    @include btn-styles(
      $border-color: $active-color,
      $bg-color: $active-color, 
      $color: #fff, 
      $hover-border-color: #006dff,
      $hover-bg-color: #006dff, 
      $hover-color: #fff
    );

    // &.#{$pkg-prefix}-button-variant-basic {

    // }
  }

  // secondary
  &.#{$pkg-prefix}-button-secondary.ant-btn-primary {

    @include btn-styles(
      $border-color: #f7f7f7,
      $bg-color: #f7f7f7, 
      $color: $active-color, 
      $hover-border-color: #eee,
      $hover-bg-color: #eee, 
      $hover-color: $active-color
    );

    &.#{$pkg-prefix}-button-variant-grey {

      @include btn-styles(
        $border-color: #f7f7f7,
        $bg-color: #f7f7f7, 
        $color: #bcbcbc, 
        $hover-border-color: #eee,
        $hover-bg-color: #eee, 
        $hover-color: #bcbcbc
      );
    }
  }

  // dashed
  &.#{$pkg-prefix}-button-dashed {
    @include btn-styles(
      $border-color: $active-color,
      $bg-color: #fff, 
      $color: $active-color, 
      $hover-border-color: #006dff,
      $hover-bg-color: #fff, 
      $hover-color: #006dff
    );

    &.#{$pkg-prefix}-button-variant-grey {
      @include btn-styles(
        $border-color: #ddd,
        $bg-color: #fff, 
        $color: $active-color, 
        $hover-border-color: $active-color,
        $hover-bg-color: #fff, 
        $hover-color: $active-color
      );
    }
  }

  // default 
  &.#{$pkg-prefix}-button-default {
    @include btn-styles(
      $border-color: $active-color,
      $bg-color: #fff, 
      $color: $active-color, 
      $hover-border-color: #006dff,
      $hover-bg-color: #fff, 
      $hover-color: #006dff
    );

    &.#{$pkg-prefix}-button-variant-grey {
      @include btn-styles(
        $border-color: #ddd,
        $bg-color: #fff, 
        $color: $active-color, 
        $hover-border-color: $active-color,
        $hover-bg-color: #fff, 
        $hover-color: $active-color
      );
    }
  }
}