Contents

//
// Buttons
// ----------------------------------------
.dark {

  .btn {

    &.hover,
    &:hover {
      text-decoration: none;
    }

    &.disabled,
    &[disabled],
    &.disabled:hover,
      &[disabled]:hover, {
      cursor: not-allowed;
      background: hsv-darken($color-element-background, 5%, true);
      border-color: hsv-darken($color-element-border, 14%, true);
      color: hsv-darken($font-color-regular, 50%, true);
    }
  }

  %btn-default,
  .btn-default {
    @include button-variant($font-color-regular, $color-element-background, $color-element-border);
  }

  .btn-brand {
    @include button-variant($color-bright, $color-brand, $button-border-color-brand, #f4067d, #f4c8df, #ff0683, #ffd0e8);

    &.disabled,
    &[disabled] {
      &,
      &.focus,
      &:focus,
        &.hover,
        &:hover {
        color: $color-bright;
        background: $color-brand;
        border-color: $button-border-color-brand;
        opacity: .3;
      }
    }
  }

  .btn-positive {
    @include button-variant($color-bright, $color-positive, $button-border-color-positive);
  }

  .btn-negative {
    @include button-variant($color-bright, $color-negative, $button-border-color-negative);
  }

  .btn-clean {
    @extend %btn-default;
    color: $color-bright;
    background-color: transparent;

    &,
    &.focus,
    &:focus,
      &.hover,
      &:hover,
      &.active,
      &:active {
      border-color: transparent;
    }

    &.hover,
    &:hover {
      background: hsv-lighten($color-element-background, 0%, true);
    }

    &.active,
    &:active {
      background: hsv-lighten($color-element-background, 15%, true);
    }

    &.focus,
    &:focus {
      background: hsv-lighten($color-element-background, 21%, true);
    }

  }
}

Version data entries

1 entries across 1 versions & 1 rubygems

Version	Path
doc-msp-theme-0.1.0	_sass/themes/dark-theme/_button.scss