1
@each $direction in $directions {
%u-no-padding-#{$direction}{padding-#{direction}: 0;}
%u-half-padding-#{$direction}{padding-#{direction}: $layout-module-size / 2;}
%u-default-padding-#{$direction}{padding-#{direction}: $layout-module-size;}
%u-double-padding-#{$direction}{padding-#{direction}: $layout-module-size * 2;}
%u-no-margin-#{$direction}{margin-#{direction}: 0;}
%u-half-margin-#{$direction}{margin-#{direction}: $layout-module-size / 2;}
%u-default-margin-#{$direction}{margin-#{direction}: $layout-module-size;}
%u-double-margin-#{$direction}{margin-#{direction}: $layout-module-size * 2;}
}
body{
@extend %u-double-margin-top, %u-double-margin-bottom, %u-half-margin-bottom;
}
in the compilation this generating the following result
body {
margin-direction: 60px;
}
body {
margin-direction: 15px;
}
body {
margin-direction: 60px;
}
Does anyone know how to solve this problem? I need the generated result to be inside the same body.