From 13ad3e4958814078d5bf6c1c6e06461084e7d4ee Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Sat, 17 Aug 2024 18:09:55 +0800
Subject: [PATCH 1/3] CompactToot: added preview cards

---
 src/timelines/CompactToot.tsx | 8 +++++---
 src/timelines/RegularToot.tsx | 9 ++++++++-
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/timelines/CompactToot.tsx b/src/timelines/CompactToot.tsx
index eb8a7b7..75320ea 100644
--- a/src/timelines/CompactToot.tsx
+++ b/src/timelines/CompactToot.tsx
@@ -1,12 +1,11 @@
 import type { mastodon } from "masto";
-import { type Component } from "solid-js";
+import { Show, type Component } from "solid-js";
 import tootStyle from "./toot.module.css";
 import { formatRelative } from "date-fns";
 import Img from "../material/Img";
 import { Body2 } from "../material/typography";
-import { css } from "solid-styled";
 import { appliedCustomEmoji } from "../masto/toot";
-import cardStyle from "../material/cards.module.css";
+import { TootPreviewCard } from "./RegularToot";
 
 type CompactTootProps = {
   status: mastodon.v1.Status;
@@ -48,6 +47,9 @@ const CompactToot: Component<CompactTootProps> = (props) => {
         }}
         class={[tootStyle.compactTootContent].join(" ")}
       ></div>
+      <Show when={toot().card}>
+        <TootPreviewCard src={toot().card!} alwaysCompact />
+      </Show>
     </section>
   );
 };
diff --git a/src/timelines/RegularToot.tsx b/src/timelines/RegularToot.tsx
index 24462a1..1912f90 100644
--- a/src/timelines/RegularToot.tsx
+++ b/src/timelines/RegularToot.tsx
@@ -197,10 +197,17 @@ function TootAuthorGroup(props: { status: mastodon.v1.Status; now: Date }) {
   );
 }
 
-function TootPreviewCard(props: { src: mastodon.v1.PreviewCard }) {
+export function TootPreviewCard(props: {
+  src: mastodon.v1.PreviewCard;
+  alwaysCompact?: boolean;
+}) {
   let root: HTMLAnchorElement;
 
   createEffect(() => {
+    if (props.alwaysCompact) {
+      root.classList.add(tootStyle.compact);
+      return;
+    }
     if (!props.src.width) return;
     const width = root.getBoundingClientRect().width;
     if (width > props.src.width) {

From 0f357a66e85fb0230e33f6b70822d86e5eff116d Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Sat, 17 Aug 2024 18:58:25 +0800
Subject: [PATCH 2/3] TootPreviewCard: balance padding

---
 src/timelines/toot.module.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/timelines/toot.module.css b/src/timelines/toot.module.css
index bc82522..92c4143 100644
--- a/src/timelines/toot.module.css
+++ b/src/timelines/toot.module.css
@@ -147,6 +147,7 @@
     grid-template-columns: minmax(10%, 30%) 1fr;
     padding-left: 16px;
     padding-right: 16px;
+    padding-top: 8px;
 
     >img:first-child {
       grid-row: 1 / 3;

From cecebda39bbc913b5bbe2f3cf4bbf17acd0f1f42 Mon Sep 17 00:00:00 2001
From: thislight <l1589002388@gmail.com>
Date: Sat, 17 Aug 2024 19:01:05 +0800
Subject: [PATCH 3/3] Home: move to the top if the clicked tab is focus

---
 src/timelines/Home.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/timelines/Home.tsx b/src/timelines/Home.tsx
index b177b2d..d303c72 100644
--- a/src/timelines/Home.tsx
+++ b/src/timelines/Home.tsx
@@ -282,6 +282,12 @@ const Home: ParentComponent = (props) => {
     if (items.length > idx) {
       items.item(idx).scrollIntoView({ block: "start", behavior: "smooth" });
     }
+    if (isTabFocus(idx)) {
+      items.item(idx).scrollTo({
+        top: 0,
+        behavior: "smooth",
+      });
+    }
   };
 
   const openFullScreenToot = (