Make disable on site more prominent

[ablanathtanalba]

Related to #2781, #2021. Supersedes #2660.

This makes some more cosmetic changes to the popup to make the disable and enable buttons more prominent.

• adds a colored "power" icon to make it more visually clear what the button does
• simplifies the language on the button by removing "Privacy Badger" from the message (it's obvious that the control is for Privacy Badger)
• changes the disable and enable buttons to be stacked at 100% width with the other two buttons below sharing a single row.

[ablanathtanalba]

Thanks for these tweaks!

I'm definitely in favor of simplifying the report button message as well. That's a keeper.

I'm on the fence about the rounded corners for the buttons. On the one hand, it does kinda fall in line with how many other web things style their buttons, so it appeals to that sense of familiarity with people. On the other hand, the curve radius on the button is just different enough from the highlighted blocked resources outlines that it's noticeable and kind of bothersome.

example screenshot

I'm not in favor of the drop shadow on the power button, however. I think it's a little visually confusing when you see it, since it's the only thing in the popup that would have that kind of lifted dimension.

[ablanathtanalba]

What if the button class styling didn't change much, but we emphasized the power button icon a bit more?

[ghostwords]

Latest revision: