Add Mastodon toots to main page

assets/css/screen.css

@@ -69,6 +69,7 @@ production stylesheet in assets/built/screen.css
     --container-width: 1320px;
     --container-gap: clamp(24px, 1.7032rem + 1.9355vw, 48px);
     --grid-gap: 42px;
+    --card-border-radius: 5px;
 }
 
 :root.light-theme {
@@ -1726,12 +1727,12 @@ Search                         LOGO                    Login Subscribe
 /* 11.1. With sidebar */
 
 .gh-container.has-sidebar .gh-main {
-    grid-column: 1 / span 12;
+    grid-column: 1 / span 11;
     position: relative;
 }
 
 .gh-container.has-sidebar .gh-sidebar {
-    grid-column: 13 / -1;
+    grid-column: 12 / -1;
 }
 
 .gh-container.has-sidebar .gh-main::after {
@@ -1954,6 +1955,59 @@ Search                         LOGO                    Login Subscribe
     margin-top: 32px;
 }
 
+.mastodon-comment {
+    background-color: var(--background-color);
+    border-radius: var(--card-border-radius);
+    padding: 10px;
+    margin-bottom: 1rem;
+    display: flex;
+    border-top: 1px solid var(--background-secondary);
+    .mastodon-body {
+        flex-grow: 1;
+    }
+    .mastodon-avatar {
+        flex-shrink: 1;
+    }
+    .mastodon-avatar img {
+        margin-right: 1rem;
+        min-width: 60px;
+    }
+    .mastodon-meta {
+        padding-top: 0;
+        display: flex;
+        .mastodon-author {
+            flex-grow: 1;
+            white-space: nowrap;
+            .mastodon-author-uid {
+                font-size: 80%;
+                color: var(--ghost-accent-color);
+            }
+        }
+        .toot-link {
+            flex-shrink: 1;
+            text-align: right;
+        }
+    }
+    .mastodon-comment-content {
+        padding-top: 10px;
+        .tootlink {
+            font-size: 50%;
+        }
+    }
+    .disabled {
+        color: var(--ghost-accent-color)
+    }
+}
+.mastodon-emoji {
+    display: inline-block;
+    width: 1em;
+    height: 1em;
+}
+.mastodon-comment-content p:first-child {
+    margin-top: 0;
+}
+
+
 /* 14. Post/page
 /* ---------------------------------------------------------- */