// 
// @description : 
// @author      : Adarsh Pastakia
// @copyright   : 2016
// @license     : MIT
@mixin sticky() {
  position: -webkit-sticky;
  position: -moz-sticky;
  position: sticky;
}
@mixin scroll() {
  overflow                  : auto;
  -webkit-overflow-scrolling: touch;
}
@mixin blur($value: 5px) {
  -webkit-filter : blur($value);
  -moz-filter : blur($value);
  -ms-filter : blur($value);
  -o-filter : blur($value);
  filter : blur($value);
}
@mixin backdrop-blur($value: 5px) {
  -webkit-backdrop-filter : blur($value);
  -moz-backdrop-filter : blur($value);
  -ms-backdrop-filter : blur($value);
  -o-backdrop-filter : blur($value);
  backdrop-filter : blur($value);
}

// Styling
@mixin padding($dir, $size) {
   @if($dir=='start'){
    padding-left: $size;
  }
  @if($dir=='end') {
    padding-right: $size;
  }

  -webkit-padding-#{$dir}: $size;
  -moz-padding-#{$dir}   : $size;
  -ms-padding-#{$dir}    : $size;
  padding-#{$dir}        : $size;
}
@mixin margin($dir, $size) {
   @if($dir=='start'){
    margin-left: $size;
  }
  @if($dir=='end') {
    margin-right: $size;
  }

  -webkit-margin-#{$dir}: $size;
  -moz-margin-#{$dir}   : $size;
  -ms-margin-#{$dir}    : $size;
  margin-#{$dir}        : $size;
}
@mixin border($dir, $val...) {
   @if($dir=='start'){
    border-left: $val;
  }
  @if($dir=='end') {
    border-right: $val;
  }

  -webkit-border-#{$dir}: $val;
  -moz-border-#{$dir}   : $val;
  -ms-border-#{$dir}    : $val;
  border-#{$dir}        : $val;
}
@mixin borderEx($dir, $prop, $val) {
   @if($dir=='start'){
    border-left-#{$prop}: $val;
  }
  @if($dir=='end') {
    border-right-#{$prop}: $val;
  }

  -webkit-border-#{$dir}-#{$prop}: $val;
  -moz-border-#{$dir}-#{$prop}   : $val;
  -ms-border-#{$dir}-#{$prop}    : $val;
  border-#{$dir}-#{$prop}        : $val;
}

// Flexboxes
@mixin flex-row($align:center, $justify: flex-start, $wrap:true, $display:flex) {
   @include flexbox(( display:$display, flex-direction:row, align-items:$align, justify-content: $justify, flex-wrap: if($wrap, wrap, nowrap) ));
}
@mixin flex-column($align:stretch, $justify: flex-start, $display:flex) {
   @include flexbox(( display:$display, flex-direction:column, align-items:$align, justify-content: $justify, flex-wrap: nowrap ));
}
@mixin flex-fill() {
   @include flex(1 1 1em);
}
@mixin flex-auto() {
   @include flex(0 0 auto);
}

// Postioning
@mixin position($pos:absolute,$coords:0) {
  position: $pos;
  @if length($coords)==1 {
    top   : nth($coords,1);
    right : nth($coords,1);
    bottom: nth($coords,1);
    left  : nth($coords,1);
  }
  @if length($coords)==2 {
    top   : nth($coords,1);
    right : nth($coords,2);
    bottom: nth($coords,1);
    left  : nth($coords,2);
  }
  @if length($coords)==3 {
    top   : nth($coords,1);
    right : nth($coords,2);
    bottom: nth($coords,3);
    left  : nth($coords,2);
  }
  @if length($coords)==4 {
    top   : nth($coords,1);
    right : nth($coords,2);
    bottom: nth($coords,3);
    left  : nth($coords,4);
  }
}