Typical SCSS code

moving_to_scss.css.scss

/* this is how a partials will look like*/
@import "../mixins/box-shadow";
@import "../mixins/error-message";
@import "../mixins/font-variant";
@import "../mixins/text-align";
@import "../mixins/variables";

/*This is how typical a mixin look like*/
@mixin box-shadow($top, $left, $blur, $color, $inset:"") {
  -webkit-box-shadow:$top $left $blur $color #{$inset};
  -moz-box-shadow:$top $left $blur $color #{$inset};
  box-shadow:$top $left $blur $color #{$inset};
}