Hello, I am trying to get started with PenPot to switch from Figma to PenPot.
But I am stuck on this case.
I want this button to follow these steps:
For each state, it changes color.
I created the small component, then I go to Prototype, and honestly, I don’t understand what I should do.
I am attaching an image of what I want.
Bonjour Ali,
Currently you can’t set such states in Penpot when prototyping. You can change the appearance of an element when hovering it (playing with the “mouse enters” and “mouse leaves” options combined with an overlay), but you can’t make the prototype remember visited states or focused states.
Alright, I found it.
You need to apply the three actions to the component.
For Link, Trigger 01 = Mouse Enter. Action = Open overlay = destination = Hover. (the file it should play).
For Link, Trigger 02 = Mouse Leave. Action = Close overlay = destination = Hover. (the file it should play).
For Link, Trigger 03 = On Click. Action = Activate / deactivate = destination = Active. (the file it should play).
I’m not sure about Trigger 03.
Thanks.
