From 58ea5c0c853697b7f1ef135a87e9a787267b78e0 Mon Sep 17 00:00:00 2001
From: NH Gooi <techniek@nhgooi.nl>
Date: Thu, 3 Oct 2024 19:32:44 +0200
Subject: [PATCH] iframe blocktype toegevoegd [#00033]

---
 public/css/style.css                       | 11 ++++++++---
 resources/views/partial/nh_story.blade.php | 17 +++++++++++++++++
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/public/css/style.css b/public/css/style.css
index 30bfd4a2..5da3726d 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1664,9 +1664,14 @@ a, a:hover, a:active {
 }
 
 .podcast-player .content {
-	border: solid 1px #333;
-	border-radius: 5px;
-	padding: 0.4rem;
+  border: solid 1px #333;
+  border-radius: 5px;
+  padding: 0.4rem;
+}
+
+.article-iframe {
+  width: 100%;
+  aspect-ratio: 1;
 }
 
 /*# sourceMappingURL=style.css.map */
diff --git a/resources/views/partial/nh_story.blade.php b/resources/views/partial/nh_story.blade.php
index c613b456..da789b77 100644
--- a/resources/views/partial/nh_story.blade.php
+++ b/resources/views/partial/nh_story.blade.php
@@ -140,5 +140,22 @@
 		</ul>
 	</div>
 </div>
+@elseif($block->type == 'iframe')
+  <iframe src="{{ $block->url }}" class="article-iframe" id="{{ $id = uniqid('iframe_') }}"></iframe>
+<style>
+@if(isset($block->ratio))
+#{{ $id }}.article-iframe {
+  aspect-ratio: {{ str_replace(":", "/", $block->ratio) }};
+}
+@endif
+
+@if(isset($block->ratioMobile))
+@media (max-width: 768px) {
+  #{{ $id }}.article-iframe {
+    aspect-ratio: {{ str_replace(":", "/", $block->ratioMobile) }};
+  }
+}
+@endif
+</style>
 @endif
 @endforeach