Adjust caption container

1 files changed, 14 insertions, 6 deletions

diff --git a/src/screens/profile/CaptionScreen.tsx b/src/screens/profile/CaptionScreen.tsx
index 280319b4..aa866f56 100644
--- a/src/screens/profile/CaptionScreen.tsx
+++ b/src/screens/profile/CaptionScreen.tsx
@@ -71,7 +71,6 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
   const [tags, setTags] = useState<MomentTagType[]>([]);
   const [taggedUsersText, setTaggedUsersText] = useState('');
   const [momentCategory, setMomentCategory] = useState<string | undefined>();
-  // const [momentCategory, setMomentCategory] = useState<string | undefined>();
   const mediaUri = moment ? moment.moment_url : route.params.media!.uri;
   // TODO: change this once moment refactor is done
   const isMediaAVideo = moment
@@ -288,12 +287,13 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
                 />
               )}
               <MentionInputControlled
-                containerStyle={styles.text}
+                style={styles.text}
+                containerStyle={styles.textContainer}
                 placeholder="Write something....."
-                placeholderTextColor="gray"
+                placeholderTextColor="white"
                 value={caption}
                 onChange={setCaption}
-                partTypes={mentionPartTypes('blue', 'caption')}
+                partTypes={mentionPartTypes('white', 'caption')}
               />
             </View>
             <SelectableItem
@@ -343,20 +343,28 @@ const styles = StyleSheet.create({
     marginBottom: 30,
   },
   captionContainer: {
-    backgroundColor: 'white',
     flexDirection: 'row',
     padding: normalize(15),
     marginBottom: normalize(35),
+    borderColor: 'white',
+    borderTopWidth: 1,
+    borderBottomWidth: 1,
   },
   media: {
     height: normalize(150),
     aspectRatio: 9 / 16,
   },
   text: {
-    backgroundColor: 'white',
+    color: 'white',
+    fontSize: normalize(12),
+    lineHeight: 14,
+    fontWeight: '500',
+  },
+  textContainer: {
     flex: 1,
     height: normalize(150),
     marginLeft: normalize(15),
+    color: 'white',
   },
   flex: {
     flex: 1,