From dc7b297141bd0b038dc0afed66ae6affdf9bcf33 Mon Sep 17 00:00:00 2001
From: Adrien Beudin <beudbeud@beudibox.fr>
Date: Wed, 3 May 2017 18:49:55 +0200
Subject: [PATCH] youtube on light theme

---
 .../themes/light/static/css/style-page.css    | 22 +++++++++++++++++++
 .../light/templates/sections/youtube.html     |  5 +++++
 2 files changed, 27 insertions(+)
 create mode 100644 prosopopee/themes/light/templates/sections/youtube.html

diff --git a/prosopopee/themes/light/static/css/style-page.css b/prosopopee/themes/light/static/css/style-page.css
index e7386db..3e18936 100644
--- a/prosopopee/themes/light/static/css/style-page.css
+++ b/prosopopee/themes/light/static/css/style-page.css
@@ -230,3 +230,25 @@ footer a {
     font-family: 'montserrat', sans-serif;
     color: #111;
 }
+
+video.responsive-video {
+  max-width: 100%;
+  height: auto;
+}
+
+.youtube-container {
+  position: relative;
+  padding-bottom: 56.25%;
+  height: 0;
+  overflow: hidden;
+}
+
+
+.youtube-container iframe, .youtube-container object, .youtube-container embed {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+}
+
diff --git a/prosopopee/themes/light/templates/sections/youtube.html b/prosopopee/themes/light/templates/sections/youtube.html
new file mode 100644
index 0000000..2e74553
--- /dev/null
+++ b/prosopopee/themes/light/templates/sections/youtube.html
@@ -0,0 +1,5 @@
+<section class="pictures-group">
+  <div class="youtube-container">
+    <iframe width="560" height="315" src="https://www.youtube.com/embed/{{ video_id }}" frameborder="0" allowfullscreen></iframe>
+  </div>
+</section>