From dcc9f2bf2213887d14a5b925f74c84f3a8f9123d Mon Sep 17 00:00:00 2001
From: Marty Sluijtman <marty.wanderer@disroot.org>
Date: Thu, 23 Mar 2023 19:52:55 +0100
Subject: [PATCH] Column count depending on viewport size

---
 static/style.css | 28 +++++++++++++++++++++++++---
 1 file changed, 25 insertions(+), 3 deletions(-)

diff --git a/static/style.css b/static/style.css
index 0196edd..565a947 100644
--- a/static/style.css
+++ b/static/style.css
@@ -74,13 +74,35 @@ hr{color: var(--ansi00);}
 }
 header{text-transform: capitalize; text-align:center;border-bottom:2pt solid; font-weight:bold;}
 .page-head{text-transform: capitalize; text-align:center;border-bottom:2pt solid; font-weight:bold;}
-@media (min-width: 1200px){
-	.post-content{ column-count: 2; }
-}
 @media (max-width: 800px){
 	main{max-width:100%; margin: 1em;}
 	menu{padding:0; width: 100%; border-right:solid 0pt;}
 	menu a{ padding-left: 1em;}
+
+	.post-content{
+		max-width: 80ch;
+	}
+}
+@media (min-width: 80ch){
+		.post-content{ column-count: 1;
+		max-width: 80ch;
+		margin: auto;
+	}
+}
+@media (min-width: 160ch){
+		.post-content{ column-count: 2;
+		max-width: 160ch;
+		margin: auto;
+	}
+}
+@media (min-width: 240ch){
+		.post-content{ column-count: 3;
+		max-width: 240ch;
+		margin: auto;
+	}
+}
+.post-content{
+	margin: auto;
 }
 .post-content img{
     max-width: 100%;