mixins.scss

@import "variables";

@mixin box-shadow($shadows...) {
  -webkit-box-shadow: $shadows;
  box-shadow: $shadows;
}

@function inverse-side($side) {
  @if      $side == top    { @return bottom; }
  @else if $side == bottom { @return top; }
  @else if $side == left   { @return right; }
  @else if $side == right  { @return left; }
}

@mixin linear-gradient($gradientLine, $colorStops...) {
  background-image: -webkit-linear-gradient($gradientLine, $colorStops);
  background-image:    -moz-linear-gradient($gradientLine, $colorStops);
  background-image:      -o-linear-gradient($gradientLine, $colorStops);
  @if length($gradientLine) == 2 {
    background-image:         linear-gradient(to #{inverse-side(nth($gradientLine, 1))} #{inverse-side(nth($gradientLine, 2))}, $colorStops);
  } @else {
    background-image:         linear-gradient(to #{inverse-side($gradientLine)}, $colorStops);
  }
}

@mixin logo {
  max-width: 50px;
  height: auto;

  @media (min-width: $screen-xs) {
    max-width: 75px;
  }

  @media (min-width: $screen-md) {
    max-width: 100px;
  }
}