Есть ли у кого-то миксин bootstrap-grid для sass?

Question

[Сергей Громов]

Попробовал вытянуть из репозитория папку mixin но чет у меня все криво идет

.block{
    @include make-md-column(4);
    @include make-lg-column(6);
}

на выходи получаются дубли, вот к примеру блок .block

.block {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 992px) {
  .block {
    float: left;
    width: 33.33333%;
  }
}

@media (min-width: 1200px) {
  .block {
    float: left;
    width: 50%;
  }
}

Answer 1

[Андрей Хохлов]

Используйте 4 версию https://github.com/twbs/bootstrap/tree/v4-dev/scss
Сетки и брикпоинты

.block {
  @include make-col;
  @include make-col-span(8);

  @include media-breakpoint-up(md) {
    @include make-col-span(4);
  }

}

Comments

[Сергей Громов]

чо за бред, опять за по 50 строк писать, вы что издеваетесь ?

[Андрей Хохлов]

reskwer: обратитесь к авторам бутстрапа или напишите свой, если уж совсем сильно бомбит

Answer 2

[ForestEsprit]

v4-alpha.getbootstrap.com/layout/grid/#example-usage

// Creates a wrapper for a series of columns
@mixin make-row($gutter: $grid-gutter-width) {
  margin-left:  ($gutter / -2);
  margin-right: ($gutter / -2);
  @include clearfix();
}

// Make the element grid-ready (applying everything but the width)
@mixin make-col($gutter: $grid-gutter-width) {
  position: relative;
  float: left;
  min-height: 1px;
  padding-left:  ($gutter / 2);
  padding-right: ($gutter / 2);
}

// Set a width (to be used in or out of media queries)
@mixin make-col-span($columns) {
  width: percentage(($columns / $grid-columns));
}

// Get fancy by offsetting, or changing the sort order
@mixin make-col-offset($columns) {
  margin-left: percentage(($columns / $grid-columns));
}
@mixin make-col-push($columns) {
  left: percentage(($columns / $grid-columns));
}
@mixin make-col-pull($columns) {
  right: percentage(($columns / $grid-columns));
}