.unf-btn
  s-ellipsis()
  outline 0
  user-select none
  background-image none
  touch-action manipulation
  display inline-block
  text-align center
  cursor pointer
  border 1px solid transparent
  transition color .2s linear,background-color .2s linear,border .2s linear,box-shadow .2s linear
  font-weight $btn-font-weight
  &-small
    s-set-font($btn-font-size, $btn-line-height)
    padding $btn-padding-small
    &^[0]-circle
      border-radius $btn-circle-small
  &-middle
    s-set-font($btn-font-size, $btn-line-height)
    padding $btn-padding-middle
    &^[0]-circle
      border-radius $btn-circle-middle
  &-large
    s-set-font($btn-font-size-large, $btn-line-height-large)
    padding $btn-padding-large
    &^[0]-circle
      border-radius $btn-circle-large
  &-default
    s-set-normal-btn-color($btn-default-color)
  &-normal
    s-set-normal-btn-color($primary-color)
  &-primary
    s-set-btn-color($primary-color)
  &-secondary
    s-set-btn-color($secondary-color)
  &-tertiary
    s-set-btn-color($tertiary-color)
  &-success
    s-set-btn-color($success-color)
  &-warning
    s-set-btn-color($warning-color)
  &-error
    s-set-btn-color($error-color)
  &-text
    s-set-color($icon-action-color, transparent, transparent)
    &:hover
    &:active
    &.active
      s-set-color($icon-action-hover-color, transparent, transparent)
  &-radius
    border-radius $btn-border-radius
  &[disabled]
    cursor $cursor-disabled
    s-set-color($btn-disable-color, $btn-disable-bg, $btn-disable-border)
  &-long
    width 100%
  & > .unf-btn-icon
    position relative
    top 2px
  & > .unf-btn-icon + span
  & > span + .unf-btn-icon
    margin-left 8px
  &-loading
    pointer-events none
    position relative
    & > :not(.unf-loading)
      visibility hidden
  & > .unf-loading
    position absolute
    top 50%
    left 50%
    margin-left -8px
    margin-top @margin-left
    text-indent 0
    transform-origin center center
    animation s-rotate 0.6s linear infinite
    text-align center
  &-rect
    s-set-color($rect-color, $rect-bg, $rect-bg)
    &:hover
      s-set-color($rect-hover-color, $rect-hover-bg, $rect-hover-bg)
    &:active,
    &.active
      s-set-color($rect-hover-color, $rect-hover-bg, $rect-hover-color)