Theo's Typesafe Cult•3y ago

Conditionally change color of icon

Hey so I want to change a color of icon when clicked and it is inside state array I created. Currently I have something like this.

<FontAwesomeIcon
            icon={faStar}
            key={coin.id}
            className={

hover:text-yellow-500

}
            role={

button

}
            onClick={() => setFavorite([
          ...favorite,
          { id: coin.id }
        ])}
          />

and my state const [favorite, setFavorite] = useState([]) I add the elements to array correctly, but don't know how to style it now if the equivalent id is inside array... for example something like this className={insideFavorites ? text-green-500' : 'text-yellow-500'} Is this even possible my way?

2 Replies

Anna | DevMiner•3y ago

yes, that should be possible btw, if you want to make a code block in discord with syntax highlighting, use ```ts const F = () => <div></div>; ``` which results in this

const F = () => <div></div>;

const F = () => <div></div>;

noctate•3y ago

@TheDevMinerTV thx 😄

Gaming

Programming

Conditionally change color of icon