Fluid-size youtube video embeds
This commit is contained in:
parent
c7363bcce2
commit
f13cf58294
9 changed files with 22 additions and 4 deletions
|
@ -8,12 +8,15 @@ let notes = document.querySelectorAll('.e-content');
|
|||
for (let note of notes) {
|
||||
let ytid = note.textContent.match(youtubeRegex);
|
||||
if (ytid) {
|
||||
let ytcontainer = document.createElement('div');
|
||||
ytcontainer.classList.add('container');
|
||||
let ytiframe = document.createElement('iframe');
|
||||
ytiframe.classList.add('youtube');
|
||||
ytiframe.setAttribute('src', 'https://www.youtube.com/embed/' + ytid[1]);
|
||||
ytiframe.setAttribute('frameborder', 0);
|
||||
ytiframe.setAttribute('allowfullscreen', 'true');
|
||||
note.appendChild(ytiframe);
|
||||
ytcontainer.appendChild(ytiframe)
|
||||
note.appendChild(ytcontainer);
|
||||
}
|
||||
let spotifyid = note.textContent.match(spotifyRegex);
|
||||
if (spotifyid) {
|
||||
|
|
15
resources/assets/sass/layout.scss
vendored
15
resources/assets/sass/layout.scss
vendored
|
@ -69,3 +69,18 @@ footer button {
|
|||
margin-top: 0.5em;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
padding-bottom: 56.25%;
|
||||
}
|
||||
|
||||
.youtube {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue