Fix message item sizing and padding

juiceo · Apr 16, 2023 · 28a332b · 28a332b
1 parent a9d8d22
commit 28a332b
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 3 deletions.
diff --git a/src/components/MessagesList/ExpenseItem.tsx b/src/components/MessagesList/ExpenseItem.tsx
@@ -42,7 +42,6 @@ const ExpenseItem = (props: Props) => {
 					alignSelf="stretch"
 					overflow="hidden"
 					position="relative"
-					pt={4}
 				>
 					{!!expense.image && (
 						<Box mb="2" background="black">
@@ -62,7 +61,7 @@ const ExpenseItem = (props: Props) => {
 					>
 						{moment(expense.createdAt).format('HH:mm')}
 					</Text>
-					<Box p="6" pt={0} alignItems="center" justifyContent="center" display="flex" flexDirection="column">
+					<Box p="6" pt={4} alignItems="center" justifyContent="center" display="flex" flexDirection="column">
 						<Text fontSize="xs" align="center" color="whiteAlpha.900">
 							<Box m={2} alignItems="center" display="flex" flexDir="column">
 								<Avatar my={1} size="sm" src={payer?.image ?? ''} />

diff --git a/src/components/MessagesList/MessageItem.tsx b/src/components/MessagesList/MessageItem.tsx
@@ -27,7 +27,7 @@ const MessageItem = (props: Props) => {
 					{!hideName && <Text fontSize="xs">{getUserDisplayName(sender, 'short')}</Text>}
 					<Stack
 						direction="row"
-						maxWidth="300px"
+						maxWidth="100%"
 						flex={0}
 						alignItems="flex-end"
 						justifyContent="space-between"