TootBottomSheet: scrollIntoView exactly once

src/timelines/TootBottomSheet.tsx

@@ -80,11 +80,12 @@ const TootBottomSheet: Component = (props) => {
 
   const toot = () => remoteToot() ?? getCache(acctText(), params.id);
 
-  createEffect(() => {
+  createEffect((lastTootId?: string) => {
     const tootId = toot()?.id;
-    if (!tootId) return;
+    if (!tootId || lastTootId === tootId) return tootId;
     const elementId = `toot-${tootId}`;
     document.getElementById(elementId)?.scrollIntoView({ behavior: "smooth" });
+    return tootId;
   });
 
   const [tootContext] = createResource(
@@ -109,7 +110,7 @@ const TootBottomSheet: Component = (props) => {
       const name = resolveCustomEmoji(t.account.displayName, t.account.emojis);
       return `${name}'s toot`;
     }
-    return "A toot";
+    return "Someone's toot";
   };
 
   const actSession = () => {

src/timelines/toot.module.css

@@ -193,6 +193,8 @@
   gap: 8px;
   align-items: center;
   margin-bottom: 8px;
+  flex-flow: row wrap;
+  justify-content: flex-end;
 
   >.compactAuthorUsername {
     color: var(--tutu-color-secondary-text-on-surface);