Good-Production/triumf-landing
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: added dinamic addition of videos to dom

Browse Source
This commit is contained in:
Aliaksei Karzhou
2024-07-16 23:38:53 +03:00
parent e51337ed63
commit 2f3396d8b3
4 changed files with 21 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/index.css
View File

@@ -1313,7 +1313,7 @@ h3 {
margin: 0 0 15px;
overflow: hidden;
border-radius: 10px 40px;
background-color: #609eff;
background-color: #4d4d4d;
}
@media (max-width: 992px) {
.reviews__slide-video {

13
assets/js/reviews.js
View File

@@ -7,8 +7,21 @@ reviewsSlideVideos.forEach((videoEl) => {
reviewsSlideVideos.forEach((video) => {
if (video === event.currentTarget) {
video.classList.add('active');
video.innerHTML = `
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
`;
} else {
video.classList.remove('active');
video.innerHTML = '';
}
});
});

2
assets/scss/_l-reviews.scss
View File

@@ -36,7 +36,7 @@
margin: 0 0 15px;
overflow: hidden;
border-radius: 10px 40px;
background-color: $blue;
background-color: $darkgrey;
@include laptop {
height: 160px;

76
index.html
View File

@@ -337,16 +337,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -359,16 +350,6 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -381,16 +362,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -403,16 +375,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -425,16 +388,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -447,16 +401,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">
@@ -469,16 +414,7 @@
<div class="swiper-slide">
<div class="reviews__slide">
<div class="reviews__slide-video">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/XIMLoLxmTDw?si=wFzm5etjCkaNdMl5"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen
></iframe>
</div>
<div class="reviews__slide-name">Иван, 27 лет</div>
<div class="reviews__slide-text">