Browse Source

fix youtube iframe style

Olivier Massot 4 months ago
parent
commit
f94e33e9fa
1 changed files with 13 additions and 2 deletions
  1. 13 2
      components/Home/Promotion.vue

+ 13 - 2
components/Home/Promotion.vue

@@ -60,7 +60,7 @@
         <iframe
           v-else
           class="screen"
-          :src="`https://www.youtube.com/embed/Gpl4gAWNc3s?autoplay=1&rel=0`"
+          :src="`https://www.youtube.com/embed/Gpl4gAWNc3s?autoplay=1&controls=1`"
           title="Vidéo corporate Opentalent"
           frameborder="0"
           allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
@@ -221,7 +221,6 @@ const playVideo: Ref<boolean> = ref(false)
     position: relative;
     width: 900px;
     max-width: 900px;
-    height: 675px;
     object-fit: cover;
     margin: 2rem auto;
     text-align: center;
@@ -230,6 +229,18 @@ const playVideo: Ref<boolean> = ref(false)
     bottom: 30rem;
   }
 
+  @media (min-width: 980px) {
+    .screen {
+      height: 675px;
+    }
+  }
+
+  @media (max-width: 980px) {
+    .screen {
+      max-width: 90%;
+    }
+  }
+
   video.screen {
     object-fit: contain;
     background: black;