fix: iframe issue for atoms documentation

[Ryukemeister]

What does this PR do?

• The iframe for loom videos always used to overflow the div, causing the container and screen to break for mobile devices. The reason was that we had a property for the iframe width="560", this was causing the width to be 560px always irrespective of the screen size.
• To fix this, I changed the css styles to add a max-width instead of a fixed width

Mandatory Tasks (DO NOT REMOVE)

• I have self-reviewed the code (A decent size PR without self-review might be rejected).
• I have updated the developer docs in /docs if this PR makes changes that would require a documentation change. If N/A, write N/A here and check the checkbox.
• I confirm automated tests are in place that prove my fix is effective or that my feature works.

How should this be tested?

This can be tested in the docs folder; cd into docs and run mintlify dev

[vercel]

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

2 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
cal	⬜️ Ignored (Inspect)	Visit Preview		Nov 11, 2024 7:24am
calcom-web-canary	⬜️ Ignored (Inspect)	Visit Preview		Nov 11, 2024 7:24am

[graphite-app]

Graphite Automations

"Add platform team as reviewer" took an action on this PR • (11/11/24)

1 reviewer was added to this PR based on Keith Williams's automation.

"Add ready-for-e2e label" took an action on this PR • (11/11/24)

1 label was added to this PR based on Keith Williams's automation.

[github-actions]

E2E results are ready!

• Workflow #37461.1 latest results