$gridstack-columns: 12;

@mixin grid-stack-items($gridstack-columns) {
  .grid-stack.grid-stack-#{$gridstack-columns} {
    > .grid-stack-item {

      @for $i from 1 through $gridstack-columns {
        &[data-gs-width='#{$i}'] {
          width: (100% / $gridstack-columns) * $i;
        }

        &[data-gs-x='#{$i}'] {
          left: (100% / $gridstack-columns) * $i;
        }

        &[data-gs-min-width='#{$i}'] {
          min-width: (100% / $gridstack-columns) * $i;
        }

        &[data-gs-max-width='#{$i}'] {
          max-width: (100% / $gridstack-columns) * $i;
        }
      }
      min-width: 100% / $gridstack-columns;
    }
  }
}

@for $j from 1 through $gridstack-columns {
  @include grid-stack-items($j);
}
