theme.widget.notification.styl

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

/* -------------------------- NOTIFICATION -------------------------- */

.notification
  color: #fff
  &:not(.push)
    background-color: rgba(0,0,0,0.5)
  & .window
    box-shadow 0 0 0 3px rgba(0,0,0,0.1)
    &.growl
      background-color: rgba(0,0,0,0.8)
      & strong
        color: darken(#fff, 25%)
        font-weight: 700

    &.confirm, &.html
      & button
        background-color: #fff
        color: darken(COLOR, 75%)
        font-weight: 400
        &[data-callback=cancel], &[data-action=close]
          color: DANGER

    &.html, &.confirm
      background-color: COLOR
      color: TEXT

    &.confirm
      & > small, > .icon
        color: lighten(TEXT, 50%)

      & > button
        &:nth-child(1)
          color: DANGER !important

    &.error, &.success
      background-color: rgba(0,0,0,0.8)
      border-bottom: solid 0.4em
      color: #fff
      & small
        color: darken(#fff, 25%)

    &.error
      border-bottom-color: DANGER
      & > .icon
        color: DANGER
    &.success
      border-bottom-color: SUCCESS
      & > .icon
        color: SUCCESS

    &.html
      & .title
        background-color: THEME
        color: #fff

    &.push
      background-color: COLOR
      box-shadow: inset 0 -0.1em #000

    & small
      font-weight: 300