added support for cards (closes #13)

RealDekkia · Apr 15, 2024 · 6c3c1ec · 6c3c1ec
1 parent 0273884
commit 6c3c1ec
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 0 deletions.
diff --git a/thread/css/style.css b/thread/css/style.css
@@ -110,6 +110,23 @@ section:hover {
     color: inherit;
 }
 
+.cardWrapper,
+.cardWrapper:visited {
+    color: inherit;
+    overflow: hidden;
+    display: block;
+    margin: 2vw;
+    padding: 1vw;
+    border-radius: 2vh;
+    text-decoration: inherit;
+    background-color: var(--accent-bg);
+}
+
+.cardWrapper:hover,
+.cardWrapper:visited:hover {
+    background-color: var(--bg);
+}
+
 #pageFooter {
     grid-row: 3;
 }
diff --git a/thread/js/main.js b/thread/js/main.js
@@ -146,6 +146,30 @@ const threadUnroll = {
                     });
                 }
 
+                if (status.card && status.card.image) {
+                    var cardWrapper = document.createElement("a");
+                    cardWrapper.className = "cardWrapper";
+                    cardWrapper.href = status.card.url;
+
+                    var cardImage = document.createElement("img");
+                    cardImage.src = status.card.image;
+                    cardWrapper.appendChild(cardImage);
+
+                    var cardImageSubline = document.createElement("p");
+                    cardImageSubline.innerHTML = status.card.provider_name + " - " + new Date(status.card.published_at).toLocaleString();;
+                    cardWrapper.appendChild(cardImageSubline);
+
+                    var cardHeadline = document.createElement("h4");
+                    cardHeadline.innerHTML = status.card.title;
+                    cardWrapper.appendChild(cardHeadline);
+
+                    var cardAutor = document.createElement("p");
+                    cardAutor.innerHTML = status.card.author_name;
+                    cardWrapper.appendChild(cardAutor);
+
+                    statusBox.appendChild(cardWrapper);
+                }
+
                 mb.appendChild(statusBoxWrapper);
                 postCnt++;
             }