From bd56bfdd9f7406915b5d47c103466f64ebee0892 Mon Sep 17 00:00:00 2001
From: Edward Loveall <edward@edwardloveall.com>
Date: Sat, 25 Sep 2021 13:26:10 -0400
Subject: [PATCH] Embed widths are now the same width as all content

---
 spec/components/page_content_spec.cr | 16 +++++++++-------
 src/components/page_content.cr       |  8 ++++----
 src/css/app.css                      |  4 ++++
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/spec/components/page_content_spec.cr b/spec/components/page_content_spec.cr
index e64658d..72727e2 100644
--- a/spec/components/page_content_spec.cr
+++ b/spec/components/page_content_spec.cr
@@ -246,10 +246,10 @@ describe PageContent do
     html = PageContent.new(page: page).render_to_string
 
     html.should eq stripped_html <<-HTML
-      <div class="iframe-wrapper">
+      <figure>
         <iframe src="https://example.com" width="800" height="480" frameborder="0" allowfullscreen="true">
         </iframe>
-      </div>
+      </figure>
     HTML
   end
 
@@ -270,9 +270,9 @@ describe PageContent do
 
     html.should eq stripped_html <<-HTML
       <p>
-        <div class="embedded">
+        <figure>
           <a href="https://example.com">Embedded content at example.com</a>
-        </div>
+        </figure>
       </p>
     HTML
   end
@@ -299,9 +299,11 @@ describe PageContent do
 
     html.should eq stripped_html <<-HTML
       <p>
-        <div class="embedded">
-          <a href="https://example.com">Mixtape</a>
-        </div>
+        <blockquote>
+          <p>
+            <a href="https://example.com">Mixtape</a>
+          </p>
+        </blockquote>
       </p>
     HTML
   end
diff --git a/src/components/page_content.cr b/src/components/page_content.cr
index 0bbbc50..90a5be8 100644
--- a/src/components/page_content.cr
+++ b/src/components/page_content.cr
@@ -32,7 +32,7 @@ class PageContent < BaseComponent
   end
 
   def render_child(child : EmbeddedContent)
-    div class: "iframe-wrapper" do
+    figure do
       iframe(
         src: child.src,
         width: child.width,
@@ -44,7 +44,7 @@ class PageContent < BaseComponent
   end
 
   def render_child(child : EmbeddedLink)
-    div class: "embedded" do
+    figure do
       a href: child.href do
         text "Embedded content at #{child.domain}"
       end
@@ -98,8 +98,8 @@ class PageContent < BaseComponent
   end
 
   def render_child(node : MixtapeEmbed)
-    div class: "embedded" do
-      render_children(node.children)
+    blockquote do
+      para { render_children(node.children) }
     end
   end
 
diff --git a/src/css/app.css b/src/css/app.css
index e17c800..0f47624 100644
--- a/src/css/app.css
+++ b/src/css/app.css
@@ -6,3 +6,7 @@ p.meta {
   font-size: 1.2rem;
   line-height: 1;
 }
+
+figure iframe {
+  max-width: 100%;
+}