Skip to content
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

Embedded the CV overview video in introduction documentation #358

Merged
merged 2 commits into from
Jan 4, 2024
Merged

Embedded the CV overview video in introduction documentation #358

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f4dc395
embedded the CV overview video in introduction
Murdock9803 Dec 9, 2023
a799d16
applied the suggested changes to enhance aspect ratio
Murdock9803 Dec 24, 2023
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
4 changes: 3 additions & 1 deletion docs/chapter1/1introduction.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,4 +22,6 @@ As the CircuitVerse community grows, educators and students can join the online

Watch the below video for a quick demonstration of the CircuitVerse platform.

[CV Marketing Video]
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;">
Copy link
Member

Choose a reason for hiding this comment

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

Change it to <div>

Copy link
Contributor Author

@Murdock9803 Murdock9803 Dec 10, 2023 •
edited
Loading

Choose a reason for hiding this comment

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

Sure @Prerna-0202 ma'am, The styling in the div was to make it look responsive maintaining youtube's aspect ratio 16:9

Actually when I removed all the styling and just converted it to <div> in line 25, The CV video filled all of the page because of position: absolute in line 26.
By removing all that position from line 26 too, The aspect ratio became poor. Below is the accompanying image.


Screenshot 2023-12-10 222845

Should I let it be like this or specify some different height and width? at present both height and width are 100%.
Thanks for the help.

Copy link
Member

Choose a reason for hiding this comment

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

Have you tried applying both of the suggested changes I mentioned? Even after applying both suggestions, is the aspect ratio still not correct?

<iframe style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;" src="https://www.youtube.com/embed/3Df-2Cn_80A" frameborder="0" allowfullscreen></iframe>
Copy link
Member

Choose a reason for hiding this comment

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

Also I think that if we write it like this instead of using inline styling, it will be better.<iframe width="500px" height="400px" src="https://www.youtube.com/embed/3Df-2Cn_80A" frameborder="0" scrolling="no" webkitAllowFullScreen mozAllowFullScreen allowFullScreen></iframe>

</div>
Loading