$gridstack-columns: 12 !default;

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

        > .grid-stack-item {
            min-width: 100% / $gridstack-columns;

            @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; }
            }
        }
    }
}

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