From 96df3bfc30a4e36d3e9831802fa0e7336679836b Mon Sep 17 00:00:00 2001 From: "Danilo M." 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 --- themes/danix-xyz-hacker/assets/css/main.min.css | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) (limited to 'themes/danix-xyz-hacker/assets/css/main.min.css') diff --git a/themes/danix-xyz-hacker/assets/css/main.min.css b/themes/danix-xyz-hacker/assets/css/main.min.css index 64be81a..fe44358 100644 --- a/themes/danix-xyz-hacker/assets/css/main.min.css +++ b/themes/danix-xyz-hacker/assets/css/main.min.css @@ -2036,6 +2036,10 @@ article.border.border-border\/30.rounded-lg.card.group.bg-bg { width: 100%; } +.min-w-0 { + min-width: 0px; +} + .max-w-2xl { max-width: 42rem; } @@ -2819,15 +2823,21 @@ html.theme-light body[data-page-kind="home"] #matrix-rain { /* Content grid background — blocks rain under text, visible in gutters (single pages only) */ -.grid.md\:grid-cols-3.gap-8.max-w-7xl.content-grid { +.content-grid { position: relative; z-index: 10; background-color: var(--bg); - padding: 2rem; + padding: 2px; border: 1px solid var(--border); box-shadow: 0 0 20px var(--accent-glow); } +@media (min-width: 768px) { + .content-grid { + padding: 2rem; + } +} + /* Article list items — soft glow effect */ article.border.border-border\/30.rounded-lg.overflow-hidden.group.bg-bg { -- cgit v1.2.3