Skip to content

Instantly share code, notes, and snippets.

@amiceli
Created May 22, 2017 08:21
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 amiceli/f9ddb667399390def265c776034ef375 to your computer and use it in GitHub Desktop.
Save amiceli/f9ddb667399390def265c776034ef375 to your computer and use it in GitHub Desktop.
Generate margin styles with a Less loop
//
// Generate padding and margin classes from 0 to 25px
//
.generate-columns(5);
.generate-columns(@n, @i: 0) when (@i =< @n) {
@num : @i * 5;
.margin@{num} {
margin : (@i * 5px) !important;
}
.marginBottom@{num} {
margin-bottom : (@i * 5px) !important;
}
.marginTop@{num} {
margin-top : (@i * 5px) !important;
}
.marginLeft@{num} {
margin-left : (@i * 5px) !important;
}
.marginRight@{num} {
margin-right : (@i * 5px) !important;
}
.padding@{num} {
padding : (@i * 5px) !important;
}
.paddingBottom@{num} {
padding-bottom : (@i * 5px) !important;
}
.paddingTop@{num} {
padding-top : (@i * 5px) !important;
}
.paddingLeft@{num} {
padding-left : (@i * 5px) !important;
}
.paddingRight@{num} {
padding-right : (@i * 5px) !important;
}
.generate-columns(@n, (@i + 1));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment