Created
January 21, 2019 15:40
-
-
Save feload/bbb473eda306274e2a2c8e51cbd80eb4 to your computer and use it in GitHub Desktop.
Margin and padding for sass.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@mixin mt($px) { margin-top: $px; } | |
@mixin mb($px) { margin-bottom: $px; } | |
@mixin ml($px) { margin-left: $px; } | |
@mixin mr($px) { margin-right: $px; } | |
@mixin ma($px) { margin: $px; } | |
@mixin mx($px) { @include ml($px); @include mr($px); } | |
@mixin my($px) { @include mt($px); @include mb($px); } | |
@mixin pt($px) { padding-top: $px; } | |
@mixin pb($px) { padding-bottom: $px; } | |
@mixin pl($px) { padding-left: $px; } | |
@mixin pr($px) { padding-right: $px; } | |
@mixin pa($px) { padding: $px; } | |
@mixin px($px) { @include pl($px); @include pr($px); } | |
@mixin py($px) { @include pt($px); @include pb($px); } | |
@for $l from 0 through 10{ | |
$i: #{$l * 5}; | |
.mt-#{$i}{ @include mt($i+'px'); } | |
.mb-#{$i}{ @include mb($i+'px'); } | |
.ml-#{$i}{ @include ml($i+'px'); } | |
.mr-#{$i}{ @include mr($i+'px'); } | |
.ma-#{$i}{ @include ma($i+'px'); } | |
.my-#{$i}{ @include my($i+'px'); } | |
.pt-#{$i}{ @include pt($i+'px'); } | |
.pb-#{$i}{ @include pb($i+'px'); } | |
.pl-#{$i}{ @include pl($i+'px'); } | |
.pr-#{$i}{ @include pr($i+'px'); } | |
.pa-#{$i}{ @include pa($i+'px'); } | |
.py-#{$i}{ @include py($i+'px'); } | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment