Added mobile support for Trac.

sarahboyce · sarahboyce · commit 53c19ab5e5ac · 2023-08-11T23:01:50.000+02:00
diff --git a/scss/trachacks.scss b/scss/trachacks.scss
@@ -108,8 +108,20 @@ pre.wiki {
   white-space: pre-wrap;
 }
 
-#content.ticket {
-  width: auto;
+#content {
+  margin-top: 1em;
+
+  .ticket {
+    width: auto;
+  }
+
+  .report-result {
+    margin-top: 1em;
+  }
+
+  .paging {
+    margin: 0;
+  }
 }
 
 .foldable {
@@ -384,3 +396,25 @@ div[role="main"]{
     }
   }
 }
+
+/* Mobile */
+
+@media (max-width: 767px) {
+  #metanav {
+    ul {
+      li {
+        padding: 1em 0.5em !important;
+      }
+    }
+  }
+
+  #filters {
+    min-width: inherit;
+    overflow: scroll;
+  }
+
+  div:has(.listing.tickets) {
+    min-width: inherit;
+    overflow: scroll;
+  }
+}
diff --git a/trac-env/templates/site.html b/trac-env/templates/site.html
@@ -4,6 +4,7 @@
   <head py:match="head" py:attrs="select('@*')">
     ${select('*|comment()|text()')}
 
+    <meta name="viewport" content="width=device-width, initial-scale=1"/>
     <link rel="stylesheet" href="${href.chrome('site/css/output.css')}" />
     <link rel="stylesheet" href="${href.chrome('site/css/trachacks.css')}" />
     <!--! uncomment for local version of webfont loader if desired. -->
