覆盖基础设置在中间人中不起作用

Overriding Foundation settings not working in Middleman

我在 Middleman 做我的网站(静态 Ruby 网站生成器)

我已经安装并运行了 Foundation。然后在我的 styleshhets 文件夹中有一个 _settings 文件,我应该在其中覆盖基金会的设置。

但不知何故它不起作用...

我的结构是这样的:

web
 source
  bower_components
   foundation
    components
     _settings.scss
   ...
  images
  javascript
  layouts
  stylesheets
   ...
   _settings.scss
   ...

然后在 stlesheets 文件夹的 _settings.scss 中,我想将正文字体颜色覆盖为红色,如下所示:

// We use these to control various global styles
// $body-bg: $white;

 $body-font-color: red;

但是没有生效。

Config.rb:

# Change Compass configuration
 compass_config do |config|
  config.output_style = :compact
  config.add_import_path "bower_components/foundation/scss"
  config.http_path = "/"
  config.css_dir = "stylesheets"
  config.sass_dir = "stylesheets"
  config.images_dir = "images"
  config.javascripts_dir = "javascripts"
 end

 after_configuration do
  @bower_config = JSON.parse(IO.read("#{root}/.bowerrc"))
  sprockets.append_path File.join "#{root}", @bower_config["directory"]
end

有什么想法可以通过样式表文件夹中的 _settings.scss 覆盖基础样式吗?

如果您需要查看整个结构,这是我在 github 上的网站:

https://github.com/GiorgioMartini/Giorgio-Web

只要在 foundation.scss 之前导入 _settings.scss 它就应该可以工作。

您的 config.rb 是正确的。但是,需要注意的一件事是行

@import 'foundation';

与行

的处理方式不同
@import 'foundation.scss';

Compass会先查看bower_components/foundation路径下是否有foundation.scss文件。既然有,就用那个。此外,由于所有 SASS 变量都已在 foundation.css 中解析,因此预先导入 _settings.scss 不会更改默认样式。相反,请确保 app.scss 文件的顶部如下所示:

@import 'foundation.scss';
@import 'settings';

因为 bower_components/foundation/_settings.scss 默认完全注释掉,所以不会破坏新样式。