fix: Disabled pinch to zoom on mobile devices#9155

[Gohan-18]

What does this PR do?

Disables pinch to zoom in mobile devices

Fixes #9155 (issue)

Environment: Staging(main branch) / Production

Type of change

#- Bug fix (non-breaking change which fixes an issue)
#- Chore (refactoring code, technical debt, workflow improvements)

• New feature (non-breaking change which adds functionality)
  #- Breaking change (fix or feature that would cause existing functionality to not work as expected)
  #- This change requires a documentation update

How should this be tested?

• Test A
• Test B

Checklist

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
cal	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 6, 2023 5:36pm
ui	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 6, 2023 5:36pm

[vercel]

@Gohan-18 is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

📦 Next.js Bundle Analysis for @calcom/web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌

[sean-brydon]

@PeerRich what is the reason for this? Its generally recommended to avoid disabling pinch to zoom as its not the best thing to do for a11y.

[PeerRich]

@sean-brydon zooming on mobile apps looks weird and breaks the pwa experience. i dont mind keeping it, just looks weird. visit the mobile page and pinch to zoom, looks odd

[sean-brydon]

@sean-brydon zooming on mobile apps looks weird and breaks the pwa experience. i dont mind keeping it, just looks weird. visit the mobile page and pinch to zoom, looks odd

I have no objections - i think we do a pretty good job with a11y on mobile anyway. Will approve but if something comes up we should re-consider our approach to this

[PeerRich]

@Gohan-18 isnt

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

better?

[Gohan-18]

Yeah... That's good too. Let me just modify the code. Thanks.

[Gohan-18]

Hey @PeerRich , one small help. Couldn't actually locate the file where to add the tag that works throughout app. Tried in both the theme.config.js and index.html, but doesn't seems to work. Can you please just help in locating the file. Thanks.

[PeerRich]

<meta> should be in _document.tsx line 51

[Gohan-18]

<meta> should be in _document.tsx line 51

Just updated. Thanks again for being so patience and helpful.🙏