5

我正在写一个在 Firefox 上工作的网络扩展。我希望我的图标的工作方式类似于“截屏”中内置的 Firefox 的行为。当它以浅色主题/深色主题/在菜单中显示时，屏幕截图图标以不同的颜色出现。

我刚刚page_action在清单中添加了一个，并为它设置了一个图标。黑色图标在浅色主题上看起来不错，但在深色主题上变得难以使用。如果浏览器处于深色主题中，我想显示图标的浅色版本（并且还保持菜单中的图标为黑色）。

我已经搜索了一些有关此的内容，并找到了browser_action支持theme_icons，但page_action没有。

为页面操作图标的不同用例设置不同图标的最佳实践是什么？

在此处输入图像描述

为不同主题配置不同图标颜色的最佳方法是什么？

4

2 回答 2

3

经过更多的谷歌搜索，我发现这是通过添加标签和使用svg作为图标fill="context-fill" fill-opacity="context-fill-opacity"的截图插件实现的。<svg>

<?xml version="1.0" encoding="UTF-8"?>
<svg width="128px" height="128px" version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="context-fill" fill-opacity="context-fill-opacity">
  <path d="m0 0 H 16 V 16 H 0 Z"/>
</svg>

但不幸的是，此功能仅在 Mozilla 签名的扩展上默认启用。所以这不适用于用户定义的扩展。

查看 bugzilla 了解更多详情：

于 2018-02-01T02:06:30.273 回答
2

根据Bug 1377302，context-fill不起作用，因为svg.context-properties.content.enabled默认情况下未启用。相同的页面说它已在 Firefox 55 中修复，但我使用的是 60，但仍未修复。

所以，现在，我仍然context-fill希望在不久的将来，用户会看到与其他图标颜色相同的图标。

于 2018-06-09T10:47:55.903 回答