Skip to content

Instantly share code, notes, and snippets.

@simonsmith
Created September 4, 2014 12:41
Show Gist options
  • Save simonsmith/777343e958a7622eaa2d to your computer and use it in GitHub Desktop.
Save simonsmith/777343e958a7622eaa2d to your computer and use it in GitHub Desktop.
SUIT CSS spacing utils in stylus
/**
* Spacing utilities
*
* Used to override styles on components without need for
* additional modifier classes
*
* Usage:
* <div class="u-mbZ"> // margin-bottom: 0
* <div class="u-mt20"> // margin-top: 20px
* <div class="u-m25"> // margin: 25px
*/
properties = {
m: margin,
p: padding,
mt: margin-top,
mr: margin-right,
mb: margin-bottom,
ml: margin-left,
pt: padding-top,
pr: padding-right,
pb: padding-bottom,
pl: padding-left
}
sizes = 2,3,4,5,10,15,20,25,30,35,40
for size in sizes
val = (size)px
for keyword, property in properties
.u-{keyword}{size}
{property} val !important
for keyword, property in properties
.u-{keyword}Z
{property} 0 !important
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment