Hi, I’m having an issues editing the hover state of a selector on an element that has additional unique classes applied to it.
As an example, if I have a button that has a class button-cta, but iwant to edit the hover state of all Buttons, when i select just the Button from the selector dropdown, then select “hover” from the “states” dropdown, it switches to “Button, button-cta, Hover”, instead just “Button, Hover”.
Example:
Do I need to remove classes or find a normal link to edit the generic class states?
Yes, that happens, and sometimes other “unaccessible” classes happen too.
There’s a very easy workaround:
Create a dummy element (a div) and give it just the class you want to target. from there, edit the states then delete your dummy.
This technique works also for targeting an element in an interaction, that has already several classe. Say you have a div getting .square and .triangle classes. You can’t anymore target it in interactions because it won’t show up in the list, having more than one class. Create your dummy and give it the class you target. target the object in the interaction and then delete your dummy. Works great.
At the moment, assigning hover state to generic class selector is not supported. First assign a class name to an element, and then you can adjust it’s hover state etc. Cheers, Dave
