From 6f92547a4910421ae1dffb3db89090db42c3cf7b Mon Sep 17 00:00:00 2001 From: Shuki Vaknin Date: Wed, 2 Sep 2026 00:38:40 +0300 Subject: [PATCH] fix(list): centre the sender avatar against the row MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit List rows lay out with items-start, because the sender line, subject and preview stack and the body should govern the row height. The avatar inherited that and pinned itself to the top, level with the sender line, leaving it visibly high against a two- or three-line row. Give the avatar self-center in both the single-message and thread rows. The row keeps items-start, so nothing else moves — in particular the extra-compact checkbox, which is mutually exclusive with the avatar and carries its own mt-2 offset, is untouched. --- components/email/thread-list-item.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/email/thread-list-item.tsx b/components/email/thread-list-item.tsx index 0272fd13c..e9d434381 100644 --- a/components/email/thread-list-item.tsx +++ b/components/email/thread-list-item.tsx @@ -331,7 +331,7 @@ const SingleEmailItem = React.forwardRef( name={sender?.name} email={sender?.email} size={isFocusedMailLayout ? "sm" : "md"} - className="flex-shrink-0 shadow-sm" + className="flex-shrink-0 self-center shadow-sm" disableImages={hideJunkAvatarImages} checked={isChecked} onToggle={handleCheckboxClick} @@ -773,7 +773,7 @@ export const ThreadListItem = React.forwardRef +