_row()

  • /src/css/core/abstract/_row.scss

Abstract row component of flexbox based grid system

scss

.c-row {
  @include _row();

  &__col {
    @include _row__col();

    &--1-3 {
      @include _row__col(1, 3);
    }

    &--offset-1-3 {
      @include _row__col--offset(1, 3);
    }
  }
}

html

<div class="c-row">
  <div class="c-row__col c-row__col--1-3">
    ...
  </div>
</div>

_row__col()

  • /src/css/core/abstract/_row.scss

Abstract column element of flexbox based grid system

scss

//
// @param  int  $columns      molecule column size
// @param  int  $max-columns  denominator column size
//

.c-row {
  @include _row();

  &__col {
    @include _row__col();

    &--1-3 {
      @include _row__col(1, 3);
    }
  }
}

html

<div class="c-row">
  <div class="c-row__col c-row__col--1-3">
    ...
  </div>
</div>

_row__col--width()

  • /src/css/core/abstract/_row.scss

Sets column width of flexbox based grid system

scss

//
// @param  length  $width
//

.c-row {
  @include _row();

  &__col {
    @include _row__col();
    @include _row__col--width(auto);
  }
}

_row__col--offset()

  • /src/css/core/abstract/_row.scss

Sets column offset of flexbox based grid system

scss

//
// @param  int  $columns      molecule column size
// @param  int  $max-columns  denominator column size
//

.c-row {
  @include _row();

  &__col {
    @include _row__col();
    @include _row__col--offset(1, 3);
  }
}

_row--margin()

  • /src/css/core/abstract/_row.scss

Sets row margin of flexbox based grid system

scss

//
// @param  int  $coefficient
//

.c-row {
  @include _row();
  @include _row--margin(1);
}

_row__col--margin()

  • /src/css/core/abstract/_row.scss

Sets column margin of flexbox based grid system

scss

//
// @param  int  $coefficient
//

.c-row {
  @include _row();
  @include _row--margin(1);
}