5 files changed, 36 insertions, 105 deletions
diff --git a/src/screens/main/Home.tsx b/src/screens/main/Home.tsx
index cd2c418a..86f9b2ba 100644
--- a/src/screens/main/Home.tsx
+++ b/src/screens/main/Home.tsx
@@ -1,35 +1,24 @@
 import React from 'react';
-import {RootStackParamList} from '../../routes';
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import {Background} from '../../components';
 import {Text} from 'react-native-animatable';
 import {StyleSheet} from 'react-native';
-
-type HomeScreenRouteProp = RouteProp<RootStackParamList, 'Home'>;
-type HomeScreenNavigationProp = StackNavigationProp<RootStackParamList, 'Home'>;
-interface HomeProps {
-  route: HomeScreenRouteProp;
-  navigation: HomeScreenNavigationProp;
-}
+import {GradientBackground} from '../../components';
 
 /**
  * Home Screen for displaying Tagg post suggestions
  * for users to discover and browse
  */
 
-const Home: React.FC<HomeProps> = () => {
+const Home: React.FC = () => {
   return (
-    <Background centered style={styles.container}>
-      <Text> Tagg Home Screen 🏠 </Text>
-    </Background>
+    <GradientBackground>
+      <Text style={styles.text}> Tagg Home Screen 🏠 </Text>
+    </GradientBackground>
   );
 };
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
+  text: {
     justifyContent: 'center',
-    alignItems: 'center',
+    backgroundColor: 'transparent',
   },
 });
 export default Home;
diff --git a/src/screens/main/Notifications.tsx b/src/screens/main/Notifications.tsx
index ec881c8e..db89d7f9 100644
--- a/src/screens/main/Notifications.tsx
+++ b/src/screens/main/Notifications.tsx
@@ -1,41 +1,24 @@
 import React from 'react';
-import {RootStackParamList} from '../../routes';
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import {Background} from '../../components';
 import {Text} from 'react-native-animatable';
 import {StyleSheet} from 'react-native';
-
-type NotificationsScreenRouteProp = RouteProp<
-  RootStackParamList,
-  'Notifications'
->;
-type NotificationsScreenNavigationProp = StackNavigationProp<
-  RootStackParamList,
-  'Notifications'
->;
-interface NotificationsProps {
-  route: NotificationsScreenRouteProp;
-  navigation: NotificationsScreenNavigationProp;
-}
+import {GradientBackground} from '../../components';
 
 /**
  * Navigation Screen for displaying other users'
  * actions on the logged in user's posts
  */
 
-const Notifications: React.FC<NotificationsProps> = () => {
+const Notifications: React.FC = () => {
   return (
-    <Background centered style={styles.container}>
-      <Text> Notifications will go here 🔔 </Text>
-    </Background>
+    <GradientBackground>
+      <Text style={styles.text}> Notifications will go here 🔔 </Text>
+    </GradientBackground>
   );
 };
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
+  text: {
     justifyContent: 'center',
-    alignItems: 'center',
+    backgroundColor: 'transparent',
   },
 });
 export default Notifications;
diff --git a/src/screens/main/Profile.tsx b/src/screens/main/Profile.tsx
index a40a9cef..3a6536e4 100644
--- a/src/screens/main/Profile.tsx
+++ b/src/screens/main/Profile.tsx
@@ -1,38 +1,24 @@
 import React from 'react';
-import {RootStackParamList} from '../../routes';
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import {Background} from '../../components';
 import {Text} from 'react-native-animatable';
 import {StyleSheet} from 'react-native';
-
-type ProfileScreenRouteProp = RouteProp<RootStackParamList, 'Home'>;
-type ProfileScreenNavigationProp = StackNavigationProp<
-  RootStackParamList,
-  'Profile'
->;
-interface ProfileProps {
-  route: ProfileScreenRouteProp;
-  navigation: ProfileScreenNavigationProp;
-}
+import {GradientBackground} from '../../components';
 
 /**
  * Profile Screen for a user's logged in profile
  * including posts, messaging, and settings
  */
 
-const Profile: React.FC<ProfileProps> = () => {
+const Profile: React.FC = () => {
   return (
-    <Background centered style={styles.container}>
-      <Text> Profile Screen 🤩 </Text>
-    </Background>
+    <GradientBackground>
+      <Text style={styles.text}> Profile Screen 🤩 </Text>
+    </GradientBackground>
   );
 };
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
+  text: {
     justifyContent: 'center',
-    alignItems: 'center',
+    backgroundColor: 'transparent',
   },
 });
 export default Profile;
diff --git a/src/screens/main/Search.tsx b/src/screens/main/Search.tsx
index caa5d205..19e35d04 100644
--- a/src/screens/main/Search.tsx
+++ b/src/screens/main/Search.tsx
@@ -1,38 +1,24 @@
 import React from 'react';
-import {RootStackParamList} from '../../routes';
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import {Background} from '../../components';
 import {Text} from 'react-native-animatable';
 import {StyleSheet} from 'react-native';
-
-type SearchScreenRouteProp = RouteProp<RootStackParamList, 'Search'>;
-type SearchScreenNavigationProp = StackNavigationProp<
-  RootStackParamList,
-  'Search'
->;
-interface SearchProps {
-  route: SearchScreenRouteProp;
-  navigation: SearchScreenNavigationProp;
-}
+import {GradientBackground} from '../../components';
 
 /**
  * Search Screen for user recommendations and a search
  * tool to allow user to find other users
  */
 
-const Search: React.FC<SearchProps> = () => {
+const Search: React.FC = () => {
   return (
-    <Background centered style={styles.container}>
-      <Text> Search for people here 👀 </Text>
-    </Background>
+    <GradientBackground>
+      <Text style={styles.text}> Search for people here 👀 </Text>
+    </GradientBackground>
   );
 };
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
+  text: {
     justifyContent: 'center',
-    alignItems: 'center',
+    backgroundColor: 'transparent',
   },
 });
 export default Search;
diff --git a/src/screens/main/Upload.tsx b/src/screens/main/Upload.tsx
index 4bbe2d0a..d91af1f5 100644
--- a/src/screens/main/Upload.tsx
+++ b/src/screens/main/Upload.tsx
@@ -1,37 +1,24 @@
 import React from 'react';
-import {RootStackParamList} from '../../routes';
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import {Background} from '../../components';
 import {Text} from 'react-native-animatable';
 import {StyleSheet} from 'react-native';
-
-type UploadScreenRouteProp = RouteProp<RootStackParamList, 'Upload'>;
-type UploadScreenNavigationProp = StackNavigationProp<
-  RootStackParamList,
-  'Upload'
->;
-interface UploadProps {
-  route: UploadScreenRouteProp;
-  navigation: UploadScreenNavigationProp;
-}
+import {GradientBackground} from '../../components';
 
 /**
  * Upload Screen to allow users to upload posts to Tagg
  */
 
-const Upload: React.FC<UploadProps> = () => {
+const Upload: React.FC = () => {
   return (
-    <Background centered style={styles.container}>
-      <Text> Upload pics ⬆ </Text>
-    </Background>
+    <GradientBackground>
+      <Text style={styles.text}> Upload pics ⬆ </Text>
+    </GradientBackground>
   );
 };
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
+  text: {
     justifyContent: 'center',
-    alignItems: 'center',
+    backgroundColor: 'transparent',
   },
 });
+
 export default Upload;