From e3e688699f0edb1c671f5f861458dc3265662b42 Mon Sep 17 00:00:00 2001
From: Coracle-Bot <npub1klq6260@nostr.local>
Date: Wed, 9 Sep 2026 01:14:24 +0000
Subject: [PATCH] Size reaction pills to match the add reaction button

---
 src/app/components/NoteItem.svelte |  5 ++++-
 src/app/components/Reaction.svelte | 20 +++++++++++---------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/app/components/NoteItem.svelte b/src/app/components/NoteItem.svelte
index 21d9451a..67c621c8 100644
--- a/src/app/components/NoteItem.svelte
+++ b/src/app/components/NoteItem.svelte
@@ -43,7 +43,10 @@
       {deleteReaction}
       {createReaction}
       reactionClass="tip-right">
-      <EmojiButton {onEmoji} class="button button-neutral button-xs h-[26px] rounded-2xl">
+      <EmojiButton
+        {onEmoji}
+        aria-label="Add a reaction"
+        class="button button-neutral button-xs rounded-full">
         <Icon icon={SmileCircle} size={4} />
       </EmojiButton>
     </ReactionSummary>
diff --git a/src/app/components/Reaction.svelte b/src/app/components/Reaction.svelte
index 05cfd9e4..56f3b634 100644
--- a/src/app/components/Reaction.svelte
+++ b/src/app/components/Reaction.svelte
@@ -14,15 +14,17 @@
 </script>
 
 {#if event.content === "+" || event.content === ""}
-  <Icon icon={Heart} />
+  <Icon icon={Heart} size={4} />
 {:else if event.content === "-"}
-  <Icon icon={ThumbsDown} />
+  <Icon icon={ThumbsDown} size={4} />
 {:else}
-  {#each parse(event) as parsed, i (i)}
-    {#if isEmoji(parsed)}
-      <ContentEmoji value={parsed.value} />
-    {:else}
-      {@html renderAsHtml(parsed)}
-    {/if}
-  {/each}
+  <span class="text-base leading-none">
+    {#each parse(event) as parsed, i (i)}
+      {#if isEmoji(parsed)}
+        <ContentEmoji value={parsed.value} />
+      {:else}
+        {@html renderAsHtml(parsed)}
+      {/if}
+    {/each}
+  </span>
 {/if}