$flex-properties: (
  'c': center,
  'sa': space-around,
  'sb': space-between,
  'en': flex-end,
  'sh': stretch,
  'st': flex-start,
);

$absolute-offset-properties: (
  //Order: top left bottom right
    't': null 0 100% null,
  'l': 0 null null 100%,
  'b': 100% 0 null null,
  'r': 0 100% null null,
  'tl': null null 100% 100%,
  'tr': null 100% 100% null,
  'bl': 100% null null 100%,
  'br': 100% 100% null null
);

$absolute-center-properties: (
  //Order: top left bottom right
    'c': 50% 50% null null,
  'tc': 0 50% null null,
  'lc': 50% 0 null null,
  'bc': null 50% 0 null,
  'rc': 50% null null 0
);

.m-ab {
  @include absolute($top: 0, $left: 0);

  &-of {
    @each $suffix, $value in $absolute-offset-properties {
      &-#{$suffix} {
        @include absolute($top: nth($value, 1), $left: nth($value, 2), $bottom: nth($value, 3), $right: nth($value, 4));
      }
    }
  }

  @each $suffix, $value in $absolute-center-properties {
    &-#{$suffix} {
      @include absolute($top: nth($value, 1), $left: nth($value, 2), $bottom: nth($value, 3), $right: nth($value, 4));
    }
  }
}

.m-fx {
  @include flex;

  &-cl {
    @include flex(column);
  }

  &-no {
    flex: none;
  }

  @each $suffixA, $valueA in $flex-properties {
    @each $suffixB, $valueB in $flex-properties {
      @if ($suffixB != 'sa' and $suffixB != 'sb') {
        &-#{$suffixA}-#{$suffixB} {
          @include flex(row, $justify: $valueA, $align: $valueB);
        }
      }

      @if ($suffixA != 'sa' and $suffixA != 'sb') {
        &-#{$suffixB}-#{$suffixA} {
          @include flex(row, $justify: $valueB, $align: $valueA);
        }
      }

      &-cl {
        @if ($suffixB != 'sa' and $suffixB != 'sb') {
          &-#{$suffixA}-#{$suffixB} {
            @include flex(column, $justify: $valueA, $align: $valueB);
          }
        }

        @if ($suffixA != 'sa' and $suffixA != 'sb') {
          &-#{$suffixB}-#{$suffixA} {
            @include flex(column, $justify: $valueB, $align: $valueA);
          }
        }
      }
    }
  }
}

.m-al {
  @each $suffix, $value in $flex-properties {
    @if ($suffix != 'sa' and $suffix != 'sb') {
      &-#{$suffix} {
        align-self: $value;
      }
    }
  }
}
