I know you're here to just fix a bug... but it's not the right direction. Having some system/about: pages being content and some chrome creates a mess. And since the new ab UI is almost completely html and custom elements, it would be wrong to keep dragging xul <menu> along. Why, in this specific case, can't you use html <select> and get rid of xul dependency completely? It can be styled to look just like the button. If you want it too look like xul with icons for checkboxes or radio (single selection), it can look like this: ``` <select> <option value="A"> <input id="a" value="A" name="radiogroup" type="radio" | type="checkbox"/> <label for="a">A</label> </option> <option value="B"> <input id="b" value="B" name="radiogroup" type="radio" | type="checkbox"/> <label for="b">B</label> </option> </select> ``` It's unclear if the widget is done but, for the record, losing the tabular pickable column sortable view of an ab's fields is a giant usability regression.
Bug 1726491 Comment 1 Edit History
Note: The actual edited comment in the bug view page will always show the original commenter’s name and original timestamp.
I know you're here to just fix a bug... but it's not the right direction. Having some system/about: pages being content and some chrome creates a mess. And since the new ab UI is almost completely html and custom elements, it would be wrong to keep dragging xul <menu> along. Why, in this specific case, can't you use html <select> and get rid of xul dependency completely? It can be styled to look just like the button. If you want it too look like xul with icons for checkboxes or radio (single selection), it can also look like this: ``` <button id="menubutton" onclick="m=document.getElementById('menulist'); m.hidden = !m.hidden;" onblur="m=document.getElementById('menulist'); m.hidden = true;">Select</button> <ul id="menulist" hidden="true" style="list-style: none;position: absolute; background-color: white;margin: 1px;padding: 4px;border: 1px solid;"> <li> <input id="a" value="A" name="radiogroup" type="radio"> <label for="a">A</label> </li> <li> <input id="b" value="B" name="radiogroup" type="radio"> <label for="b">B</label> </li> <hr> <li> <input id="c" type="checkbox"> <label for="c">C</label> </li> <li> <input id="d" type="checkbox"> <label for="d">D</label> </li> </ul> ``` Edit: example that actually works. It's unclear if the widget is done but, for the record, losing the tabular pickable column sortable view of an ab's fields is a giant usability regression.