Toolkit: Common @Mixins and helpers commonly used in projects

helpers.scss

%clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

mixins-position.scss

// ===================================================
// Positional Mixins
// ===================================================

@mixin fixed($top:0, $right:0, $bottom:0, $left:0) {

  position: fixed;
  top: $top;
  right: $right;
  bottom: $bottom;
  left: $left;

}

utilities.scss

// ===================================================
// Utilities
// ===================================================

@function rem($size) {
  
  $font-base: 16px !default;
 
  @if ($old-ie == true) {
    @return $size *1px;
  }
 
  @else {
    @return ($size / $font-base) * 1rem;
  }
 
}

// For IE fallback, create an ie specific stylesheet
// and include the following:
//
// $old-ie: true;
// @import "styles";
// 
// Where 'styles' is your main scss stylesheet name
// Include both stylesheets using conditional comments