2024-08-16 14:04:26 +08:00

56 lines
1.3 KiB
SCSS

@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);
}
}
}
}