//
// Patternfly Mixins
// --------------------------------------------------
// PatternFly-specific mixins

// Patternfly button variants.
@mixin button-variant($color, $background, $background-image-start, $background-image-stop, $border){
  background-color: $background;
  @include gradient-vertical($background-image-start, $background-image-stop);
  border-color: $border;
  color: $color;

  &:hover,
  &:focus,
  &:active,
  &.active,
  .open .dropdown-toggle#{&} {
    background-color: $background;
    background-image: none;
    border-color: $border;
    color: $color;
  }
  &:active,
  &.active,
  .open .dropdown-toggle#{&} {
    background-image: none;
    &:hover,
    &:focus,
    &.focus {
      background-color: darken($background, 5%);
          border-color: darken($border, 7%);
    }
  }
  &.disabled,
  &[disabled],
  fieldset[disabled] & {
    &,
    &:hover,
    &:focus,
    &:active,
    &.active {
      background-color: $background;
      border-color: $border;
    }
  }
}

// SASS CONVERSION FIX.
// Allows inclusion of sr-only rules in nested media queries where @extends .sr-only
// will not work.
@mixin sr-only-pf(){
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

@mixin tab-indicator($background: $gray-light-pf, $left: 15px, $right: 15px){
  &:before {
    background: $background;
    bottom: -1px;
    content: "";
    display: block;
    height: 2px;
    left: $left;
    position: absolute;
    right: $right;
  }
}

// Ellipse overflow text
.text-overflow-pf {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}
