How do I create native looking popups in a web extension for Firefox?

馋奶兔 提交于 2021-02-08 03:39:58

问题


I want a native looking popup (menu) in a Firefox web extension. Example:

example


What I have now

Irrelevant parts omitted

manifest.json:

"browser_action": {
  "browser_style": true,  // injects chrome://browser/content/extension.css
  "default_popup": "popup.html"
}

popup.html:

<div class="panel">
    <div class="panel-list">
        <div class="panel-list-item">
            Item 1
        </div>
        <div class="panel-list-item">
            Item 2
        </div>
        <div class="panel-list-item-separator"></div>
        <div class="panel-list-item">
            Item 3
        </div>
    </div>
</div>

This sort of looks like a native menu, but it's not perfect: Menu item hover states have a border and I don't know what html and class names are required for creating a menu item with an icon.

Question

How do I get the result of the example image above without writing my own CSS?

来源:https://stackoverflow.com/questions/47485053/how-do-i-create-native-looking-popups-in-a-web-extension-for-firefox

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!