Lungo.js/example/components/lungo.theme/theme.widget.button.styl

/**
 * Stylesheet
 *
 * @namespace Lungo.Theme
 * @class Layout
 *
 * @author Javier Jimenez Villar <javi@tapquo.com> || @soyjavi
 */

@import "__init.styl"

header
  & .button, button
    color: #fff
    background-color: THEME_dark
    box-shadow 0 1px 0 lighten(THEME, 15%), inset 0 1px 0 darken(THEME, 35%)
    border-radius (BORDER_radius * 2)
    &:active
      background-color: darken(THEME, 40%)

article
  & .button, button
    color: #fff !important
    border-radius (BORDER_radius * 2)
    box-shadow inset 0 1px 0 rgba(255,255,255,0.25), 0 1px 1px rgba(0,0,0,0.15)
    // border: solid 1px rgba(0,0,0,0.1)
    &:active
      box-shadow inset 0 0 128px rgba(0,0,0,0.25)
      border-color: none
    &, abbr
      font-weight: 400
    & .icon
      opacity: 0.65
      text-shadow: 0 -1px 0 rgba(0,0,0,0.25)

  & button, .button, .tag:not(.icon)
    &
      background-color: THEME_dark
    &.secondary
      background-color: COLOR_secondary
    &.accept
      background-color: COLOR_success
    &.cancel
      background-color: COLOR_cancel
    &[disabled], :disabled, &.disabled
      background: FORM_color
      color: #999 !important
      box-shadow: none !important