[PAY-1489] Add more space to reacted to messages (#3615)

AudiusProject · Jun 16, 2023 · 99106b3 · 99106b3
1 parent e16f114
commit 99106b3
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.../audius-client/packages/web/src/pages/chat-page/components/ChatMessageListItem.module.css b/.../audius-client/packages/web/src/pages/chat-page/components/ChatMessageListItem.module.css
@@ -9,6 +9,10 @@
   align-items: flex-end;
 }
 
+.root.hasReaction {
+  margin-bottom: var(--unit-2);
+}
+
 .bubble {
   --bubble-color: var(--white);
   position: relative;

diff --git a/apps/audius-client/packages/web/src/pages/chat-page/components/ChatMessageListItem.tsx b/apps/audius-client/packages/web/src/pages/chat-page/components/ChatMessageListItem.tsx
@@ -181,7 +181,8 @@ export const ChatMessageListItem = (props: ChatMessageListItemProps) => {
   return (
     <div
       className={cn(styles.root, {
-        [styles.isAuthor]: isAuthor
+        [styles.isAuthor]: isAuthor,
+        [styles.hasReaction]: !hasTail && message.reactions?.length > 0
       })}
     >
       <div