Firefox 选择深色/浅色主题的页面操作图标

Question

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

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

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

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

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

Answer 1

经过更多的谷歌搜索，我发现这是通过添加标签并使用 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 了解更多详细信息：

• Bug 1377302 - 支持 mozilla 签名的 WebExtension 图标的 fill="context-fill"