Animation Trigger Working on One Element but Not the Other

Hello,

I made an interaction that toggles a mobile menu that slides in from the right on click/tap. I have it applied to two elements; 1) a “Close Menu” button (div that’s a toggle) and 2) a “Page Overlay” that closes the menu when clicking outside the menu container.

It was working perfectly until I made the nav div a component and it removed my interactions, and upon reapplying the interaction to both aforementioned elements, the close menu interaction only works properly when clicking the page overlay, but not the close menu toggle. Again, I’m reusing the same interaction and it was working, but now it isn’t.

I remade the interactions exactly the same as the initial attempt which worked and still to no avail, I cannot get it to work properly again.


Here is my public share link: https://preview.webflow.com/preview/whitetailcrossinggolfcourse?utm_source=whitetailcrossinggolfcourse&preview=955e8c0b671fd1b30a332d632875a707&mode=preview