From 17c9752e13e31987a4cf448eefc6eddce4cc074b Mon Sep 17 00:00:00 2001
From: Jieiku
Date: Tue, 31 May 2022 04:35:20 -0700
Subject: yt/vm shortcodes use CSS, Fix unsafe-inline style-src CSP

---
 sass/include/_embedded.scss  | 11 +++++++++++
 templates/shortcodes/vm.html |  4 ++--
 templates/shortcodes/yt.html |  4 ++--
 3 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/sass/include/_embedded.scss b/sass/include/_embedded.scss
index d2d6890..fc1dd3c 100644
--- a/sass/include/_embedded.scss
+++ b/sass/include/_embedded.scss
@@ -1,4 +1,15 @@
 // Embedded content
+.yvi {//youtube and vimeo iframe
+  position: absolute;
+  top: 0;
+  left: 0
+}
+.yv {//youtube and vimeo div
+  position: relative;
+  padding-bottom: 56.25%;
+  height: 0;
+  overflow: hidden
+}
 img,
 video,
 svg {
diff --git a/templates/shortcodes/vm.html b/templates/shortcodes/vm.html
index f222682..2dd60e8 100644
--- a/templates/shortcodes/vm.html
+++ b/templates/shortcodes/vm.html
@@ -1,3 +1,3 @@
-<div{% if class %} class="{{class}}"{% endif %} style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
-	<iframe src="https://player.vimeo.com/video/{{id}}?embedded=true{% if autoplay %}&autoplay=1{% endif %}{% if loop %}&loop=1{% endif %}{% if noautopause %}&autopause=0{% endif %}{% if not cookie %}&dnt=1{% endif %}" title="{{title | default(value='Vimeo') }}" style="position:absolute;top:0;left:0;" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+<div class="yv{% if class %} {{class}}{% endif %}">
+	<iframe src="https://player.vimeo.com/video/{{id}}?embedded=true{% if autoplay %}&autoplay=1{% endif %}{% if loop %}&loop=1{% endif %}{% if noautopause %}&autopause=0{% endif %}{% if not cookie %}&dnt=1{% endif %}" title="{{title | default(value='Vimeo') }}" class="yvi" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
 </div>
diff --git a/templates/shortcodes/yt.html b/templates/shortcodes/yt.html
index 748f6ae..9fb99dd 100644
--- a/templates/shortcodes/yt.html
+++ b/templates/shortcodes/yt.html
@@ -1,3 +1,3 @@
-<div{% if class %} class="{{class}}"{% endif %} style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;">
-	<iframe src="https://www.youtube{% if not cookie %}-nocookie{% endif %}.com/embed/{{id}}{% if playlist %}?list={{playlist}}{% endif %}{% if autoplay %}?autoplay=1{% endif %}" title="{{title | default(value='Youtube') }}" style="position:absolute;top:0;left:0;" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+<div class="yv{% if class %} {{class}}{% endif %}">
+	<iframe src="https://www.youtube{% if not cookie %}-nocookie{% endif %}.com/embed/{{id}}{% if playlist %}?list={{playlist}}{% endif %}{% if autoplay %}?autoplay=1{% endif %}" title="{{title | default(value='Youtube') }}" class="yvi" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
 </div>
-- 
cgit v1.3.1