_space.scss 1.2 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55

@mixin fn($space,$direction,$size,$n) {
	@if $n {
		#{$space}-#{$direction}: #{$size*$uni-space-root}px
	} @else {
		 #{$space}-#{$direction}: #{-$size*$uni-space-root}px
	}
}
@mixin get-styles($direction,$i,$space,$n){
	@if $direction == t {
		@include fn($space, top,$i,$n);
	} 
	@if $direction == r {
		@include fn($space, right,$i,$n);
	} 
	@if $direction == b {
		@include fn($space, bottom,$i,$n);
	} 
	@if $direction == l {
	 @include fn($space, left,$i,$n);
	} 
	@if $direction == x {
		@include fn($space, left,$i,$n);
		@include fn($space, right,$i,$n);
	} 
	@if $direction == y {
		@include fn($space, top,$i,$n);
		@include fn($space, bottom,$i,$n);
	} 
	@if $direction == a {
		@if $n {
			#{$space}:#{$i*$uni-space-root}px;
		} @else {
			#{$space}:#{-$i*$uni-space-root}px;
		}
	} 
}

@each $orientation in m,p {
	$space: margin;
	@if $orientation == m {
		$space: margin;
	} @else {
		$space: padding;
	}
	@for $i from 0 through 16 {
		@each $direction in t, r, b, l, x, y, a {
			.uni-#{$orientation}#{$direction}-#{$i} { 
				@include  get-styles($direction,$i,$space,true);
			} 
			.uni-#{$orientation}#{$direction}-n#{$i} { 
				@include  get-styles($direction,$i,$space,false);
			}
		}
	}
56
}