@import '../settings/variables';
@import '../tools/mixins/gutter';
@import '../tools/mixins/breakpoints';

.o-gutter {
  padding: $gutter-normal;

  @mixin createGutter($infix) {
    &#{$infix}--tiny {
      padding: $gutter-tiny;
    }

    &#{$infix}--small {
      padding: $gutter-small;
    }

    &#{$infix}--normal {
      padding: $gutter-normal;
    }

    &#{$infix}--medium {
      padding: $gutter-medium;
    }

    &#{$infix}--big {
      padding: $gutter-big;
    }

    &#{$infix}--enormous {
      padding: $gutter-enormous;
    }

    &#{$infix}--jumbo {
      padding: $gutter-jumbo;
    }

    @include u-gutter(top, $infix);
    @include u-gutter(right, $infix);
    @include u-gutter(bottom, $infix);
    @include u-gutter(left, $infix);

    &#{$infix}--none {
      padding: 0;
    }
  }

  @each $breakpoint in map-keys($grid-breakpoints) {
    @include media-breakpoint-up($breakpoint) {
      $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

      @include createGutter($infix);
    }
  }

  @each $breakpoint in map-keys($print-grid-breakpoints) {
    @include media-breakpoint-up($print-grid-breakpoints) {
      $infix: breakpoint-infix($breakpoint, $print-grid-breakpoints);

      @media print {
        @include createGutter($infix);
      }
    }
  }
}