如何更改 trix 文本编辑器工具栏按钮图标的字体颜色

Question

我想更改按钮图标的字体颜色。

我用 sass 尝试了以下操作：

trix-toolbar
  .trix-button
    background-color: $purple-dark-2
    color: $white

它只改变背景颜色，如下所示：

我只发现了关于如何在工具栏中添加新按钮的不同小提琴。 这两个对我来说是最有前途的：

https://codepen.io/souporserious/pen/dYZVYo?editors=100

https://jsfiddle.net/34sd91hv/

Answer 1

我发现他们使用 material 图标并且可以替换它们： https://github.com/basecamp/trix/issues/464

像这样关于你的路径的东西也可以工作：

trix-toolbar
  .trix-button--icon-bold::before
    background-image: url('../images/icon/baseline_format_bold_white_24dp.png')

代码段在 sass 中，您可以转换为 css 或 scss，甚至可以使用 .svg 文件。