Skip to content

Fix: The demo video is the wrong size in docs #13187

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
+2 −0
Open

Fix: The demo video is the wrong size in docs #13187

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions contents/docs/product-analytics/dashboards.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ export const dashboardfiltersDark = "https://res.cloudinary.com/dmukukwp6/video/
<iframe
src="https://www.youtube-nocookie.com/embed/2jQco8hEvTI?start=441"
className="rounded shadow-xl"
width="600"
height="337"
Comment on lines +24 to +25
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

style: hardcoded dimensions make the video non-responsive on smaller screens - other YouTube iframes in the docs don't use explicit dimensions (see retention.mdx:11-14, funnels.mdx:46-49, trends/overview.mdx:47-50)

Prompt To Fix With AI 
This is a comment left during a code review.
Path: contents/docs/product-analytics/dashboards.mdx
Line: 24:25

Comment:
**style:** hardcoded dimensions make the video non-responsive on smaller screens - other YouTube iframes in the docs don't use explicit dimensions (see retention.mdx:11-14, funnels.mdx:46-49, trends/overview.mdx:47-50)

How can I resolve this? If you propose a fix, please make it concise.

Comment on lines 23 to +25
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd use tailwind classes for full width and 16:9 aspect ratio, so the video resizes for mobile

The mt-4 is just for spacing (the table of contents and video player touch rn on mobile)

Suggested change
className="rounded shadow-xl"
width="600"
height="337"
className="rounded shadow-xl mt-4 w-full aspect-video"

/>

Dashboards are the easiest way to track all your most important product and performance metrics.
Expand Down