From 371f71f01fdb945dd52f893fa842e62b13b1aaa3 Mon Sep 17 00:00:00 2001
From: Matthew Ball <13823657+matthewrball@users.noreply.github.com>
Date: Wed, 20 May 2026 18:17:55 -0700
Subject: [PATCH] Make full-width images span the entire viewport on
 non-sidebar pages
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

On pages without a sidebar, full-width images were constrained to
the .main container max-width (1280px). This breaks them out to the
full viewport width using calc(-50vw + 50%) margins, with object-fit
cover and a consistent max-height to keep all banner images uniform.

Sidebar guide pages are unaffected — they keep existing behavior.
---
 _sass/minima/_article.scss | 28 +++++++++++++++++++++++++++-
 _sass/minima/_base.scss    |  1 +
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/_sass/minima/_article.scss b/_sass/minima/_article.scss
index 4d26a5ec0..9b3470b93 100644
--- a/_sass/minima/_article.scss
+++ b/_sass/minima/_article.scss
@@ -362,7 +362,9 @@ article.guide {
     }
   }
 
-  // Full width images stretch all the way, up to 1600px width.
+  // Full width images stretch all the way.
+  // On non-sidebar pages, break out to full viewport width.
+  // On sidebar pages, only cancel the article padding.
 
   & > .-full-width {
     display: flex;
@@ -384,6 +386,30 @@ article.guide {
     }
   }
 
+  .main:not(.sidebar) > & > .-full-width {
+    @include media-query(large) {
+      width: 100vw;
+      margin-left: calc(-50vw + 50%);
+      margin-right: calc(-50vw + 50%);
+
+      figure {
+        width: 100%;
+      }
+
+      picture {
+        display: block;
+        width: 100%;
+      }
+
+      img {
+        width: 100%;
+        max-width: none;
+        max-height: calc(#{$content-width - $spacing-unit * 4} * 0.375); // 600:1600 banner ratio
+        object-fit: cover;
+      }
+    }
+  }
+
   figure.-full-width {
     figcaption {
       margin-left: $spacing-unit/2;
diff --git a/_sass/minima/_base.scss b/_sass/minima/_base.scss
index 297532c01..103ac32be 100644
--- a/_sass/minima/_base.scss
+++ b/_sass/minima/_base.scss
@@ -32,6 +32,7 @@ body {
   min-height: 100vh;
   flex-direction: column;
   overflow-wrap: break-word;
+  overflow-x: hidden;
   width: 100%;
   box-sizing:border-box;
 }