Skip to main content
Question

Nested component reverts to default within parent component


Christian_Rodriguez2

Hi guys, I have a lot of different icons I want to use in different types of buttons and icon buttons. Each with their own color and hover effects.

The issue: Changed icons revert back to default icon on hover state of parent button. I want the icon component that is inside the button to carry over the same icon through each animation state (hover, pressed).

  1. I made each icon into a component, then created a black, blue, and white version.

  2. I nested these icons into icon buttons and normal buttons. These buttons are now their own components with the icons (which are also components) inside of them.
    Screenshot 2023-04-27 115625

  3. I then take these buttons and change out the icons to the ones I need.

  4. When I prototype these buttons, I hover over the icon button inside and it reverts back to its default pencil icon.

Any ideas?

This topic has been closed for replies.

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