1 files changed, 27 insertions, 31 deletions
diff --git a/src/components/moments/IndividualMomentTitleBar.tsx b/src/components/moments/IndividualMomentTitleBar.tsx
index 4ae9471f..c6bf1423 100644
--- a/src/components/moments/IndividualMomentTitleBar.tsx
+++ b/src/components/moments/IndividualMomentTitleBar.tsx
@@ -1,45 +1,32 @@
 import React from 'react';
-import {
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  View,
-  ViewProps,
-} from 'react-native';
-import CloseIcon from '../../assets/ionicons/close-outline.svg';
-import {normalize} from '../../utils';
+import {StyleSheet, Text, View, ViewProps} from 'react-native';
+import {normalize, SCREEN_WIDTH} from '../../utils';
 
 interface IndividualMomentTitleBarProps extends ViewProps {
   title: string;
-  close: () => void;
 }
 const IndividualMomentTitleBar: React.FC<IndividualMomentTitleBarProps> = ({
   title,
-  close,
-  style,
 }) => {
   return (
-    <View style={[styles.container, style]}>
-      <TouchableOpacity style={styles.closeButton} onPress={close}>
-        <CloseIcon height={'100%'} width={'100%'} color={'white'} />
-      </TouchableOpacity>
-      <View style={styles.headerContainer}>
-        <Text style={styles.header}>{title}</Text>
+    <View style={styles.mainContainer}>
+      <View style={styles.titleContainer}>
+        <Text
+          style={[
+            styles.title,
+            {
+              fontSize: title.length > 18 ? normalize(14) : normalize(16),
+            },
+          ]}>
+          {title}
+        </Text>
       </View>
     </View>
   );
 };
 
 const styles = StyleSheet.create({
-  container: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'flex-start',
-  },
-  headerContainer: {
-    width: '80%',
-  },
-  header: {
+  title: {
     textAlign: 'center',
     color: 'white',
     fontSize: normalize(18),
@@ -47,10 +34,19 @@ const styles = StyleSheet.create({
     lineHeight: normalize(21.48),
     letterSpacing: normalize(1.3),
   },
-  closeButton: {
-    height: '50%',
-    aspectRatio: 1,
-    left: '8%',
+  titleContainer: {
+    width: '80%',
+    position: 'absolute',
+    left: '10%',
+    right: '10%',
+    height: normalize(70),
+  },
+  mainContainer: {
+    flex: 1,
+    width: SCREEN_WIDTH * 0.6,
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    marginVertical: '2%',
   },
 });