Mixin for Generaing CSS classes for margin and padding.

mixins.scss

/*
 * Generate Margin/Padding Classes
 * margin, margin-top, margin-bottom, margin-left, margin-right
 * padding, padding-top, padding-bottom, padding-left, padding-right
 */

@mixin margin-padding($min, $max, $css-property, $klass, $csspx: $min) {
  @while $min <= $max {

    @if $min != 0 {
      $csspx: $min+px;
    }

    .#{$klass}-#{$min} {
      #{$css-property}: $csspx !important;
    }

    .#{$klass}-t-#{$min} {
      #{$css-property}-top: $csspx !important;
    }

    .#{$klass}-b-#{$min} {
      #{$css-property}-bottom: $csspx !important;
    }

    .#{$klass}-l-#{$min} {
      #{$css-property}-left: $csspx !important;
    }

    .#{$klass}-r-#{$min} {
      #{$css-property}-right: $csspx !important;
    }

    $min: $min + 5;
  }
}

@include margin-padding(0, 40, margin, m);
@include margin-padding(0, 40, padding, p);