Contents

@import "settings.global";
@import "utilities.visibility";

@mixin grid {
  @include display-flex;
}

@mixin grid--wrap {
  flex-wrap: wrap;
}

@mixin grid--top {
  align-items: flex-start;
}

@mixin grid--center {
  align-items: center;
}

@mixin grid--bottom {
  align-items: flex-end;
}

@mixin grid__cell {
  flex: 1;
  padding-right: $grid-gutter;
  padding-left: $grid-gutter;
}

@mixin grid__cell--no-gutter {
  padding-right: .001em;
  padding-left: .001em;
}

@mixin grid__cell--top {
  align-self: flex-start;
}

@mixin grid__cell--center {
  align-self: center;
}

@mixin grid__cell--bottom {
  align-self: flex-end;
}

@mixin grid__cell--width-fixed {
  flex: 0 1 auto;
}

@mixin grid__cell--fit {
  flex: 1;
}

@mixin grid--full {
  flex-wrap: wrap;
}

@mixin grid__cell--full {
  flex: 0 0 100%;
  max-width: 100%;
  margin-left: 0;
}

@mixin grid__cell--hidden {
  @include display-none;
}

@mixin grid__cell--visible {
  @include display-initial;
}

@mixin grid__cell--width($width) {
  flex: 0 0 $width;
  max-width: $width;
}

@mixin grid__cells {
  @each $width, $fraction in $grid-widths {
    &--width-#{$width} {
      @include grid__cell--width($fraction * 100%);
    }

    &--offset-#{$width} {
      margin-left: $fraction * 100%;
    }
  }
}

@mixin grid__responsive-cells($screen-width) {
  @each $width, $fraction in $grid-widths {
    &--hidden\@#{$screen-width} {
      @include grid__cell--hidden
    }

    &--visible\@#{$screen-width} {
      @include grid__cell--visible;
    }

    &--width-#{$width}\@#{$screen-width} {
      flex: 0 0 $fraction * 100%;
      max-width: $fraction * 100%;
    }

    &--offset-#{$width}\@#{$screen-width} {
      margin-left: $fraction * 100%;
    }

    &--width-fixed\@#{$screen-width} {
      @include grid__cell--width-fixed;
    }
  }
}

Version data entries

25 entries across 25 versions & 3 rubygems

Version	Path
iatelier-0.1.8	lib/iatelier/assets/sass/blaze/mixins/_objects.grid.scss
iatelier-0.1.7	lib/iatelier/assets/sass/blaze/mixins/_objects.grid.scss
iatelier-0.1.5	lib/iatelier/assets/sass/blaze/mixins/_objects.grid.scss
iatelier-0.1.4	lib/iatelier/assets/sass/blaze/mixins/_objects.grid.scss
iatelier-0.1.3	lib/iatelier/assets/sass/blaze/mixins/_objects.grid.scss