calcom / cal.com

Scheduling infrastructure for absolutely everyone.
https://cal.com
Other
32.34k stars 7.97k forks source link

Embed in Webflow - Embeds hidden when more than one are on the page #16640

Open oskar-thomasduthie opened 1 month ago

oskar-thomasduthie commented 1 month ago

Found a bug? Please fill out the sections below. 👍

Issue Summary

I'm trying to add two calendar inline embeds on my webflow home page.

The first one is a popup that appears when I click a button. Using Webflow interactions it changes display none to block and shows a div with the inline embed.

The second inline embed is shown at all times and is wrapped in a differently named div.

The first embed added onto the page always works properly, the second one doesn't work.

Steps to Reproduce

Create div called page-wrap. Make it position relative.

Create div called btn wrap with 100px width, 44px height.

Create a parent div called cal-wrap. Give 100vh 100vw and display flex center. Add "embed" block and paste inline embed code from Cal.

Create a parent div called cal-pop-up. Create a div inside called pop-up-wrap. Give it 100vh 100vw and position absolute full and display flex center. Add "embed" block and paste inline embed code from Cal. Make cal-pop-up display none. Create interaction on btn-wrap on click. Set initial state of cal-pop-up to display none. The second state should be display block with duration of .3 seconds.

Create on second click animation which sets display of cal-pop-up to display none.

Publish site.

You will not see the popup embed when you click to open it. If you remove the cal-wrap embed you will see the popup embed on open.

Any other relevant information. For example, why do you consider this a bug and what did you expect to happen instead?

I expect to see two embeds. One always at the bottom of the page and one when I open the popup.

Technical details

Chrome: Version 128.0.6613.138 (Official Build) (x86_64)

Evidence

(https://www.loom.com/share/727aa2c785ee4afc98f6696c0727b4a4?sid=78db7e68-69be-4ad1-9e47-d874bb516e04)