_mixins.scss

@mixin linear-gradient($args...){
  background-image:-o-linear-gradient($args);
  background-image:linear-gradient($args);
}

@mixin linear-gradient-with-background($gradient,$color){
  background: $color;
  @include linear-gradient($gradient);
}

@mixin linear-gradient-with-image($gradient,$image){
  background: $image, -o-linear-gradient($gradient);
  background: $image, linear-gradient($gradient);
}

@mixin horizontal-linear-gradient($args...){
  background-image: linear-gradient(to right, $args);
}

@mixin horizontal-linear-gradient-with-background($gradient,$background){
  background: $background;
  @include horizontal-linear-gradient($gradient);
}

@mixin user-select-none(){
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@mixin box-sizing($model){
  -webkit-box-sizing: $model;
  -moz-box-sizing: $model;
  box-sizing: $model;
}

@mixin border-radius($radius){
  border-radius: $radius;
  -moz-border-radius: $radius;
}

@mixin border($border,$radius){
  border: $border;
  @include border-radius($radius)
}

@mixin arrow($width, $height, $color, $direction) {
  width: 0;
  height: 0;

  @if ($direction == 'up') {
    border-left: $width * 0.5 solid transparent;
    border-right: $width * 0.5 solid transparent;
    border-bottom: $height solid $color;
  }

  @if ($direction == 'down') {
    border-left: $width * 0.5 solid transparent;
    border-right: $width * 0.5 solid transparent;
    border-top: $height solid $color;
  }

  @if ($direction == 'left') {
    border-top: $height * 0.5 solid transparent;
    border-bottom: $height * 0.5 solid transparent;
    border-right: $width solid $color;
  }

  @if ($direction == 'right') {
    border-top: $height * 0.5 solid transparent;
    border-bottom: $height * 0.5 solid transparent;
    border-left: $width solid $color;
  }
}