@perfma/heaven/es/pagination/index.less

An UI Framework base [Ant Design V4](https://ant.design/components/overview-cn/) for React.

@import '~antd/es/pagination/style/index.less';
@import '../style/vars.less';

.@{ant-prefix}-pagination-disabled,
.@{ant-prefix}-pagination-disabled:hover,
.@{ant-prefix}-pagination-disabled:focus-visible {
  .@{ant-prefix}-pagination-prev .@{ant-prefix}-pagination-item-link,
  .@{ant-prefix}-pagination-next .@{ant-prefix}-pagination-item-link,
  .@{ant-prefix}-pagination-item,
  .@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input)
    .@{ant-prefix}-select-selector,
  .@{ant-prefix}-pagination-options-quick-jumper input {
    background: #f4f4f4 !important;
    border: none;
  }

  .@{ant-prefix}-pagination-item {
    a{
      line-height: 32px!important;
    }
  }

  .@{ant-prefix}-pagination-item-active {
    background: #bbc7d4!important;
  }
}

.@{ant-prefix}-pagination-disabled {
  .@{ant-prefix}-pagination-item-active {
    background: #bbc7d4!important;
  }
}


.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple)
  .@{ant-prefix}-pagination-item-link,
.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple):hover
  .@{ant-prefix}-pagination-item-link,
.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple):focus-visible
  .@{ant-prefix}-pagination-item-link {
  background: #f4f4f4 !important;
  border: none !important;
}

.@{ant-prefix}-pagination-item-active {
  background: #3271fe;
  a {
    color: #fff !important;
  }
  &:hover {
    background: #29a2ff;
    a {
      color: #fff !important;
    }
  }
}

.@{ant-prefix}-pagination-simple
  .@{ant-prefix}-pagination-simple-pager
  input[disabled] {
  border: none;
}

.mini .@{ant-prefix}-pagination-disabled .@{ant-prefix}-pagination-item-link,
.mini
  .@{ant-prefix}-pagination-disabled:hover
  .@{ant-prefix}-pagination-item-link,
.mini
  .@{ant-prefix}-pagination-disabled:focus-visible
  .@{ant-prefix}-pagination-item-link {
  background: transparent !important;
}

.mini .@{ant-prefix}-pagination-item-active {
  background: #fff;
  border-color: transparent;
}
.mini .@{ant-prefix}-pagination-item-active a,
.mini .@{ant-prefix}-pagination-item-active:hover a {
  color: #3271fe!important;
}

.mini.@{ant-prefix}-pagination-disabled,
.mini.@{ant-prefix}-pagination-disabled:hover,
.mini.@{ant-prefix}-pagination-disabled:focus-visible {

  .@{ant-prefix}-pagination-item {
    // background-color: #f4f4f4!important;
    background-color: transparent!important;
  }
  .@{ant-prefix}-pagination-item {
    a,a:hover{
      line-height: 24px!important;
    }
  }
  .@{ant-prefix}-pagination-item-active>a{
    // color: #fff!important; 
    color: #686868!important;
  }
}

.mini.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple)
  .@{ant-prefix}-pagination-item-link,
.mini.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple):hover
  .@{ant-prefix}-pagination-item-link,
.mini.@{ant-prefix}-pagination-disabled:not(.@{ant-prefix}-pagination-simple):focus-visible
  .@{ant-prefix}-pagination-item-link {
  background: transparent !important;
  border: none !important;
}