Generated by SassMeister.com.

input.scss

@use "sass:list";

// THIS FILE IS GENERATED
$spacing-1: 0.313;
$spacing-2: 0.5;
$spacing-3: 0.625;
$spacing-4: 0.938;
$spacing-5: 1.25;
$spacing-6: 1.875;
$spacing-7: 3.125;

$valid-spacings: 'xxs', 'xs', 'sm', 'default', 'md', 'lg', 'xl', 'xxl';
$valid-positions: top, bottom, left, right, horizontal, vertical, x, y, none, '';

$spacing-list: (
'xxs': $spacing-1, 
'xs': $spacing-2, 
'sm': $spacing-3, 
'default': $spacing-4,
'md': $spacing-4,
'lg': $spacing-5, 
'xl': $spacing-6,
'xxl': $spacing-7
);

@mixin margin($pos, $size: md) {
    $getSize: map-get($spacing-list, $size);
    
    @if not list.index($valid-positions, $pos) {
        @error "#{$pos} is not a valid position. Expected one of #{$valid-positions}.";
    }
    
    @if not list.index($valid-spacings, $size) {
        @error "#{$size} is not a size. Expected one of #{$valid-spacings}";
    }
    
    @if ($pos == none or $pos == '') {
        margin: #{$getSize}rem;
    } @else if ($pos == 'vertical' or $pos == 'y') {
        margin-top: #{$getSize}rem;
        margin-bottom: #{$getSize}rem;
    } @else if ($pos == 'horizontal' or $pos == 'x') {
        margin-left: #{$getSize}rem;
        margin-right: #{$getSize}rem;
    } @else {
        margin-#{$pos}: #{$getSize}rem;
    }
}

.foo {
    @include margin(top, md);
}

.bar {
    @include margin(bottom, lg);
}

.baz {
    @include margin('', sm);
    @include margin(none, md);
}

.fiz {
    @include margin(left, sm);
}

.flaps {
    @include margin(vertical, sm);
    @include margin(y, sm);
}

.flapsz {
    @include margin(horizontal, sm);
    @include margin(x, sm);
}

.faz {
    @include margin(right, sm);
}

output.css

.foo {
  margin-top: 0.938rem;
}

.bar {
  margin-bottom: 1.25rem;
}

.baz {
  margin: 0.625rem;
  margin: 0.938rem;
}

.fiz {
  margin-left: 0.625rem;
}

.flaps {
  margin-top: 0.625rem;
  margin-bottom: 0.625rem;
  margin-top: 0.625rem;
  margin-bottom: 0.625rem;
}

.flapsz {
  margin-left: 0.625rem;
  margin-right: 0.625rem;
  margin-left: 0.625rem;
  margin-right: 0.625rem;
}

.faz {
  margin-right: 0.625rem;
}

settings.json

{
  "sass": {
    "compiler": "dart-sass/1.26.11",
    "extensions": {},
    "syntax": "SCSS",
    "outputStyle": "expanded"
  },
  "autoprefixer": false
}