Interactive Components (icons) Color Change on hover - not working properly

Interactive Components Bugs
1

I have this problem where my icons are not updating/reverting properly after a hover state.
In the case below, I obviously want the hover icon to be the “+” and the idle icon to be whatever it is before the hover.

However, after hovering, the icon reverts to whatever it was before.

I’m not sure if the problem is related to me nesting the components in the wrong order or if this is in fact a bug.

Please refer to the video below for an example

2

The problem is probably that you are using icons as variants. Try using icons as separate components.

3

But how would I make it flexible to exchange the icons without leaving dozens of components compared to 1 with variants?

4

Unfortunately, I don’t see any flexibility or other benefits for icons as Variants.

Also:

5

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.