diff --git a/src/assets/default/send-message.svg b/src/assets/default/send-message.svg
index 65db90d7..ca176b2b 100644
--- a/src/assets/default/send-message.svg
+++ b/src/assets/default/send-message.svg
@@ -1,4 +1,4 @@
diff --git a/src/pages/Chats/ChatRoom/ChatBox/index.tsx b/src/pages/Chats/ChatRoom/ChatBox/index.tsx
index 95b85d7d..8931cc03 100644
--- a/src/pages/Chats/ChatRoom/ChatBox/index.tsx
+++ b/src/pages/Chats/ChatRoom/ChatBox/index.tsx
@@ -7,6 +7,8 @@ import { useSocket } from '@context/SocketProvider';
import { OtherUserAtom } from '@recoil/util/OtherUser';
import { getCurrentUserId } from '@utils/getCurrentUserId';
+import SendIcon from '@assets/default/send-message.svg';
+
import { ChatBoxContainer, Textarea, SendButton } from './styles';
const ChatBox: React.FC = () => {
@@ -75,7 +77,9 @@ const ChatBox: React.FC = () => {
onKeyDown={handleEnterKeyDown}
onSubmit={handleNewMessageSubmit}
/>
-
+
+
+
);
};
diff --git a/src/pages/Chats/ChatRoom/ChatBox/styles.tsx b/src/pages/Chats/ChatRoom/ChatBox/styles.tsx
index 82fd9c43..d0c1f961 100644
--- a/src/pages/Chats/ChatRoom/ChatBox/styles.tsx
+++ b/src/pages/Chats/ChatRoom/ChatBox/styles.tsx
@@ -1,7 +1,5 @@
import { styled } from 'styled-components';
-import SendIcon from '@assets/default/send-message.svg';
-
export const ChatBoxContainer = styled.div`
${({ theme }) => theme.breakPoints};
position: fixed;
@@ -14,7 +12,7 @@ export const ChatBoxContainer = styled.div`
padding: 0.5rem 1.12rem;
background-color: ${({ theme }) => theme.colors.background.primary};
gap: 0.5rem;
- border-top: 1px solid ${({ theme }) => theme.colors.gray[300]};
+ /* border-top: 1px solid ${({ theme }) => theme.colors.gray[300]}; */
align-items: center;
`;
@@ -39,12 +37,9 @@ export const Textarea = styled.textarea<{ $isOtherUserValid: boolean }>`
`;
export const SendButton = styled.button<{ $isOtherUserValid: boolean }>`
- padding: 1.12rem;
+ width: 2rem;
+ height: 2rem;
border-radius: 50%;
- background-color: ${({ theme }) => theme.colors.brand.primaryLight};
- background-image: url(${SendIcon});
- background-repeat: no-repeat;
- background-position: center;
- background-size: 1.2rem 1.2rem;
+ /* background-color: ${({ theme }) => theme.colors.brand.primaryLight}; */
cursor: ${({ $isOtherUserValid }) => ($isOtherUserValid ? 'pointer' : '')};
`;
diff --git a/src/pages/Chats/ChatRoom/RcvdMessage/styles.tsx b/src/pages/Chats/ChatRoom/RcvdMessage/styles.tsx
index e6b4d31a..1c659f2b 100644
--- a/src/pages/Chats/ChatRoom/RcvdMessage/styles.tsx
+++ b/src/pages/Chats/ChatRoom/RcvdMessage/styles.tsx
@@ -10,7 +10,7 @@ export const FirstMessageLayout = styled.div<{ $isSenderChanged: boolean }>`
export const MessageLayout = styled.div`
display: flex;
- margin: 0 auto 0.5rem 2.938rem;
+ margin: 0 auto 0.5rem 2rem;
`;
export const UserImage = styled.img`