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

Question

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

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

我搜索了一些关于这个的东西，并找到了 browser_action支持 theme_icons但是 page_action不是。

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



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

Answer 1

经过更多的谷歌搜索，我发现这是通过添加 fill="context-fill" fill-opacity="context-fill-opacity" 的截图插件来实现的。在 <svg>标签，并使用 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 - Support fill="context-fill" for mozilla-signed WebExtension icons