@use "operations" as ops;
.container{
  max-width: calc(100% - 20px);
  margin: $baseSpacing auto;
}
@each $breakpoint, $value in $breakpoint-map {
  @media (min-width: $value) {
    .container{
      max-width: $value * .95;
      margin: 0 auto;
    }
  }
}

@mixin widthHeight($key, $property){
  @each $hw, $unit in $height-width-unit-map{
    @each $value in $height-width-value-map{
      .#{$key}-#{$value}#{$hw}{
        #{$property}: unquote($value+$unit);
      }
      @include ops.generate-breakpoints(#{$key}-#{$value}#{$hw}, #{$property}, unquote($value+$unit), $breakpoint-map)
    }
  }
}
@include widthHeight("w","width");
@include widthHeight("h","height");

/* Positioning */

@function positioning($iterator, $property){
  $value:"0";
  @if($iterator>0){
    $value: ($iterator * $spacingStep) + $spacingUnit;
  }
  @return (#{$property}-#{$iterator}: $value);
}

@include ops.mapToClassUnquote($position-key, $position-map, "position", $breakpoint-map);
@each $key, $value in $shorthand-map{
  @if(type_of($value) != 'map'){
    $map: ops.generateMapLoop($numSpacingUnits, get-function("positioning"), $value);
    @include ops.mapToClassUnquote($position-key, $map, $value, $breakpoint-map);
  } @else {
    @each $subKey, $subValue in $value{
      $map: ops.generateMapLoop($numSpacingUnits, get-function("positioning"), $subValue);
      @include ops.crossMapping($position-key, $map, $value, $breakpoint-map);
    }
  }
}


/* utility generator */




@each $property-class, $property in $property-map {
  @include ops.crossMapping($property-class, ("auto":"0 auto"), ("x":$property), $breakpoint-map);
  @include ops.utilityUnitMatcher($property-class,$property, $numSpacingUnits, $spacingStep, $spacingUnit);
  @each $breakpoint, $value in $breakpoint-map {
    @media (min-width: $value) {
      @include ops.utilityUnitMatcher('#{$breakpoint}\\:#{$property-class}',$property, $numSpacingUnits, $spacingStep, $spacingUnit);
    }
  }
  @each $property-modifier, $property-addon in $shorthand-map{
    $class: $property-class + '-' + $property-modifier;
    $p-map:(0:$property);
    $p-end:();

    @if(type_of($property-addon) == 'map'){
      $p-end: map_merge($p-map,$property-addon);
    } @else {
      $p-end: map_merge($p-map,(1:$property-addon));
    }
    @include ops.utilityUnitMatcher($class,$p-end, $numSpacingUnits, $spacingStep, $spacingUnit);
    @each $breakpoint, $value in $breakpoint-map {
      @media (min-width: $value) {
        @include ops.utilityUnitMatcher('#{$breakpoint}\\:#{$class}',$p-end, $numSpacingUnits, $spacingStep, $spacingUnit);
      }
    }
  }
}