Can't Tell State of Auto Scale (Firefox and Chrome on Window)

[pjcross]

The button looks grey and has a ring around the edges, even when autoscaling has been turned off. This only seems to occur when the window is the focus window. When a different window is the focus, the button is white. Unfortunately, I can't get a screen capture of it because the snippet tool pops up a little control window and changes the focus to itself.

[pjcross]

Actually, it seems that whichever of the buttons is the last one clicked stays highlighted, so by clicking on the notes button I can see the correct shade in the auto scale button. But then the notes button is highlighted instead.

[alexsielicki]

Bootstrap seems to use gray as the background color for both hover and active states, which makes it difficult to see a state change when clicking a toggle button. I changed this in CSS to remove the gray background hover state, so now gray just means active. Let me know if you still think it's confusing under windows. Testing on my VM it seems fine now.

[alexsielicki]

The dashed border around the button with focus seems to be a Windows Firefox only "feature". Chrome on Windows and Mac has a similar blue border around focused element "feature". I can work on removing these, so let me know if you want this. Right now I'm just leaving it because the new focus vs active behavior might make things clear enough.

[pjcross]

Last clicked button stays darkened on Windows on both Chrome and Firefox.