bootstrap spacing in sass using for and each loop

bootstrapspacing.txt

/*
only sides
*/
$sides:  (top, bottom, left, right);
@for $i from 1 through 8 {
  @each $side in $sides {
    .m#{str_slice($side, 0, 1)}-#{$i} {
        margin-#{$side}: #{$i / 2}em ;
    }
    .p#{str_slice($side, 0, 1)}-#{$i} {
        padding-#{$side}: #{$i / 2}em ;
    }
  }
}
/*
with x, y and itself
*/
$sides:  (top, bottom, left, right);
@for $i from 1 through 8 {
  .m-#{$i} {
    margin: #{$i / 2}em;
  }
  .p-#{$i} {
    padding: #{$i / 2}em;
  }
  .mx-#{$i} {
    margin: 0 #{$i / 2}em;
  }
  .px-#{$i} {
    padding: 0 #{$i / 2}em;
  }
  .my-#{$i} {
    margin: #{$i / 2}em 0;
  }
  .py-#{$i} {
    padding: #{$i / 2}em 0;
  }
  @each $side in $sides {
    .m#{str_slice($side, 0, 1)}-#{$i} {
        margin-#{$side}: #{$i / 2}em ;
    }
    .p#{str_slice($side, 0, 1)}-#{$i} {
        padding-#{$side}: #{$i / 2}em ;
    }
  }
}