bmui/src/style/choice.styl

Bluemoon Moon Components

.{$PREFIX}-radio
  min-height: 50px
  display: flex
  justify-content: space-between
  align-items: center
  background-color: #fff
  border-bottom: 1px solid $color_b1
  padding: 12px
  &-title
    flex-shrink: 0
    color: $color_t2
    font-size: $size6
    margin-right: 12px
  &-isNeed
    color: $color_main2
  &-ctrls
    text-align: right
    margin: 0 -8px
  &-ctrl
    display: inline-block
    color: $color_t1
    font-size: $size4
    margin: 0 8px
  &-input
    $icon('radio_normal', '.svg')
    width: 30px
    height: 30px
    &:checked
      background-image: convert('url(' + $get_asset('radio_selected', '.svg') + ')')
    &:disabled
      background-image: convert('url(' + $get_asset('radio_disable@3x', '.png') + ')')
  &-disabled
    color: $color_t3

.{$PREFIX}-radio_list
  &-item
    display: flex
    align-items: center
    min-height: 50px
    border-bottom: 1px solid $color_b1
    background-color: #fff
    padding: 12px
    font-size: $size4
    color: $color_t1
  &-disabled
    color: $color_t3
  &-input
    flex-shrink: 0
    $icon('radio_normal', '.svg')
    width: 30px
    height: 30px
    margin: 0 8px 0 -4px
    &:checked
      background-image: convert('url(' + $get_asset('radio_selected', '.svg') + ')')
    &:disabled
      // background-image: convert('url(' + $get_asset('radio_disable', '.svg') + ')')
      background-image: convert('url(' + $get_asset('radio_disable@3x', '.png') + ')')

.{$PREFIX}-check_list
  &-item
    display: flex
    align-items: center
    min-height: 50px
    border-bottom: 1px solid $color_b1
    background-color: #fff
    padding: 12px
    font-size: $size4
    color: $color_t1
  &-disabled
    color: $color_t3
  &-text
    flex-grow: 1
  &-input
    flex-shrink: 0
    $icon('checkbox_normal', '.svg')
    width: 30px
    height: 30px
    margin: 0 8px 0 -4px
    &:checked
      background-image: convert('url(' + $get_asset('checkbox_selected', '.svg') + ')')
    &:disabled
      background-image: convert('url(' + $get_asset('checkbox_disable@3x', '.png') + ')')

.{$PREFIX}-selector
  &[class|=bmui]
    display: inline-block
    border: 1px solid $color_sub2
    background-color: #fff
    font-size: 12px
    color: $color_t2
    min-height: 30px
    padding: 4px 8px
    border-radius: 2px
  &-checked[class|=bmui]
    color: #fff
    border-color: $color_main2
    background-color: $color_main2
  &-disabled[class|=bmui]
    color: $color_t3
    border-color: $color_b2
    background-color: $color_bg2