Prefixer

One major goal of this framework is to be as adaptable as possible which includes cross browser compatibility. We have adapted a prefixer script to Sass which will automatically add all browser prefixes for certain CSS properties.

For Example: Using this Sass mixin

          @include transition(.3s);
        

Will Output This

          -webkit-transition: 0.3s;
          -moz-transition: 0.3s;
          -o-transition: 0.3s;
          -ms-transition: 0.3s;
          transition: 0.3s;
        

Mixins

Here is the full list of mixins

          animation($args)
          animation-delay($delay)
          animation-direction($direction)
          animation-duration($duration)
          animation-fill-mode($mode)
          animation-iteration-count($count)
          animation-name($name)
          animation-play-state($state)
          animation-timing-function($function)
          background-size($args)
          box-sizing($args)
              border-box()
              content-box()
          columns($args)
              column-count($count)
              column-gap($gap)
              column-rule($args)
              column-width($width)
          flex 
          flex-it
          flex-row
          flex-row-reverse
          flex-col
          flex-col-reverse
          flex-align-between
          flex-align-center
          flex-align-start
          flex-align-items-start
          flex-align-items-center
          flex-start-all
          flex-align-items-stretch
          flex-justify-between
          flex-justify-center
          flex-justify-start
          flex-justify-end
          flex-justify-space-around
          flex-wrap
          flex-item-auto
          gradient($default,$start,$stop)
              linear-gradient-top($default,$color1,$stop1,$color2,$stop2,[$color3,$stop3,$color4,$stop4])
              linear-gradient-left($default,$color1,$stop1,$color2,$stop2,[$color3,$stop3,$color4,$stop4])
          keyframes(fadeIn)
          rotate($params)
          skewY($val)
          slantColorsLeft($color1,$color2)
          slantColors($color1, $color2)
          transform($args)
              transform-origin($args)
              transform-style($style)
              rotate($deg)
              scale($factor)
              translate($x,$y)
              translate3d($x,$y,$z)
              translateHardware($x,$y)
          text-shadow($args)
          transition($args)
              transition-delay($delay)
              transition-duration($duration)
              transition-property($property)
              transition-timing-function($function)
          slantColors($color1, $color2)