Hello! The interactive components functionality is amazing, thank you for this!! I attended the webinar yesterday, and trying to play with hover states today. There is one thing I can’t figure out: in your example about tooltips, you get the icon to remain in the same place but the tooltip appears above it. When I try with my components, on hover, the object moves down and the tooltip “pushes” it towards the bottom right. How can I get my small component to reveal a bigger one without moving?
Question
Expand a component from the right bottom corner
The tooltip is positioned outside the frame (frame only contains the icon, including in the hover state when the tooltip is displayed). The example shown in the webinar is also in the playground file, so you can see how it was done in there if my description doesn’t clear it up for you 🙂
Hi Shane, thanks I got it, my pb was that the (x;y) coordinates were different in each frame… Thanks a lot for your help! may I ask another question, sorry if I missed that too: If I override the colour of my component in default mode, you can I tell my instance that the override is still valid on hover?
ex: my base button is blue, with a shadow on hover. In my document, I changed the colour for red. On hover I get a blue button with drop shadow. How do I tell the hover state it shall be red? Thanks and sorry if I missed the info somewhere
You need to change the color in all variants.
Hey Charlotte,
just overriding the blue in the default state should be ok; If the blue in the original hover variant is the same as the one in the default one, then we will preserve it and it should be red on hover.
Hope that helps!
— Niko
Hey Niko, thanks for your answer, actually, I ended up making an extract of my library to share with you because I cannot get it to work 😦 Figma
Really looking forward to your advice!
Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.