-
Bug
-
Resolution: Unresolved
-
Major
-
None
-
5.0
-
MOODLE_500_STABLE
Our MoodleCloud courses contain activities that host embedded PDF files and links to YouTube videos. Since the update to Bootstrap 5 the vertical frame size for all of these embedded items has shrunk to about one-quarter of their original height. The horizontal frame size appears unchanged. Prior to the roll-out of Bootstrap 5.0 embedded YouTube videos could be viewed from within the Moodle course. After the rollout the video now appears as a small postage-stamp sized activity.
I can find no mention of any code changes required for the iframe in the migration guide to Bootstrap 5.0. Any guidance in pointing me towards code changes that I need to make or confirmation that this issue is a bug would be appreciated.
To reproduce the issue:
- Login to a MoodleCloud instance as a user with administrator privileges.
- Create a new MoodleCloud course or navigate to an existing one and switch to Edit mode.
- Add a new section to the course or navigate to an existing one.
- Add a new Text and Media Area activity to the section.
- Under the General heading go to Tools and Source Code and copy the code sample shown below and paste into the Source Code text box and save the changes.
- Prior to the rollout of Bootstrap 5 the vertical display area of the video occupied 3-4 times the height that it does now. Although the width of the enclosing iframe has apparently remained unchanged, the display area of the video now occupies the area the size of a video thumbnail.
- A similar problem has arisen with embedded PDF files. Sample code for this can be provided if required.
<!-- Start of Video box -->
|
<div class="card well" style="padding: 10px;"> |
<h4 class="text-danger"><i class="fa fa-play-circle-o"></i> La Navidad |
Española (1:39:50)</h4> |
<div class="embed-responsive embed-responsive-16by9"><iframe |
class="embed-responsive-item vjs-tech" |
src="https://www.youtube.com/embed/C7gLAt6TKQA?rel=0" |
allowfullscreen="allowfullscreen"></iframe></div> |
</div>
|
<!-- End of video box -->
|