使用SASS的多个主题

我有一个SASS构建的站点，我想为该站点创建第二个颜色选项，使SASS代码尽可能保持干燥

以下是我的一个想法，它在一定程度上起到了作用（为了清楚起见，我在这里）：

// regular theme (black)
@import "settings";
@import "styles";

// white theme
.white {
    @import "white_settings";
    @import "styles";
}

上述工作适用于简单的<代码>类样式。SCSS文件，但是当我尝试使用与基金会<代码> @导入“基础”< /C> >相同的方法时，它只封装了包含在基础中的一些样式。

所以我的问题是，有没有办法通过包装类（将设置在body标签上）来扩展我已经拥有的样式，这样我就可以轻松地切换站点的颜色主题，而无需重复整个SASS规则集合

---

最佳解决方案也不会重复未更改的CSS属性，如边距和填充，只会更改颜色（这是唯一不同的部分，并且在设置中设置）。

Foundation将其所有样式包装在一个mixin中，以防止重复（即导入一次）。这会阻止您使用不同的颜色或其他设置重用代码。查看有问题的mixin的源代码，您应该能够诱使它认为“模块”没有像这样导入：

// the modules we want to import haven't been imported yet
$temp-modules: $modules;
.one {
    // do some one specific stuff here
    @import "styles";
}
// set $modules back to the state it was in before we did our import
$modules: $temp-modules;
.two {
    // do some two specific stuff here
    @import "styles";
}
// repeat as necessary

---

有很多选择：，或者@cimmanon，我已经对我的帖子进行了编辑。基本上，它适用于简单的样式，但是当尝试使用Foundation时，它不包括所有需要的样式，我不知道为什么。如果我正确地理解了您的问题，基金会不会让您这样做，因为它实现了它自己的JAKY“包含一次”包装器围绕它的所有样式（参见Mixin定义这里：）。你可能可以通过播放它所依赖的变量（

$modules

）来回避它。是的，我在深入研究后发现了这一点。我想我可以删除它，只需确保所有模块都以正确的顺序包含。@cimmanon如果你想写一个关于这一点的正确答案，我会将其标记为已接受。谢谢，我会尝试一下这种方法。