编译成 CSS 时如何覆盖 SCSS 变量

Question

我正在尝试使用基于 SASS 和 COMPASS 的 jqtouch 主题。我有一个文件 custom.scss，其中包含最简单的代码、一个导入和一个要覆盖的变量：

@import 'jqtouch';

// Override variables
$base-color: #fe892a;/* The default base which is later used for toolbar, list, and button backgrounds.*/

当我现在将 scss 文件编译为 css 时，它基本上只会使用我的文件名生成 jqtouch css。尽管变量在每个文档 (Official Guide) 和 jqtouch.scss 文件中都是正确的，但颜色规范无处可见，我导入该文件以进行定制。

我在 Windows 机器上运行 Sass 3.2.9 和 Compass 0.12.2。

我已经尝试过使用更多变量和不同的文件导入，但结果总是，我的覆盖值没有被合并。

compass 的 ruby​​ 配置文件似乎并不可疑。

有没有人知道这个过程中出了什么问题，所以我的覆盖值被忽略了？

Answer 1

您正在设置颜色它已经被使用过。基本上，您要做的是：

$color: red;

.foo {
    background: $color;
}

$color: green;

根据 jqtouch 的编写方式，您可能根本无法修改颜色。您需要将变量设置为默认值，以便提前覆盖它们：

$color: green;
$color: red !default; // red is only used if $color is not already set

.foo {
    background: $color; // color is green
}

所以你的代码应该这样写：

// Override variables
$base-color: #fe892a;/* The default base which is later used for toolbar, list, and button backgrounds.*/

@import 'jqtouch';