tagg indicator and main container alignment

1 files changed, 6 insertions, 20 deletions

diff --git a/src/screens/chat/ChatScreen.tsx b/src/screens/chat/ChatScreen.tsx
index ae95cd62..c88e8690 100644
--- a/src/screens/chat/ChatScreen.tsx
+++ b/src/screens/chat/ChatScreen.tsx
@@ -16,7 +16,7 @@ import {ChatContext} from '../../App';
 import {ChatHeader, ChatInput, TabsGradient} from '../../components';
 import {MainStackParams} from '../../routes';
 import {ScreenType} from '../../types';
-import {HeaderHeight, isIPhoneX} from '../../utils';
+import {HeaderHeight, isIPhoneX, SCREEN_WIDTH} from '../../utils';
 
 type ChatScreenNavigationProp = StackNavigationProp<MainStackParams, 'Chat'>;
 interface ChatScreenProps {
@@ -35,6 +35,8 @@ const ChatScreen: React.FC<ChatScreenProps> = () => {
     messageList: {
       container: {
         backgroundColor: 'white',
+        width: SCREEN_WIDTH * 0.9,
+        alignSelf: 'center',
       },
     },
     messageInput: {
@@ -55,22 +57,17 @@ const ChatScreen: React.FC<ChatScreenProps> = () => {
         container: {
           height: '100%',
           top: -8,
-          right: -25,
           zIndex: 1,
         },
       },
       container: {
         paddingTop: 8,
+        flexDirection: 'row',
       },
-      card: {
+      content: {
         container: {
-          backgroundColor: 'lightgreen',
-          borderWidth: 2,
-          borderColor: 'black',
+          left: -25,
         },
-      },
-      content: {
-        container: {},
         containerInner: {
           backgroundColor: '#E4F0F2',
           borderColor: 'transparent',
@@ -156,17 +153,6 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     alignItems: 'center',
   },
-  typingIndicatorContainer: {
-    backgroundColor: '#E4F0F2',
-    width: 88,
-    height: 32,
-    borderRadius: 10,
-    marginBottom: 10,
-    marginLeft: 10,
-    flexDirection: 'row',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
 });
 
 export default ChatScreen;