Fix layout issues on mobile

Issue: RDF-STaX/rdf-stax.github.io#24
RDF-STaX · Nov 28, 2023 · adafa40 · adafa40
1 parent 5dd6d5e
commit adafa40
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 1 deletion.
diff --git a/tasks/doc_gen.py b/tasks/doc_gen.py
@@ -50,6 +50,9 @@ def main():
     # Remove the erroneous download link
     html = re.sub(r'<dt>Ontology RDF.*?</dd>', '', html, flags=re.DOTALL)
 
+    # Remove H1
+    html = re.sub(r'<h1.*?</h1>', '', html, flags=re.DOTALL)
+
     # Save
     with open(output_file, 'w') as f:
         f.write(html)

diff --git a/tasks/res/pylode.css b/tasks/res/pylode.css
@@ -42,10 +42,35 @@ ul.hlist li {
 
 .entity {
     border: 1px solid var(--md-typeset-kbd-border-color);
-    margin: 5px 0 5px 0;
+    margin: 5px 0;
     padding: 5px;
 }
 
+@media screen and (max-width: 600px) {
+    .entity {
+        margin: 5px -10px;
+    }
+
+    .entity > h3 {
+        margin-bottom: 1em;
+    }
+
+    .entity table th, .entity table td {
+        padding: 0.5em 0.35em !important;
+        min-width: unset !important;
+        width: unset !important;
+    }
+
+    .entity table a {
+        word-break: break-word !important;
+    }
+
+    ul.hlist {
+        margin-left: -10px !important;
+        margin-right: -10px;
+    }
+}
+
 .entity th {
     width: 150px;
     vertical-align: top;