Katochimoto/xblocks

@require "../../../styl/init"

stylobate_defaults('skin-islands-v3-button',
  '_reset',
  '_shape' normal,
  '_type' normal,
  '_size' medium,
  '_align' center,
  '_hover' '&:hover',
  '_focus' '&:focus',
  '_active' '&:active',
  '__content' '& > ._content',
  '__text' '& > ._content > ._text',
  '__before' '& > ._content > ._before',
  '__after' '& > ._content > ._after'
  )

a.xb-button
  text-decoration: none

.xb-button
  font-weight: inherit
  width: 100%

  & > ._content
    width: 100%

    & > ._ico
      line-height: inherit

  & > ._content._empty
    & > ._ico
      margin-right: -0.5 * $islands_s !important
      margin-left: -0.5 * $islands_s !important

  & > ._controller
    skin: v3-checkbox__controller

    &:checked + ._content
      skin: v3-button_checked

  &._theme-normal
    &_size-s
      skin: v3-button (_size small)

    &_size-m
      skin: v3-button (_size medium)

    &_size-l
      skin: v3-button (_size large)

    &_size-xl
      skin: v3-button (_size extra-large)

  &._theme-action
    &_size-s
      skin: v3-button (_type action) (_size small)

    &_size-m
      skin: v3-button (_type action) (_size medium)

    &_size-l
      skin: v3-button (_type action) (_size large)

    &_size-xl
      skin: v3-button (_type action) (_size extra-large)

  &._theme-pseudo
    &_size-s
      skin: v3-button (_type pseudo) (_size small)

    &_size-m
      skin: v3-button (_type pseudo) (_size medium)

    &_size-l
      skin: v3-button (_type pseudo) (_size large)

    &_size-xl
      skin: v3-button (_type pseudo) (_size extra-large)

  &._theme-dark
    &_size-s
      skin: v3-button (_type dark) (_size small)

    &_size-m
      skin: v3-button (_type dark) (_size medium)

    &_size-l
      skin: v3-button (_type dark) (_size large)

    &_size-xl
      skin: v3-button (_type dark) (_size extra-large)

  &._theme-dark-pseudo
    &_size-s
      skin: v3-button (_type dark-pseudo) (_size small)

    &_size-m
      skin: v3-button (_type dark-pseudo) (_size medium)

    &_size-l
      skin: v3-button (_type dark-pseudo) (_size large)

    &_size-xl
      skin: v3-button (_type dark-pseudo) (_size extra-large)

  &._theme-clear
    &_size-s
      skin: v3-button (_type clear) (_size small)

    &_size-m
      skin: v3-button (_type clear) (_size medium)

    &_size-l
      skin: v3-button (_type clear) (_size large)

    &_size-xl
      skin: v3-button (_type clear) (_size extra-large)

  &._focused
    skin: v3-button_focus

  &._disabled
    kind: disabled 0.6