Skip to main content
Solved

How do you override icon color when going back and forth between variants?


yvonnec

Hi! I have a component that uses variants to toggle between different states. The icon color override works fine when going from Rest to Disabled.

But when going back to Rest afterwards, the icon remains grey.

The structure of the components are all the same:
image

Any ideas why this is happening?

Best answer by tank666

Have you tried the vector in union trick? How to preserve icon color override and size?

View original

4 replies

tank666
  • 4863 replies
  • Answer
  • May 28, 2021

Have you tried the vector in union trick? How to preserve icon color override and size?


pcote
  • 9 replies
  • June 16, 2021

This isn’t perfect as the icon change size upon using the Union operation.


Adam
  • 47 replies
  • June 16, 2021

Wrapping every icon you have in a union is an easy way to add unnecessary complexity and more grunt work in the future if/when this is solved a different way.


tank666
  • 4863 replies
  • June 16, 2021

Yes, Union will fit the vector, but you can wrap it in a frame. I redid my file and now it looks like this: Base-Component > Union > Icon-Component > Vector.

Yes, I agree. Therefore, I reduced all this unnecessary complexity to one component as I wrote above.


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings