From 4edcaf03ae6e41ba9eb11a381540db4692375463 Mon Sep 17 00:00:00 2001
From: Ivan Chen <ivan@tagg.id>
Date: Fri, 2 Apr 2021 16:06:20 -0400
Subject: added initial styling

---
 src/components/index.ts                    |  1 +
 src/components/messages/MessagesHeader.tsx | 51 ++++++++++++++++++++++++++++++
 src/components/messages/index.ts           |  1 +
 3 files changed, 53 insertions(+)
 create mode 100644 src/components/messages/MessagesHeader.tsx
 create mode 100644 src/components/messages/index.ts

(limited to 'src/components')

diff --git a/src/components/index.ts b/src/components/index.ts
index d5649323..47dc583b 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -6,3 +6,4 @@ export * from './taggs';
 export * from './comments';
 export * from './moments';
 export * from './suggestedPeople';
+export * from './messages';
diff --git a/src/components/messages/MessagesHeader.tsx b/src/components/messages/MessagesHeader.tsx
new file mode 100644
index 00000000..47a84bf3
--- /dev/null
+++ b/src/components/messages/MessagesHeader.tsx
@@ -0,0 +1,51 @@
+import * as React from 'react';
+import {Alert, StyleSheet, View} from 'react-native';
+import {Text} from 'react-native-animatable';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import {normalize} from '../../utils';
+
+type MessagesHeaderProps = {};
+
+const MessagesHeader: React.FC<MessagesHeaderProps> = () => {
+  return (
+    <View style={styles.header}>
+      <Text style={styles.headerText}>Messages</Text>
+      <Text style={styles.unreadText}>2 unread</Text>
+      <View style={styles.flex} />
+      <TouchableOpacity
+        style={styles.compose}
+        onPress={() => {
+          Alert.alert('hi');
+        }}>
+        <Text>Compose</Text>
+      </TouchableOpacity>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  flex: {
+    flex: 1,
+  },
+  header: {
+    marginHorizontal: '8%',
+    marginTop: '5%',
+    alignItems: 'center',
+    flexDirection: 'row',
+  },
+  headerText: {
+    fontWeight: '700',
+    fontSize: normalize(18),
+    lineHeight: normalize(21),
+  },
+  unreadText: {
+    color: '#8F01FF',
+    marginLeft: 10,
+    fontWeight: '700',
+    lineHeight: normalize(17),
+    fontSize: normalize(14),
+  },
+  compose: {},
+});
+
+export default MessagesHeader;
diff --git a/src/components/messages/index.ts b/src/components/messages/index.ts
new file mode 100644
index 00000000..2d6bb581
--- /dev/null
+++ b/src/components/messages/index.ts
@@ -0,0 +1 @@
+export {default as MessagesHeader} from './MessagesHeader';
-- 
cgit v1.2.3-70-g09d2