From b49a6cd685d3a364dd1f84d772c061d45c1fcfd8 Mon Sep 17 00:00:00 2001
From: Cory McWilliams <cory@unprompted.com>
Date: Wed, 1 Oct 2025 18:06:45 -0400
Subject: [PATCH] ssb: Place the message collapse better with the messages it
 collapses.

---
 apps/ssb.json          |  2 +-
 apps/ssb/tf-message.js | 54 ++++++++++++++++++++++--------------------
 2 files changed, 29 insertions(+), 27 deletions(-)

diff --git a/apps/ssb.json b/apps/ssb.json
index 61a4a91b9..e9436ca19 100644
--- a/apps/ssb.json
+++ b/apps/ssb.json
@@ -1,5 +1,5 @@
 {
 	"type": "tildefriends-app",
 	"emoji": "🦀",
-	"previous": "&ULwb8udTxSkqf+mcZ0NxJs6p/hGB03eQEEKzJvWO3fk=.sha256"
+	"previous": "&CvV0TK1E0a2bOQSvieNbxsJg0JHeuDNWBsL+vEJLoKs=.sha256"
 }
diff --git a/apps/ssb/tf-message.js b/apps/ssb/tf-message.js
index 83ed432c3..6bb161d2c 100644
--- a/apps/ssb/tf-message.js
+++ b/apps/ssb/tf-message.js
@@ -365,32 +365,34 @@ class TfMessageElement extends LitElement {
 				`;
 			} else {
 				return html` <ul class="w3-container w3-margin-bottom w3-ul w3-card-4">
-						${repeat(
-							this.message.child_messages || [],
-							(x) => x.id,
-							(x) =>
-								html`<li style="padding: 0">
-									<tf-message
-										.message=${x}
-										whoami=${this.whoami}
-										.users=${this.users}
-										.drafts=${this.drafts}
-										.expanded=${this.expanded}
-										channel=${this.channel}
-										channel_unread=${this.channel_unread}
-										.recent_reactions=${this.recent_reactions}
-										depth=${this.depth + 1}
-									></tf-message>
-								</li>`
-						)}
-					</ul>
-					<button
-						class="w3-button w3-theme-d1 w3-block w3-bar"
-						style="box-sizing: border-box"
-						@click=${() => self.set_expanded(false)}
-					>
-						Collapse
-					</button>`;
+					${repeat(
+						this.message.child_messages || [],
+						(x) => x.id,
+						(x) =>
+							html`<li style="padding: 0">
+								<tf-message
+									.message=${x}
+									whoami=${this.whoami}
+									.users=${this.users}
+									.drafts=${this.drafts}
+									.expanded=${this.expanded}
+									channel=${this.channel}
+									channel_unread=${this.channel_unread}
+									.recent_reactions=${this.recent_reactions}
+									depth=${this.depth + 1}
+								></tf-message>
+							</li>`
+					)}
+					<li style="padding: 0" class="w3-margin-bottom">
+						<button
+							class="w3-button w3-theme-d1 w3-block w3-bar"
+							style="box-sizing: border-box"
+							@click=${() => self.set_expanded(false)}
+						>
+							Collapse
+						</button>
+					</li>
+				</ul>`;
 			}
 		} else {
 			return undefined;