Created
September 25, 2015 15:37
-
-
Save daphotron/4715ac7509afcce2eb7a to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
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
// ---- | |
// libsass (v3.2.5) | |
// ---- | |
// Spacing Mixins | |
// -------------------------------------------------- | |
$orientation_list: ( | |
v, | |
h, | |
a | |
); | |
$direction_list: ( | |
(t, top), | |
(r, right), | |
(b, bottom), | |
(l, left) | |
); | |
$space_sizes: | |
(n, 0px), | |
(s, 5px), | |
(m, 7px), | |
(l, 10px), | |
(xl, 20px), | |
(xxl, 40px), | |
(xxxl, 120px) | |
; | |
@each $direction_list, $direction in $direction_list { | |
@each $space_sizes, $size in $space_sizes { | |
.p#{$direction_list}#{$space_sizes} { | |
padding-#{$direction}: $size !important; | |
} | |
.m#{$direction_list}#{$space_sizes} { | |
margin-#{$direction}: $size !important; | |
} | |
} | |
} | |
@each $orientation_list, $orientation in $orientation_list { | |
@each $space_sizes, $size in $space_sizes { | |
@if $orientation_list == "v" { | |
.p#{$orientation_list}#{$space_sizes} { | |
padding-bottom: $size !important; | |
padding-top: $size !important; | |
} | |
.m#{$orientation_list}#{$space_sizes} { | |
margin-bottom: $size !important; | |
margin-top: $size !important; | |
} | |
} | |
@else if $orientation_list == "h" { | |
.p#{$orientation_list}#{$space_sizes} { | |
padding-left: $size !important; | |
padding-right: $size !important; | |
} | |
.m#{$orientation_list}#{$space_sizes} { | |
margin-left: $size !important; | |
margin-right: $size !important; | |
} | |
} | |
@else { | |
.p#{$orientation_list}#{$space_sizes} { | |
padding: $size !important; | |
} | |
.m#{$orientation_list}#{$space_sizes} { | |
margin: $size !important; | |
} | |
} | |
} | |
} |
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
.ptn { | |
padding-top: 0px !important; | |
} | |
.mtn { | |
margin-top: 0px !important; | |
} | |
.pts { | |
padding-top: 5px !important; | |
} | |
.mts { | |
margin-top: 5px !important; | |
} | |
.ptm { | |
padding-top: 7px !important; | |
} | |
.mtm { | |
margin-top: 7px !important; | |
} | |
.ptl { | |
padding-top: 10px !important; | |
} | |
.mtl { | |
margin-top: 10px !important; | |
} | |
.ptxl { | |
padding-top: 20px !important; | |
} | |
.mtxl { | |
margin-top: 20px !important; | |
} | |
.ptxxl { | |
padding-top: 40px !important; | |
} | |
.mtxxl { | |
margin-top: 40px !important; | |
} | |
.ptxxxl { | |
padding-top: 120px !important; | |
} | |
.mtxxxl { | |
margin-top: 120px !important; | |
} | |
.prn { | |
padding-right: 0px !important; | |
} | |
.mrn { | |
margin-right: 0px !important; | |
} | |
.prs { | |
padding-right: 5px !important; | |
} | |
.mrs { | |
margin-right: 5px !important; | |
} | |
.prm { | |
padding-right: 7px !important; | |
} | |
.mrm { | |
margin-right: 7px !important; | |
} | |
.prl { | |
padding-right: 10px !important; | |
} | |
.mrl { | |
margin-right: 10px !important; | |
} | |
.prxl { | |
padding-right: 20px !important; | |
} | |
.mrxl { | |
margin-right: 20px !important; | |
} | |
.prxxl { | |
padding-right: 40px !important; | |
} | |
.mrxxl { | |
margin-right: 40px !important; | |
} | |
.prxxxl { | |
padding-right: 120px !important; | |
} | |
.mrxxxl { | |
margin-right: 120px !important; | |
} | |
.pbn { | |
padding-bottom: 0px !important; | |
} | |
.mbn { | |
margin-bottom: 0px !important; | |
} | |
.pbs { | |
padding-bottom: 5px !important; | |
} | |
.mbs { | |
margin-bottom: 5px !important; | |
} | |
.pbm { | |
padding-bottom: 7px !important; | |
} | |
.mbm { | |
margin-bottom: 7px !important; | |
} | |
.pbl { | |
padding-bottom: 10px !important; | |
} | |
.mbl { | |
margin-bottom: 10px !important; | |
} | |
.pbxl { | |
padding-bottom: 20px !important; | |
} | |
.mbxl { | |
margin-bottom: 20px !important; | |
} | |
.pbxxl { | |
padding-bottom: 40px !important; | |
} | |
.mbxxl { | |
margin-bottom: 40px !important; | |
} | |
.pbxxxl { | |
padding-bottom: 120px !important; | |
} | |
.mbxxxl { | |
margin-bottom: 120px !important; | |
} | |
.pln { | |
padding-left: 0px !important; | |
} | |
.mln { | |
margin-left: 0px !important; | |
} | |
.pls { | |
padding-left: 5px !important; | |
} | |
.mls { | |
margin-left: 5px !important; | |
} | |
.plm { | |
padding-left: 7px !important; | |
} | |
.mlm { | |
margin-left: 7px !important; | |
} | |
.pll { | |
padding-left: 10px !important; | |
} | |
.mll { | |
margin-left: 10px !important; | |
} | |
.plxl { | |
padding-left: 20px !important; | |
} | |
.mlxl { | |
margin-left: 20px !important; | |
} | |
.plxxl { | |
padding-left: 40px !important; | |
} | |
.mlxxl { | |
margin-left: 40px !important; | |
} | |
.plxxxl { | |
padding-left: 120px !important; | |
} | |
.mlxxxl { | |
margin-left: 120px !important; | |
} | |
.pvn { | |
padding-bottom: 0px !important; | |
padding-top: 0px !important; | |
} | |
.mvn { | |
margin-bottom: 0px !important; | |
margin-top: 0px !important; | |
} | |
.pvs { | |
padding-bottom: 5px !important; | |
padding-top: 5px !important; | |
} | |
.mvs { | |
margin-bottom: 5px !important; | |
margin-top: 5px !important; | |
} | |
.pvm { | |
padding-bottom: 7px !important; | |
padding-top: 7px !important; | |
} | |
.mvm { | |
margin-bottom: 7px !important; | |
margin-top: 7px !important; | |
} | |
.pvl { | |
padding-bottom: 10px !important; | |
padding-top: 10px !important; | |
} | |
.mvl { | |
margin-bottom: 10px !important; | |
margin-top: 10px !important; | |
} | |
.pvxl { | |
padding-bottom: 20px !important; | |
padding-top: 20px !important; | |
} | |
.mvxl { | |
margin-bottom: 20px !important; | |
margin-top: 20px !important; | |
} | |
.pvxxl { | |
padding-bottom: 40px !important; | |
padding-top: 40px !important; | |
} | |
.mvxxl { | |
margin-bottom: 40px !important; | |
margin-top: 40px !important; | |
} | |
.pvxxxl { | |
padding-bottom: 120px !important; | |
padding-top: 120px !important; | |
} | |
.mvxxxl { | |
margin-bottom: 120px !important; | |
margin-top: 120px !important; | |
} | |
.phn { | |
padding-left: 0px !important; | |
padding-right: 0px !important; | |
} | |
.mhn { | |
margin-left: 0px !important; | |
margin-right: 0px !important; | |
} | |
.phs { | |
padding-left: 5px !important; | |
padding-right: 5px !important; | |
} | |
.mhs { | |
margin-left: 5px !important; | |
margin-right: 5px !important; | |
} | |
.phm { | |
padding-left: 7px !important; | |
padding-right: 7px !important; | |
} | |
.mhm { | |
margin-left: 7px !important; | |
margin-right: 7px !important; | |
} | |
.phl { | |
padding-left: 10px !important; | |
padding-right: 10px !important; | |
} | |
.mhl { | |
margin-left: 10px !important; | |
margin-right: 10px !important; | |
} | |
.phxl { | |
padding-left: 20px !important; | |
padding-right: 20px !important; | |
} | |
.mhxl { | |
margin-left: 20px !important; | |
margin-right: 20px !important; | |
} | |
.phxxl { | |
padding-left: 40px !important; | |
padding-right: 40px !important; | |
} | |
.mhxxl { | |
margin-left: 40px !important; | |
margin-right: 40px !important; | |
} | |
.phxxxl { | |
padding-left: 120px !important; | |
padding-right: 120px !important; | |
} | |
.mhxxxl { | |
margin-left: 120px !important; | |
margin-right: 120px !important; | |
} | |
.pan { | |
padding: 0px !important; | |
} | |
.man { | |
margin: 0px !important; | |
} | |
.pas { | |
padding: 5px !important; | |
} | |
.mas { | |
margin: 5px !important; | |
} | |
.pam { | |
padding: 7px !important; | |
} | |
.mam { | |
margin: 7px !important; | |
} | |
.pal { | |
padding: 10px !important; | |
} | |
.mal { | |
margin: 10px !important; | |
} | |
.paxl { | |
padding: 20px !important; | |
} | |
.maxl { | |
margin: 20px !important; | |
} | |
.paxxl { | |
padding: 40px !important; | |
} | |
.maxxl { | |
margin: 40px !important; | |
} | |
.paxxxl { | |
padding: 120px !important; | |
} | |
.maxxxl { | |
margin: 120px !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment