Merge pull request #242 from ankit-thanekar007/tma-634-badge-selection-screen

Badge Screen UI Changes

1 files changed, 42 insertions, 0 deletions

diff --git a/src/screens/badge/BadgeScreenHeader.tsx b/src/screens/badge/BadgeScreenHeader.tsx
new file mode 100644
index 00000000..fd250585
--- /dev/null
+++ b/src/screens/badge/BadgeScreenHeader.tsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import {Image, StyleSheet, Text, View} from 'react-native';
+import {normalize} from '../../utils';
+
+const BadgeScreenHeader: React.FC = () => {
+  return (
+    <View style={styles.container}>
+      <Image source={require('../../assets/images/badges/brown_badge.png')} />
+      <View style={styles.universityTextContainer}>
+        <Text style={styles.universityText}>Brown University Badges</Text>
+      </View>
+      <View style={styles.searchTextContainer}>
+        <Text style={styles.searchText}>
+          Search for organizations you are a part of!
+        </Text>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    marginBottom: '1%',
+  },
+  universityTextContainer: {marginTop: 12},
+  universityText: {
+    fontSize: normalize(20),
+    fontWeight: '700',
+    lineHeight: normalize(23.87),
+    color: 'white',
+  },
+  searchTextContainer: {marginTop: 6},
+  searchText: {
+    fontSize: normalize(15),
+    fontWeight: '500',
+    lineHeight: normalize(17.9),
+    color: 'white',
+  },
+});
+
+export default BadgeScreenHeader;