Skip to content

Instantly share code, notes, and snippets.

@sapphirus
Last active June 1, 2016 06:15
Show Gist options
  • Select an option

  • Save sapphirus/5574e70eca98c4dadf0f171c17474888 to your computer and use it in GitHub Desktop.

Select an option

Save sapphirus/5574e70eca98c4dadf0f171c17474888 to your computer and use it in GitHub Desktop.
Offset
// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----
// Offset
$offset-basesize: 16 !default
$offset-size-map: (none: 0, tiny: $offset-basesize * 0.25, small: $offset-basesize * 0.5, medium: $offset-basesize, large: $offset-basesize * 1.5, xlarge: $offset-basesize * 2, xxlarge: $offset-basesize * 3)
$offset-map: (margin: "m", margin-top: "mt", margin-bottom: "mb", margin-left: "ml", margin-right: "mr", padding: "p", padding-top: "pt", padding-bottom: "pb", padding-left: "pl", padding-right: "pr")
=offset($name, $prop)
@each $size in map-keys($offset-size-map)
$val: map-get($offset-size-map, $size)
.#{$name}-#{$size}
#{$prop}: #{$val}px !important
@each $prop in map-keys($offset-map)
$name: map-get($offset-map, $prop)
+offset($name, $prop)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment