From 96df3bfc30a4e36d3e9831802fa0e7336679836b Mon Sep 17 00:00:00 2001
From: "Danilo M." <danix@danix.xyz>
Date: Mon, 20 Apr 2026 21:55:11 +0200
Subject: fix: resolve mobile viewport overflow on article pages

Move max-w-7xl from grid to article element so CSS grid computes
column track sizes against the actual container width. Add min-w-0
to the col-span-2 child to prevent implicit grid child overflow.
Simplify .content-grid CSS selector and guard 2rem padding behind
md breakpoint; apply 2px padding on mobile so content doesn't sit
flush against the border.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 themes/danix-xyz-hacker/layouts/_default/single.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'themes/danix-xyz-hacker/layouts/_default/single.html')

diff --git a/themes/danix-xyz-hacker/layouts/_default/single.html b/themes/danix-xyz-hacker/layouts/_default/single.html
index 62e4a64..7a1a069 100644
--- a/themes/danix-xyz-hacker/layouts/_default/single.html
+++ b/themes/danix-xyz-hacker/layouts/_default/single.html
@@ -1,8 +1,8 @@
 {{ define "main" }}
-<article class="mx-auto px-4 py-12">
-  <div class="grid md:grid-cols-3 gap-8 max-w-7xl mx-auto content-grid">
+<article class="mx-auto px-4 py-12 max-w-7xl">
+  <div class="grid md:grid-cols-3 gap-8 content-grid">
     <!-- Article section -->
-    <div class="md:col-span-2">
+    <div class="md:col-span-2 min-w-0">
       <!-- Top article navigation (articles only) -->
       {{ if eq .Section "articles" }}
       {{ partial "article-nav.html" (dict "page" . "variant" "top") }}
-- 
cgit v1.2.3