From 4556ef4e972b23a2219b07bc0c411816dfd0cc96 Mon Sep 17 00:00:00 2001
From: neodk2004 <barac.daniel@gmail.com>
Date: Sat, 27 Jun 2026 10:12:02 +0200
Subject: [PATCH] fix: mention-dropdown Umrandung passt sich Zweizeiligkeit an;
 neuer Bug Chat-Eingabe-Fix

---
 DEBUG-List.md                          |  2 ++
 src/components/ui/mention-textarea.tsx | 26 ++++++++++++++------------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/DEBUG-List.md b/DEBUG-List.md
index 5ddd521..e20de83 100644
--- a/DEBUG-List.md
+++ b/DEBUG-List.md
@@ -26,5 +26,7 @@ Debug:
 
 
 
+\-Mobilansicht - Chat-Eingabe nicht direkt sichtbar: Innerhalb eines Chats muss man scrollen um zur Texteingabe zu gelangen. Die Eingabeleiste soll fixiert am unteren Bildschirmrand bleiben (sticky/fixed), sodass man ohne Scrollen direkt antworten kann.
+
 \-User Delete Funktion, für den Unwahrscheinlichen fall ein User möchte sein Konto löschen wird ein Workflow benötigt, der nach einer Bestätigung mittels Tiernamen Eingabe (Auswahl eins von möglichen) den Kompletten Account löscht, sowie alle Hochgeladen Bilder/Videos und erzeugten Posts, Rückstandslos.
 
diff --git a/src/components/ui/mention-textarea.tsx b/src/components/ui/mention-textarea.tsx
index 9e7eaf3..ed41b4a 100644
--- a/src/components/ui/mention-textarea.tsx
+++ b/src/components/ui/mention-textarea.tsx
@@ -127,23 +127,25 @@ export function MentionTextarea({
             <button
               key={pet.id}
               type="button"
-              className="w-full flex items-center gap-3 px-3 py-2.5 hover:bg-muted transition-colors text-left"
+              className="w-full block px-3 py-2.5 hover:bg-muted transition-colors text-left"
               onMouseDown={(e) => {
                 e.preventDefault();
                 handleSelect(pet.name);
               }}
             >
-              <Avatar className="h-9 w-9 shrink-0">
-                {pet.avatarKey && (
-                  <AvatarImage src={getAvatarUrl(pet.avatarKey)!} alt={pet.name} />
-                )}
-                <AvatarFallback className="text-xs font-semibold bg-orange-100 text-orange-700">
-                  {pet.name.slice(0, 2).toUpperCase()}
-                </AvatarFallback>
-              </Avatar>
-              <div className="flex-1 min-w-0">
-                <p className="text-sm font-semibold text-foreground truncate">{pet.name}</p>
-                <p className="text-xs text-muted-foreground">{pet.species.name}</p>
+              <div className="flex items-center gap-3">
+                <Avatar className="h-9 w-9 shrink-0">
+                  {pet.avatarKey && (
+                    <AvatarImage src={getAvatarUrl(pet.avatarKey)!} alt={pet.name} />
+                  )}
+                  <AvatarFallback className="text-xs font-semibold bg-orange-100 text-orange-700">
+                    {pet.name.slice(0, 2).toUpperCase()}
+                  </AvatarFallback>
+                </Avatar>
+                <div className="flex-1 min-w-0">
+                  <p className="text-sm font-semibold text-foreground truncate">{pet.name}</p>
+                  <p className="text-xs text-muted-foreground">{pet.species.name}</p>
+                </div>
               </div>
             </button>
           ))}