Gray out zoom buttons at maxZoom/minZoom

[andycalder]

This is a simple UI enhancement. When the map is at maxZoom, the NavigationControl looks like this:

And likewise at minZoom:

This is standard behaviour for zoom controls in many applications. I was going to implement my own buttons because I wanted this functionality, but then I thought "why not just add it to the library?"

Launch Checklist

• briefly describe the changes in this PR
• write tests for all new functionality (NavigationControl has no unit tests. Should it?)
• manually test the debug page
• fix flickering issue on Safari/Firefox

On Safari and Firefox there is an almost imperceptible flicker when the background-image changes. The geolocate icon has the same problem. Chrome seems to render perfectly. I haven't tested IE/Edge. Does anyone have any advice on the best way to fix this?

[mourner]

Could we avoid duplicating the icon SVGs by doing some CSS magic instead? E.g. some semitransparent white overlay with :after?

[ryanhamley]

A CSS blend mode could be helpful

[andycalder]

Thanks for the suggestions. I managed to get it working using opacity, which fixes the flickering issue and avoids duplicating SVGs.