[TMA-186] Instagram Taggs - Frontend (#45)

* Renamed Moments(Bar) to Taggs(Bar)

* created initial navigation and empty social media taggs screen

* made more progress for the header styling

* Finished social media taggs screen, organized code structure

* linted stuff D:

* moved bar height utility function to utils

* moved color constants to constants

* moved avatar title

* updated comments for social media taggs

* NOW the file is there

1 files changed, 65 insertions, 0 deletions

diff --git a/src/components/taggs/TaggPostFooter.tsx b/src/components/taggs/TaggPostFooter.tsx
new file mode 100644
index 00000000..024670a8
--- /dev/null
+++ b/src/components/taggs/TaggPostFooter.tsx
@@ -0,0 +1,65 @@
+import React from 'react';
+import {StyleSheet, View} from 'react-native';
+import {Text} from 'react-native-animatable';
+
+interface TaggPostFooterProps {
+  likes: number;
+  handle: string;
+  caption: string;
+  date: string;
+}
+const TaggPostFooter: React.FC<TaggPostFooterProps> = ({
+  likes,
+  handle,
+  caption,
+  date,
+}) => {
+  return (
+    <View>
+      <View style={styles.container}>
+        <Text style={styles.likeText}>{likes} likes</Text>
+        <View style={styles.captionContainer}>
+          <Text style={styles.handleText}>
+            {handle}
+            <Text style={styles.captionText}> {caption}</Text>
+          </Text>
+        </View>
+        <Text style={styles.dateText}>{date}</Text>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'column',
+    padding: 10,
+    paddingBottom: '10%',
+  },
+  captionContainer: {
+    paddingVertical: 10,
+  },
+  likeText: {
+    fontSize: 14,
+    fontWeight: 'bold',
+    color: 'white',
+  },
+  handleText: {
+    fontSize: 14,
+    fontWeight: 'bold',
+    color: '#8FA9C2',
+  },
+  captionText: {
+    fontSize: 14,
+    fontWeight: 'bold',
+    color: 'white',
+    flexWrap: 'wrap',
+  },
+  dateText: {
+    fontSize: 14,
+    fontWeight: 'bold',
+    color: '#8FA9C2',
+  },
+});
+
+export default TaggPostFooter;