Merge pull request #2671 from oxen-io/clearnet

fix: avatar alignement issue with message
oxen-io · Feb 9, 2023 · 3e5ae3b · 3e5ae3b
2 parents 102d79b + 51f7ad7
commit 3e5ae3b
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 1 deletion.
diff --git a/ts/components/conversation/message/message-content/MessageAvatar.tsx b/ts/components/conversation/message/message-content/MessageAvatar.tsx
@@ -20,7 +20,7 @@ import { Avatar, AvatarSize, CrownIcon } from '../../../avatar/Avatar';
 const StyledAvatar = styled.div`
   position: relative;
   margin-inline-end: 20px;
-  padding-top: 5px;
+  padding-bottom: 6px;
   padding-inline-end: 4px;
 `;
 

diff --git a/ts/components/conversation/message/message-content/MessageContentWithStatus.tsx b/ts/components/conversation/message/message-content/MessageContentWithStatus.tsx
@@ -46,6 +46,8 @@ const StyledMessageContentContainer = styled.div<{ direction: 'left' | 'right' }
 
 const StyledMessageWithAuthor = styled.div<{ isIncoming: boolean }>`
   max-width: ${props => (props.isIncoming ? '100%' : 'calc(100% - 17px)')};
+  display: flex;
+  flex-direction: column;
 `;
 
 export const MessageContentWithStatuses = (props: Props) => {