From d1044092727ad26dfe466f82be04ec83148fa390 Mon Sep 17 00:00:00 2001
From: Cory McWilliams <cory@unprompted.com>
Date: Mon, 23 Sep 2024 12:43:48 -0400
Subject: [PATCH] Prevent votes from overflowing.

---
 apps/ssb.json          |  2 +-
 apps/ssb/tf-message.js | 28 ++++++++++++++++------------
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/apps/ssb.json b/apps/ssb.json
index 4726abdf..8745153b 100644
--- a/apps/ssb.json
+++ b/apps/ssb.json
@@ -1,5 +1,5 @@
 {
 	"type": "tildefriends-app",
 	"emoji": "🐌",
-	"previous": "&6oHPQCA26v+4nBXv+YUdCT43j2DpXDspxhHSSRydkiw=.sha256"
+	"previous": "&7L314QLuVl8kNbFIWuXXeLqIVefUe5S66WvEmOMQb2U=.sha256"
 }
diff --git a/apps/ssb/tf-message.js b/apps/ssb/tf-message.js
index 7e05b72b..30a39496 100644
--- a/apps/ssb/tf-message.js
+++ b/apps/ssb/tf-message.js
@@ -73,18 +73,22 @@ class TfMessageElement extends LitElement {
 			}
 		}
 		if (this.message?.votes?.length) {
-			return html`<div class="w3-button" @click=${this.show_reactions}>
-				${(this.message.votes || []).map(
-					(vote) => html`
-						<span
-							title="${this.users[vote.author]?.name ?? vote.author} ${new Date(
-								vote.timestamp
-							)}"
-						>
-							${normalize_expression(vote.content.vote.expression)}
-						</span>
-					`
-				)}
+			return html`
+			<div class="w3-container">
+				<div class="w3-button w3-bar w3-padding-small" @click=${this.show_reactions}>
+					${(this.message.votes || []).map(
+						(vote) => html`
+							<span
+								class="w3-bar-item w3-padding-small"
+								title="${this.users[vote.author]?.name ?? vote.author} ${new Date(
+									vote.timestamp
+								)}"
+							>
+								${normalize_expression(vote.content.vote.expression)}
+							</span>
+						`
+					)}
+				</div>
 			</div>`;
 		}
 	}