Add tooltip to inactive layers

[mmcfarland]

Overview

Adds a tooltip to deactivated layers in the layer picker and also makes active and inactive layers a shade darker.

Connects #1797
Connects #1581
Connects #1725

Demo

Staging

The Branch

Notes

I got sign off from @jfrankl in #1725, but please comment on the outcome.

Testing Instructions

• After bundling, pan the map far to the Atlantic which will disable the Delaware stream layer title.
• Ensure that hovering displays the tooltip
• Ensure that hovering over active layers does not show a tooltip
• The styles should be darker and more legible.

[ajrobbins]

In both staging and your branch screenshot above, I find the contrast between active/inactive to be a bit hard to distinguish. Can we make the active layer names darker (or fully black)?

[mmcfarland]

Can we make the active layer names darker (or fully black)?

I did make them a shade darker, but I suspect @jfrankl wouldn't want full black. Jeff, what do you think about reusing #273238 (header shade)?

[caseycesari]

I agree with @ajrobbins. This is an improvement, but it's now a little harder to tell the difference between active and inactive. Maybe we need the 👁️ and 🚫 👁 ?

[jfrankl]

Reusing #273238 sounds good.

…

On Wed, Jul 19, 2017 at 1:18 PM, Casey Cesari ***@***.***> wrote: I agree with @ajrobbins <https://github.com/ajrobbins>. This is an improvement, but it's now a little harder to tell the difference between active and inactive. Maybe we need the 👁 and 🚫 👁 ? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#2055 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABud9Po7763e3iXfMKWpu_dWxSo3G-UWks5sPjpPgaJpZM4Ob8K0> .

-- Jeff Frankl, User Experience Designer Azavea | 990 Spring Garden Street, 5th Floor, Philadelphia, PA Web azavea.com | Blog azavea.com/blogs | Twitter @azavea <http://twitter.com>

[mmcfarland]

Updated with ui-primary. Such contrast:

[caseycesari]

Looks good to me. It's much more legible, and easier to differentiate between active and inactive layers.