.uif-switch
  display inline-block
  width 38px
  height 20px
  border-radius 10px
  background-color #BAC1C7
  transition background-color 0.2s ease
  cursor pointer
  &-point
    transition transform 0.2s ease
    transform translate(2px, 2px)
    width 16px
    height @width
    border-radius 50%
    background-color #FFF
  &.active
    background-color #006CE1
    .uif-switch-point
      transform translate(20px, 2px)
  &.disabled
    background-color #C8D0D6
    cursor default
    .uif-switch-point
      background-color #D9DFE5
  &.active&.disabled
    background-color #BFCFE1
  &-text
    font-size 12px
    width 36px
    text-align center
    position absolute
    top 0
    right 4px
    color #FFF
    line-height 20px
    white-space nowrap
  &.has-text
    position relative
    width 56px
    &.active
      .uif-switch-point
        transform translate(38px, 2px)
      .uif-switch-text
        right unset
        left 4px
