Adjust Monkey Menu to look and behave like native FF

[Sxderp]

Overhaul the styling to much more closely mimic FF 57 + menu / panel design. Also includes a similar transition effect as seen in native FF menus.

[Sxderp]

It should also be noted that sub text can be easily applied to a menu item. To denote shortcuts (should the be implemented) or other information. This can be done by adding an after="text" attribute to the <a> tag.

For example adjusting the homepage link to:

<a href="#https://www.greasemonkey.net/" class="subview-item" after="CTRL+Sample">

Produces the following.

[esperecyan]

If the menu needs original attributes, you can use data-* attributes such as data-after="CTRL+Sample".

However, I think that making it possible to also write aria-keyshortcuts attributes will be more meaningful if the value is a keyboard shortcut such as the example.

[Sxderp]

If the menu needs original attributes

The reason I used the "after" is that it's the exact same method used in FF menus. I could change it if you think it's better to do something else.

[esperecyan]

I see. In that case, I suggest “aria-keyshortcuts” for now. After this, how about adding CSS which corresponds to a proper attribute as needed?

[Sxderp]

Disregarding the point that the chrome:// URIs don't exist in FF 52 ESR (easily fixed), that version doesn't render .svg files correctly. Open FF 52 ESR and go to the photo design page. Many of the .svg files don't render. I suppose I could change the chevrons into .png or something.

[Sxderp]

I believe I figured out the rendering issue. It has to due with a special fill flag set in the .svg that informs the browser to look in CSS to determine the path fill rather than specifying it in the path itself. FF 52 does not support this flag. Updated, the icons should render properly now.

[arantius]

Overall I like this except it's stretching the user scripts' icons.

[Sxderp]

stretching the user scripts' icons.

Oh, didn't really notice. Although, on closer inspection I'd suggest to keep the 'wider' icons. I feel they look better as they 'fill out' the icon area.

I'll look into updating and posting comparisons.

[Sxderp]

And by 'keep', I mean replace the current default icon that's bundled with GM. The stretching will still be fixed so that scripts that provide their own icons won't be stretched.

[arantius]

If you've got good art I'll happily review it, but for now I care about maintaining aspect ratio, and have found a good way to do so.

[Sxderp]

I grabbed the latest. I noticed you removed the font size from the icons. Did you want to use the smaller icons? I set the size so that they'd be more comparable to FF icons, and the larger size cleans up / sharpens the details in most of the icons.

[arantius]

Inadvertent; fixed.