From 27b2fa3ca8d8570d666176d488f03d20ba0fd459 Mon Sep 17 00:00:00 2001
From: Andrew Gioia <andrew@gioia.email>
Date: Sat, 15 Aug 2020 22:25:17 -0400
Subject: [PATCH] New banner image Easter egg on mobile

---
 assets/scss/_media.scss            | 52 ++++++++++++++++++++++--------
 assets/scss/main.scss              |  6 ++++
 content/posts/20-07-09-facebook.md |  1 +
 content/posts/20-08-11-mozilla.md  |  1 +
 layouts/_default/single.html       |  3 ++
 5 files changed, 49 insertions(+), 14 deletions(-)

diff --git a/assets/scss/_media.scss b/assets/scss/_media.scss
index 664c046..aa80866 100644
--- a/assets/scss/_media.scss
+++ b/assets/scss/_media.scss
@@ -1,19 +1,27 @@
 // media queries
 
-@media only screen and (max-width: $screen-mobile) {
-    section#author {
-        align-items: center;
-        flex-direction: column;
-        span {
-            display: block;
-            padding-bottom: 0.5vmax;
+@media only screen and (max-width: $screen-laptop) {
+    main {
+        article {
+            p,
+            ul,
+            h3,
+            h4,
+            section,
+            blockquote {
+                width: min(60vmax, 100%); // increase the column width a bit
+            }
+            h2 {
+                margin: 2vmax 5vmin 1vmax;
+            }
+            h3 {
+                margin: 2vmax 0 1vmax;
+            }
         }
     }
     #toc {
-        display: none;
-    }
-    .hidden-mobile {
-        display: none;
+        right: -50vw;
+        width: 50vw;
     }
 }
 
@@ -72,10 +80,26 @@
     }
 }
 
-@media only screen and (max-width: $screen-laptop) {
+@media only screen and (max-width: $screen-mobile) {
+    section#author {
+        align-items: center;
+        flex-direction: column;
+        span {
+            display: block;
+            padding-bottom: 0.5vmax;
+        }
+    }
     #toc {
-        right: -50vw;
-        width: 50vw;
+        display: none;
+    }
+    .hidden-mobile {
+        display: none;
+    }
+}
+
+@media only screen and (max-width: $screen-narrow) {
+    main aside img#banner {
+        display: block;
     }
 }
 
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index 52a4b82..e403641 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -135,6 +135,12 @@ main {
         margin: 0 7.5vmin max(2vmax, 1rem);
         text-align: center;
 
+        img#banner {
+            display: none; // only showing this on phones
+            margin: 0 -6vmin 10vmin;
+            width: calc(100% + 12vmin);
+        }
+
         h1 {
             color: var(--text-color-title);
             font-family: $font-family-title;
diff --git a/content/posts/20-07-09-facebook.md b/content/posts/20-07-09-facebook.md
index 7746dee..216cabc 100644
--- a/content/posts/20-07-09-facebook.md
+++ b/content/posts/20-07-09-facebook.md
@@ -5,6 +5,7 @@ author: Andrew Gioia
 slug: "facebook"
 date: 2020-07-09
 publishdate: 2020-07-14
+banner: post-cover.png
 images:
     - posts/facebook/post-cover.png
 description: Of all the very rational reasons to boycott Facebook or any commercial social media platform, that "its support of free speech" has taken hold is alarming. "Private companies can do whatever they want" is problematic for many reasons, and here it's being used unfairly as a sword to compel Facebook to govern certain types of speech on its platform. This is a huge mistake with irrevocable damage, and if free speech as a moral guideline doesn't persuade you then the realities of voluntarily privatizing "truth arbitration" absolutely should.
diff --git a/content/posts/20-08-11-mozilla.md b/content/posts/20-08-11-mozilla.md
index b7fd091..116482c 100644
--- a/content/posts/20-08-11-mozilla.md
+++ b/content/posts/20-08-11-mozilla.md
@@ -5,6 +5,7 @@ author: Andrew Gioia
 slug: "mozilla"
 date: 2020-08-14
 publishdate: 2020-08-14
+banner: post-cover.png
 images:
     - posts/mozilla/post-cover.png
 description: I love Mozilla, I love its mission, and I love its core product, Firefox. It absolutely sucks as a business though, and its current trajectory is insolvency. Mozilla needs to focus on Firefox and core technologies, sell privacy-first software as a service, and bring back technical leadership if it truly wants to execute on its mission.
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 338dce8..d9e429f 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -6,6 +6,9 @@
 
 <main id="post" aria-role="main">
     <aside>
+        {{ with (.Params.banner) }}
+        <img src="{{ . }}" id="banner">
+        {{ end }}
         <h1>
             {{ .Title }}
         </h1>