Sass @for directive to loop through each row of a Singularity grid layout

Source: http://thesassway.com/intermediate/if-for-each-while#for

@for $i from 1 through 4 {
  &.row-#{$i}-first {
    &.row-#{$i}-second {
      &.row-#{$i}-third { // 1, 2, 3 have content
        .l-row-#{$i}-first { @include grid-span(4,1); }
        .l-row-#{$i}-second { @include grid-span(4,5); }
        .l-row-#{$i}-third { @include grid-span(4,9); }
      }
      &.row-#{$i}-third-empty { // 1, 2 have content
        .l-row-#{$i}-first { @include grid-span(6,1); }
        .l-row-#{$i}-second { @include grid-span(6,7); }
      }
    }
    &.row-#{$i}-second-empty.row-#{$i}-third { // 1, 3 have content
      .l-row-#{$i}-first { @include grid-span(6,1); }
      .l-row-#{$i}-third { @include grid-span(6,7); }
    }
  }
  &.row-#{$i}-first-empty.row-#{$i}-second.row-#{$i}-third { // 2, 3 have content
    .l-row-#{$i}-second { @include grid-span(6,1); }
    .l-row-#{$i}-third { @include grid-span(6,7); }
  }
  &.row-#{$i}-first.row-#{$i}-second-empty.row-#{$i}-third-empty { // only 1 has content
    .l-row-#{$i}-first { @include grid-span(12,1); }
  }
  &.row-#{$i}-first-empty.row-#{$i}-second.row-#{$i}-third-empty { // only 2 has content
    .l-row-#{$i}-second { @include grid-span(12,1); }
  }
  &.row-#{$i}-first-empty.row-#{$i}-second-empty.row-#{$i}-third { // only 3 has content
    .l-row-#{$i}-third { @include grid-span(12,1); }
  }
}