CenturyLinkCloud / Cyclops

The UX/UI Pattern Guide for the CenturyLink Platform
http://assets.ctl.io/cyclops
MIT License
20 stars 16 forks source link

Button with class disabled still has hover styles applied #130

Closed guyaparker closed 7 years ago

guyaparker commented 7 years ago

Updates for #124 / #125 are working but still need to restore additional rules.

There is still a hover class applied to a button element with class disabled which makes it look like something will happen when the button is clicked because the background color and the svg icon fill both change.

In DCC UI we will add an over ride to prevent this but would be good if this could roll into a future update: html.cyclops .action-toolbar > li a.disabled:hover, html.cyclops .action-toolbar-left > li a.disabled:hover, html.cyclops .action-toolbar-right > li a.disabled:hover, html.cyclops .action-toolbar > li button.disabled:hover, html.cyclops .action-toolbar-left > li button.disabled:hover, html.cyclops .action-toolbar-right > li button.disabled:hover { background: transparent; } html.cyclops .action-toolbar > li a.disabled:hover svg.cyclops-icon, html.cyclops .action-toolbar-left > li a.disabled:hover svg.cyclops-icon, html.cyclops .action-toolbar-right > li a.disabled:hover svg.cyclops-icon, html.cyclops .action-toolbar > li button.disabled:hover svg.cyclops-icon, html.cyclops .action-toolbar-left > li button.disabled:hover svg.cyclops-icon, html.cyclops .action-toolbar-right > li button.disabled:hover svg.cyclops-icon { fill: #b9b9b9; }

Using standard style (stop is disabled): screen shot 2017-03-21 at 14 06 14

Using DCC UI over ride style (stop is disabled): screen shot 2017-03-21 at 14 12 32

pascualin commented 7 years ago

I'm looking into this one

pascualin commented 7 years ago

Will be fixed on the next release with #132