From 97874b7e103028afb2c6bcefa12e55593748b9dd Mon Sep 17 00:00:00 2001
From: Oliver Davies <oliver@oliverdavies.uk>
Date: Sun, 27 Sep 2020 19:09:09 +0100
Subject: [PATCH] Move video embed classes

---
 src/assets/css/tailwind.css                 | 12 ------------
 src/components/recent-talks/recent-talk.vue |  9 +++++----
 2 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/src/assets/css/tailwind.css b/src/assets/css/tailwind.css
index d35d173..9af1a7e 100644
--- a/src/assets/css/tailwind.css
+++ b/src/assets/css/tailwind.css
@@ -12,16 +12,4 @@
     @apply transition-colors ease-in-out duration-300;
     @apply hover:bg-blue-550
   }
-
-  .embed-responsive {
-    @apply block relative h-0 overflow-hidden aspect-ratio-16/9
-  }
-
-  .embed-responsive .embed-responsive-item,
-  .embed-responsive iframe,
-  .embed-responsive embed,
-  .embed-responsive object,
-  .embed-responsive video {
-    @apply absolute w-full h-full inset-0 border-0
-  }
 }
diff --git a/src/components/recent-talks/recent-talk.vue b/src/components/recent-talks/recent-talk.vue
index 36bca7e..647531e 100644
--- a/src/components/recent-talks/recent-talk.vue
+++ b/src/components/recent-talks/recent-talk.vue
@@ -4,10 +4,11 @@
       {{ talk.title }}
     </div>
 
-    <div class="embed-responsive">
-      <div class="embed-responsive-item">
-        <iframe :src="`https://www.youtube.com/embed/${talk.videoId}`"/>
-      </div>
+    <div class="block relative h-0 overflow-hidden aspect-ratio-16/9">
+      <iframe
+        class="absolute w-full h-full inset-0 border-0"
+        :src="`https://www.youtube.com/embed/${talk.videoId}`"
+      />
     </div>
   </div>
 </template>