实现筹码-自动完成输入颜色不变

Question

我正在使用materializecss gem开发Rails应用程序。

这是我的一些代码application.scss ：（我添加了颜色）

@import "materialize/components/color";  
$primary-color: color("blue-grey", "base") !default;    
$secondary-color: color("brown", "base") !default;    
@import "materialize";

标记：

<div class="input-field">
    <%= f.text_field :title %>
    <%= f.label :title %>
</div>

<div class="chips chips-autocomplete"></div>

（我确实在脚本中初始化了芯片自动完成功能）所以我有两个输入标签，但是我遇到了一些问题

div（input-field）颜色变为棕色。但是div（芯片筹码自动完成）颜色不变。（如果我选择芯片，芯片的颜色也不变）

我做错了什么？

Answer 1

[2k17，我知道，但我只是遇到了同样的问题，所以也许有人可以来这里，答案可能会有用。

您的操作正确，但是_variables.sass不会处理$primary或$secondary颜色变量。

边框和选定的芯片颜色在文件中进行了硬编码，您可以在此处查看。

https://github.com/Dogfalo/materialize/blob/v1-dev/sass/components/_variables.scss#L130

由于该库似乎已死，您可以将其分叉并替换为固定的

$chip-selected-color: #26a69a !default;

作者

$chip-selected-color: $secondary-color !default;

或者如果您不想更改实例化文件，则像这样覆盖global.css中的颜色：

.input-field .chips.focus {
  border-bottom: 1px solid #407ec9;
  box-shadow: 0 1px 0 0 #407ec9;
}
.input-field .chip:focus {
  background-color: #407ec9;
}