From: "Bradley Taunt" <bt@btxx.org>
Subject: got patch: Minor gotweb mobile styling updates
To: <gameoftrees@openbsd.org>
Date: Mon, 11 Nov 2024 19:57:52 -0500

Suggesting minor styling changes for some QoL updates on mobile devices. I've set
everything under a single query block, but if that is not the desired structure
just let me know.


diff aae9823b00f5988597d2f2fac63dd14e16b0a003 HEAD
commit - aae9823b00f5988597d2f2fac63dd14e16b0a003
commit + 23f010e449fe35c713ec9caef6a093f31cabab55
blob - d58e49303616a5d26897f57e773f0b3772da1554
blob + 47dfcc3fabd6c2bfc3708182b1c3592ef607e8ba
--- gotwebd/files/htdocs/gotwebd/gotweb.css
+++ gotwebd/files/htdocs/gotwebd/gotweb.css
@@ -449,6 +449,50 @@ dd {
 	padding-left: 10px;
 }

+/* mobile (<=680px) */
+@media(max-width:680px) {
+    #index_header {
+        display: none;
+    }
+    .index_wrapper {
+        display: flex;
+        flex-wrap: wrap;
+    }
+    .index_wrapper .index_project,
+    .index_wrapper .index_project_description {
+        padding-bottom: 0;
+        width: 100%;
+    }
+    .index_wrapper .index_project {
+        font-weight: bold;
+        text-decoration: underline;
+    }
+    .index_wrapper .index_project_owner,
+    .index_wrapper .index_project_age {
+        opacity: 0.7;
+        width: 50%;
+    }
+    .index_wrapper .index_project_age {
+        text-align: right;
+    }
+
+    #summary_wrapper {
+        padding: 4px 0;
+    }
+    #summary_wrapper dt,
+    #summary_wrapper dd {
+        width: 100%;
+    }
+    #summary_wrapper dt {
+        font-weight: bold;
+        padding-bottom: 0;
+    }
+    #summary_wrapper dd {
+        padding-bottom: 8px;
+    }
+}
+
+
 /* dark theme */
 @media (prefers-color-scheme: dark) {
 	body {