Как определить поля сетки для каждой точки останова при семантическом построении XY-сетки Foundation

Я хочу построить сетку, используя миксины для XY-сетки в Zurb Foundation 6.6, но у меня возникают проблемы, когда я хочу установить отрицательные поля для самой сетки только на определенных точках останова.

Использование миксина xy-gutters() создает поля для каждой точки останова, и я не могу использовать поля только для некоторых из них.

В приведенном ниже примере я хочу, чтобы точка останова (средняя) имела ячейку без бороздок.

Как это должно быть сделано?

Спасибо за вашу помощь!

.hero {
  &__container {
    @include xy-grid-container;
  }

  &__grid {
    @include xy-grid();

    // This generates gutter margins for all breakpoints so I cannot choose to have without gutters for some breakpoints
    @include xy-gutters(
      $gutter-type: margin,
      $gutter-position: right left,
      $negative: true
    );
  }

  &__cell {
    @include xy-cell($size: 4, $gutter-type: margin);

    @include breakpoint(medium) {
      @include xy-cell($size: 6, $gutter-type: none);
    }

    @include breakpoint(large) {
      @include xy-cell($size: 4, $gutter-type: margin);
    }
  }
}

1 ответ

I would use the

@include xy-cell-gutters($gutters, $gutter-type, $gutter-position, $breakpoint, $vertical);

mixin on your .cell

Set gutters to a px or rem value or Sass map;

Другие вопросы по тегам