/**
 * AppBuckets UI
 *
 * _Row @ src/styles/grid/_row.scss
 *
 * Defined at 05 giu 2020
 * Copyright Marco Cavanna • 2020
 *
 * ---
 * Row Definition
 *
 */


/******
    Set the base Row Style
    each row will contains columns
******/
.#{$row-class-name} {
  display: flex;
  flex-wrap: wrap;
  margin-left: -$columns-gutter;
  margin-right: -$columns-gutter;
  width: calc(100% + #{$columns-gutter * 2});

  /// Generate row class to avoid column gutter
  @if $generate-row-without-gutter == true {
    @include selectors-for-each-breakpoint('without-gap') {
      margin-left: 0 !important;
      margin-right: 0 !important;

      > .#{$column-class-name} {
        padding-right: 0 !important;
        padding-left: 0 !important;
      }
    }
  }

  /// Generate Column Horizontal Disposition
  @each $label, $align in (on-start: flex-start, centered: center, on-end: flex-end, spaced-between: space-between, spaced-around: space-around) {
    @include selectors-for-each-breakpoint($label, $attach-to-selector: true) {
      justify-content: $align;
    }
  }

  /// Generate Column Vertical Disposition
  @each $label, $align in (on-top: flex-start, center: center, on-bottom: flex-end, stretched: stretch) {
    @include selectors-for-each-breakpoint($label, $attach-to-selector: true) {
      align-items: $align;
    }
  }
}