Status css :hover

alexx wrote 5 years ago: 1

Could we have a separate :hover colour for the status buttons, because the XmlHttpRequest latency combined with the CSS animation means that I can't see if the colour is from my hover or if my click has taken effect. (This is a problem because I can't always tell if the click from my mouse was registered.) Suggestions:

.tributton-watch .button.acquired:hover {background-color: #FCE07F;color: #fff;}

.tributton-watch .button.watched:hover {background-color: #63CC8A;color: #fff;}

.tributton-watch .button.skipped:hover {background-color: #C5C5C5;color: #fff;}

[Maybe add some network UI feedback with something like having the font-awesome icon for that button {display:none;} when the button is clicked and {display:block;} when the XMLHttpRequest returns from the server?]

gazza911 wrote 5 years ago: 2

@alexx To clarify, I assume that you mean you want to distinguish between when you're hovering over the icon and when it's successfully updated?

I haven't heard anyone else having issues with this, so for now I'd suggest that you use a browser extension/add-on to add this, such as Stylus (Chrome, Firefox, Opera). You can then create a style for TVmaze that allows you to do this.

alexx wrote 5 years ago: 1

I agree that its very minor but the site is already almost perfect. Separating the :hover from the .active in the css gives more flexibility for user feedback but as you pointed out, it could be limited to just me. Thank you for thinking about it.

Jan wrote 5 years ago: 2

Sure, we can make that distinction. Will add it to the list of improvements.