Skip to content

Instantly share code, notes, and snippets.

@jonathan-beebe
Created July 21, 2014 18:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jonathan-beebe/5ea1df3c7ea4f39a2019 to your computer and use it in GitHub Desktop.
Save jonathan-beebe/5ea1df3c7ea4f39a2019 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----
@mixin item-generator ($n, $i: 1) {
@while $i <= $n {
.item--block--#{$i} {
@extend %item;
.item {
width: (100% / $i);
}
}
$i: $i + 1;
}
}
%item {
padding: 12px;
}
.item {
@extend %item;
& + .item {
padding-left: 0;
}
}
.item--block {
width: 100%;
display: inline-block;
}
@include item-generator(12);
.item, .item--block--1, .item--block--2, .item--block--3, .item--block--4, .item--block--5, .item--block--6, .item--block--7, .item--block--8, .item--block--9, .item--block--10, .item--block--11, .item--block--12 {
padding: 12px;
}
.item + .item {
padding-left: 0;
}
.item--block {
width: 100%;
display: inline-block;
}
.item--block--1 .item {
width: 100%;
}
.item--block--2 .item {
width: 50%;
}
.item--block--3 .item {
width: 33.33333%;
}
.item--block--4 .item {
width: 25%;
}
.item--block--5 .item {
width: 20%;
}
.item--block--6 .item {
width: 16.66667%;
}
.item--block--7 .item {
width: 14.28571%;
}
.item--block--8 .item {
width: 12.5%;
}
.item--block--9 .item {
width: 11.11111%;
}
.item--block--10 .item {
width: 10%;
}
.item--block--11 .item {
width: 9.09091%;
}
.item--block--12 .item {
width: 8.33333%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment