无法覆盖变量 - 将Zurb-Foundation添加到Spree

Question

我试图在Zurb基金会框架的帮助下重写我们商店的前端，遗憾的是，我遇到了很多问题。

我在我的gemfile中包含了'zurb-foundation'gem ，并将以下内容添加到assets / store目录中的all.js和all.css中

资产/样式表/存储/ all.css

*= require foundation
@import 'foundation';

资产/ Java脚本/存储/ all.js

//= require foundation
(document).foundation();

到目前为止，我可以使用zurb文档中描述的类 - 此外，框架中包含的不同项目运行良好（Topbar，Orbit等）

可悲的是我遇到了这个问题，我无法覆盖变量。 我在stylesheets / store目录中创建了一个文件'custom_variables.css.scss'来处理那些 - 但是如果我在那里覆盖它们，它们似乎没有生效。

Answer 1

不确定为什么这不包含在Rails版本中。 您可以添加Compass自动创建的名为_settings.scss

您可以从github下载该文件：

settings.scss的Github文件

并将其放在您的app/assets/stylesheets

然后将下面的行添加到您的foundation_and_overrides.scss上述@import 'foundation';

@import'settings';

它现在应该是这样的：

// Settings file to override Foundation variables

// You can find the variables for each component at the bottom of their
// doc page. We tried to name them to where they'd make sense just by reading them.
// Go to http://foundation.zurb.com/docs/ to find what you need.

@import 'settings'
@import 'foundation';

现在您可以取消注释您想要更改的内容，而不是尝试覆盖样式。 这是默认使用Compass的方式。 我认为关键是在@import 'foundation';之前改变sass变量@import 'foundation'; 叫做。 否则，您只需在写完基础的所有css之后更改变量。

这对我使用Foundation 4.0.8很有用。