Merge pull request #762 from ErnstBas/733

Use CSS instead of JavaScript for responsive embed video iframes
WesternFriend · Jul 7, 2023 · 7951827 · 7951827
2 parents 48dde86 + 3b9793f
commit 7951827
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 10 deletions.
diff --git a/core/static/css/wf_website.css b/core/static/css/wf_website.css
@@ -161,3 +161,10 @@ p {
 .navbar-dark .navbar-nav .nav-link {
   color: #ffe9e5;
 }
+/* Make sure embedded videos take up full with 
+while preserving the typical aspect ratio */
+iframe {
+  aspect-ratio: 16 / 9;
+  width: 100%;
+  height: 100%;
+}
diff --git a/library/templates/library/library_item.html b/library/templates/library/library_item.html
@@ -92,13 +92,3 @@ <h1>
         {% endif %}
     </dl>
 {% endblock %}
-
-{% block extra_js %}
-    <script src="https://cdn.jsdelivr.net/npm/fitvids@2/dist/fitvids.min.js"></script>
-    <script>
-        document.addEventListener("DOMContentLoaded", function(event) {
-            // Ensure embedded videos are responsive
-            fitvids(".block-embed");
-        });
-    </script>
-{% endblock extra_js %}