为某个文件/类的分组集设置 suzy 装订线？

Question

我知道您可以在全局范围内为 suzy 网格设置间距：

$susy: (
   columns: 12,
   gutters: 0.32,
}

你也可以为特定的 class 覆盖它：

.something {
  @include span(1 of 3);
  @include gutters(1em);
}

但是你可以覆盖某些文件的装订线吗？

如果下面的代码是我的代码的简化版本，那么使第 1 行与第 2 行具有不同间距的最短方法是什么？

<div class="container1">
    <div class="row1">
        // Something
    </div>
    <div class="row1">
        // Something
    </div>
    <div class="row1">
        <div class="container1">
            <div class="row1">
                // Something
            </div>
            <div class="row1">
                // Something
            </div>
            <div class="row1">
                // Something
            </div>
        </div>
    </div>
</div>

<div class="container2">
    <div class="row2">
        // Something
    </div>
    <div class="row2">
        // Something
    </div>
    <div class="row2">
        <div class="container2">
            <div class="row2">
                // Something
            </div>
            <div class="row2">
                // Something
            </div>
            <div class="row2">
                // Something
            </div>
        </div>
    </div>
</div>

Answer 1

您可以使用with-layout功能为任意一组内容设置特殊网格：

$susy: (gutters: 0.3);
// everything out here will use 0.3 gutters...

@include with-layout((gutters: 0.5)) {
  // everything in here will use 0.5 gutters...  
  .row2 {
    @include span(3);
  }
}

// everything out here will use 0.3 gutters again...

mixin 接受任何标准 Susy 网格图（上面使用的）或网格 shorthand 作为参数。您可以获得更多详细信息 from the docs.

为某个文件/类 的分组集设置 suzy 装订线？

Set suzy gutters for a certain file / grouped set of classes?

susy

为某个文件/类的分组集设置 suzy 装订线？