style: improve post responsiveness and reduce font size on smaller sc…

…reens
hyphacoop · Mar 15, 2024 · 1c5fd4e · 1c5fd4e
1 parent fb21497
commit 1c5fd4e
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -1,4 +1,6 @@
 <!DOCTYPE html>
+<meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
 <title>Social Reader</title>
 <style>
   @import url("./index.css");

diff --git a/post.css b/post.css
@@ -79,3 +79,22 @@ img {
   font-size: 0.875rem;
   color: var(--rdp-details-color);
 }
+
+@media (max-width: 768px) {
+  .distributed-post {
+    max-width: 80%;
+    padding: 12px;
+    margin: 8px auto;
+  }
+
+  .post-content,
+  .post-footer,
+  .time-ago {
+    font-size: 0.875rem;
+  }
+
+  .actor-icon {
+    width: 40px;
+    height: 40px;
+  }
+}