From 0b845d6f71dcf808ca3f528d62191d1f2a0c3641 Mon Sep 17 00:00:00 2001
From: Amneesh Singh <natto@weirdnatto.in>
Date: Wed, 2 Nov 2022 17:35:56 +0530
Subject: [PATCH] dailies: add a max-width of 100% to media

Signed-off-by: Amneesh Singh <natto@weirdnatto.in>
---
 css/default.css | 19 +++++++++++++++++++
 dailies/1.org   |  4 +++-
 dailies/2.org   |  8 ++++++--
 dailies/3.org   |  4 +++-
 dailies/4.org   |  6 ++++--
 5 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/css/default.css b/css/default.css
index f73f665..9df5d49 100644
--- a/css/default.css
+++ b/css/default.css
@@ -213,6 +213,25 @@ pre {
   max-width: 40%;
 }
 
+img, video {
+  max-width: 100%;
+}
+
+.iframe-parent {
+  max-width: 100%;
+  position: relative;
+  height: 0;
+  padding-bottom: 56.25%
+}
+
+.iframe-parent iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
 @media (max-width: 319px) {
   body {
     width: 90%;
diff --git a/dailies/1.org b/dailies/1.org
index 02dbba6..83ad7b0 100644
--- a/dailies/1.org
+++ b/dailies/1.org
@@ -20,7 +20,9 @@ Doing chores sucks but errands suck more. Also self hosting shit sucks, but I do
 * Song of the Day
 Been loving this one since my early adolescence.
 #+begin_export html
-<iframe src="https://youtube.com/embed/mGnJm0qIpFw" width=800px height=450px />
+<div class="iframe-parent">
+  <iframe src="https://youtube.com/embed/mGnJm0qIpFw" />
+</div>
 #+end_export
 
 * Thought of the Day
diff --git a/dailies/2.org b/dailies/2.org
index d0b2386..d7c5868 100644
--- a/dailies/2.org
+++ b/dailies/2.org
@@ -13,13 +13,17 @@ I have really shitty internet bandwidth and I have a lot of work pending (that d
 * Video of the Day
 #+begin_export html
 MEGU MEGU FIRE ENDLESS NIGHT SOSHITE MOTTO MOTTO ATSUKU NARE FEVER
-<iframe src="https://youtube.com/embed/N6FfOevhA10 " width=800px height=450px />
+<div class="iframe-parent">
+  <iframe src="https://youtube.com/embed/N6FfOevhA10" />
+</div>
 #+end_export
 
 * Song of the Day
 Sofia Vempo's version/cover of Misirlou
 #+begin_export html
-<iframe src="https://youtube.com/embed/8myXQRe-WcY" width=800px height=450px />
+<div class="iframe-parent">
+  <iframe src="https://youtube.com/embed/8myXQRe-WcY" />
+</div>
 #+end_export
 
 * Thought of the Day
diff --git a/dailies/3.org b/dailies/3.org
index 85e94df..b75d990 100644
--- a/dailies/3.org
+++ b/dailies/3.org
@@ -19,7 +19,9 @@ College sucks, it makes me eepy.
 
 * Song of the Day
 #+begin_export html
-<iframe src="https://youtube.com/embed/N-cU-M_tX68" width=800px height=450px />
+<div class="iframe-parent">
+  <iframe src="https://youtube.com/embed/N-cU-M_tX68" />
+</div>
 #+end_export
 
 * Thought of the Day
diff --git a/dailies/4.org b/dailies/4.org
index 58d39fb..39b29fb 100644
--- a/dailies/4.org
+++ b/dailies/4.org
@@ -8,7 +8,7 @@ I really am a midwit.
 
 * Image of the Day
 Red and black, I dress eagle on my chest
-#+ATTR_HTML: :alt Red and black, I dress eagle on my chest :width 600px
+#+ATTR_HTML: :alt Red and black, I dress eagle on my chest
 [[https://f.weirdnatto.in/EXrJ-albaniagdp.jpg]]
 
 * Video of the Day
@@ -21,7 +21,9 @@ Welcome!
 
 * Song of the Day
 #+begin_export html
-<iframe src="https://youtube.com/embed/Nfql0PyA8D0" width=800px height=450px />
+<div class="iframe-parent">
+  <iframe src="https://youtube.com/embed/Nfql0PyA8D0" />
+</div>
 #+end_export
 
 * Thought of the Day