// General Clearfix
@mixin clear() {
  &:before,
  &:after {
    content: " "; /* 1 */
    display: table; /* 2 */
  }
  &:after {
    clear: both;
  }
}

// Retina
@mixin image-2x($image, $width, $height) {
  @media (min--moz-device-pixel-ratio: 1.3),
         (-o-min-device-pixel-ratio: 2.6/2),
         (-webkit-min-device-pixel-ratio: 1.3),
         (min-device-pixel-ratio: 1.3),
         (min-resolution: 1.3dppx) {
    /* on retina, use image that's scaled by 2 */
    background-image: url($image);
    background-size: $width $height;
  }
}

// Placeholder text
@mixin placeholder($color: $input-color-placeholder) {
  &:-moz-placeholder            { color: $color; } // Firefox 4-18
  &::-moz-placeholder           { color: $color; } // Firefox 19+
  &:-ms-input-placeholder       { color: $color; } // Internet Explorer 10+
  &::-webkit-input-placeholder  { color: $color; } // Safari and Chrome
}

// Box Shaddow
@mixin box-shadow($left, $top, $blur, $color, $inset: false) {
  @if $inset {
    -webkit-box-shadow:inset $top $left $blur $color;
    -moz-box-shadow:inset $top $left $blur $color;
    box-shadow:inset $top $left $blur $color;
  } @else {
    -webkit-box-shadow: $top $left $blur $color;
    -moz-box-shadow: $top $left $blur $color;
    box-shadow: $top $left $blur $color;
  }
}

// Border Radius
@mixin border-radius($radius) {
  border-radius: $radius;
  -webkit-border-radius: $radius;
  -moz-border-radius: $radius;
}

// Filter: blur
@mixin blur($size) {
  -webkit-filter: blur($size);
  -moz-filter: blur($size);
  filter: blur($size);
}

// Transitions
@mixin transition($transition-property, $transition-time, $method) {
  -webkit-transition: $transition-property $transition-time $method;
  -moz-transition: $transition-property $transition-time $method;
  -ms-transition: $transition-property $transition-time $method;
  -o-transition: $transition-property $transition-time $method;
  transition: $transition-property $transition-time $method;
}

// TranslateZ
@mixin translateZ($amount) {
  -webkit-transform: translateZ($amount);
  -moz-transform: translateZ($amount);
  -ms-transform: translateZ($amount);
  -o-transform: translateZ($amount);
  transform: translateZ($amount);
}

// TranslateZ
@mixin translateY($amount) {
  -webkit-transform: translateY($amount);
  -moz-transform: translateY($amount);
  -ms-transform: translateY($amount);
  -o-transform: translateY($amount);
  transform: translateY($amount);
}

// Keyfram
@mixin keyframes( $animationName )
{
  @-webkit-keyframes $animationName {
      @content;
  }
  @-moz-keyframes $animationName {
      @content;
  }
  @-o-keyframes $animationName {
      @content;
  }
  @keyframes $animationName {
      @content;
  }
}

@mixin noselect() {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
}

@mixin loadingColor($color) {
  #nprogress .bar {
      background: $color;
  }

  #nprogress .peg {
    box-shadow: 0 0 10px $color, 0 0 5px $color;
  }

  #nprogress .spinner-icon {
    border-top-color:  $color;
    border-left-color: $color;
  }
}
