UI Embedded Confirmation screen incorrect mobile screen styles

Issue Summary

Currently I'm using an embedded scheduling link. The breakpoint for mobile screen looks inconsistent

Steps to Reproduce

Open Chrome DevTools
Toggle Device Simulation
Select iPhone XR

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

I consider this a bug because the dialog should flex and cover the entire screen on mobile phones (without rounded corners!). Currently it is centered with a fixed size causing scrolling to be awkward on mobile devices. (See attached image)

Actual Results

What's happening right now that is different from what is expected

Expected Results

This is how it should look ideally.

Evidence

How was this tested? This is quite mandatory in terms of bugs. Providing evidence of your testing with screenshots or/and videos is an amazing way to prove the bug and a troubleshooting chance to find the solution.

Tested on an embedded Android Webview using react-native with expo.

@BrianUribe6

@BrianUribe6 can you please mention the steps to reach embedded scheduling link

@BrianUribe6 can you please mention the steps to reach embedded scheduling link

The scheduling links are embedded on a mobile app, so the steps to reach it are specific to my application.

This is a snippet on how I'm rendering the webview

<WebView
  startInLoadingState
  onHttpError={handleHttpError}
  renderLoading={renderLoading}
  source={{ uri: `${eventLink}/embed` }}
  showsVerticalScrollIndicator={false}
  style={styles.calendarContainer}
/>

You can reproduce the same issue by using the browser's devtools with any event link and then resizing the window to a mobile screen size.

Hi! Happy to tackle this. Up to the cal.com team if they want to actually end up merging this or not.

@CarinaWolli

Should i work on this. There was a pr that was awarded a bounty but he deleted branch before it was merged @CarinaWolli

fix: improve embedded confirmation screen mobile styles

Navigation Menu

Repository navigation

UI Embedded Confirmation screen incorrect mobile screen styles #20361

Issue Summary

Steps to Reproduce

Actual Results

Expected Results

Evidence

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

UI Embedded Confirmation screen incorrect mobile screen styles #20361

Description

Issue Summary

Steps to Reproduce

Actual Results

Expected Results

Evidence

Activity

manurana26770 commented on Mar 27, 2025

BrianUribe6 commented on Mar 27, 2025

jeffrey-zang commented on May 8, 2025

albin-baby-2002 commented on Oct 2, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions