From 48b2023241952dd0c554afd8e7db18d480e57bb9 Mon Sep 17 00:00:00 2001
From: celine <celine@hyperlink.academy>
Date: Thu, 4 Dec 2025 16:06:00 -0500
Subject: [PATCH] style the actual mention

---
 .../publish/BskyPostEditorProsemirror.tsx          | 14 +++++++-------
 components/Blocks/TextBlock/schema.ts              |  3 +--
 components/Mention.tsx                             |  2 +-
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/app/[leaflet_id]/publish/BskyPostEditorProsemirror.tsx b/app/[leaflet_id]/publish/BskyPostEditorProsemirror.tsx
index 0c834a79..e8c82569 100644
--- a/app/[leaflet_id]/publish/BskyPostEditorProsemirror.tsx
+++ b/app/[leaflet_id]/publish/BskyPostEditorProsemirror.tsx
@@ -382,10 +382,10 @@ export const addMentionToEditor = (
   if (!view) return;
   const { from, to } = range;
   const tr = view.state.tr;
-  // Delete the query text (keep the @)
-  tr.delete(from + 1, to);
 
   if (mention.type == "did") {
+    // Delete the query text (keep the @)
+    tr.delete(from + 1, to);
     tr.insertText(mention.handle, from + 1);
     tr.addMark(
       from,
@@ -395,18 +395,18 @@ export const addMentionToEditor = (
     tr.insertText(" ", from + 1 + mention.handle.length);
   }
   if (mention.type === "publication" || mention.type === "post") {
+    // Delete the @ and any query text
+    tr.delete(from, to);
     let name = mention.type == "post" ? mention.title : mention.name;
-    tr.insertText(name, from + 1);
+    tr.insertText(name, from);
     tr.addMark(
       from,
-      from + 1 + name.length,
+      from + name.length,
       schema.marks.atMention.create({ atURI: mention.uri }),
     );
-    tr.insertText(" ", from + 1 + name.length);
+    tr.insertText(" ", from + name.length);
   }
 
-  // Insert the mention text after the @
-
   view.dispatch(tr);
   view.focus();
 };
diff --git a/components/Blocks/TextBlock/schema.ts b/components/Blocks/TextBlock/schema.ts
index 4b199def..3084dc80 100644
--- a/components/Blocks/TextBlock/schema.ts
+++ b/components/Blocks/TextBlock/schema.ts
@@ -144,8 +144,7 @@ let baseSchema = {
               "img",
               {
                 src: `/api/pub_icon?at_uri=${encodeURIComponent(node.attrs.atURI)}`,
-                class:
-                  "inline-block w-4 h-4 rounded-full ml-1 align-text-bottom",
+                class: "inline-block w-5 h-5 rounded-full mr-1 align-text-top",
                 alt: "",
                 width: "16",
                 height: "16",
diff --git a/components/Mention.tsx b/components/Mention.tsx
index 6b61eeb3..0bc1c66a 100644
--- a/components/Mention.tsx
+++ b/components/Mention.tsx
@@ -336,7 +336,7 @@ const ScopeButton = (props: {
 }) => {
   return (
     <span
-      className="flex flex-row shrink-0 text-xs font-normal text-tertiary hover:text-accent-contrast cursor-pointer"
+      className="flex flex-row items-center h-full shrink-0 text-xs font-normal text-tertiary hover:text-accent-contrast cursor-pointer"
       onClick={(e) => {
         e.preventDefault();
         e.stopPropagation();
-- 
2.54.0