Moves unique styles of AppPage component to local file

components/common/app-page.js

@@ -4,7 +4,7 @@ import { ScrollView, StyleSheet } from 'react-native'
 
 import AppText from '../common/app-text'
 
-import { Containers, Typography } from '../../styles/redesign'
+import { Colors, Fonts, Sizes, Spacing, Typography } from '../../styles/redesign'
 
 const AppPage = ({ children, title }) => {
   return(
@@ -22,10 +22,16 @@ AppPage.propTypes = {
 
 const styles = StyleSheet.create({
   container: {
-    ...Containers.page
+    backgroundColor: Colors.tourquiseLight,
+    flex: 1
   },
   title: {
-    ...Typography.pageTitle
+    alignSelf: 'center',
+    fontFamily: Fonts.bold,
+    fontWeight: '700',
+    fontSize: Sizes.title,
+    marginHorizontal: Spacing.base,
+    ...Typography.title
   }
 })
 

styles/containers.js

-import Colors from './colors'
-
 export default {
   centerItems: {
     alignItems: 'center',
     flex: 1,
     justifyContent: 'center'
-  },
-  page: {
-    backgroundColor: Colors.tourquiseLight,
-    flex: 1
   }
 }
\ No newline at end of file

styles/typography.js

@@ -17,13 +17,6 @@ export default {
     fontFamily: fonts.main,
     fontSize: sizes.base
   },
-  pageTitle: {
-    alignSelf: 'center',
-    fontFamily: fonts.bold,
-    fontWeight: '700',
-    fontSize: sizes.title,
-    marginHorizontal: Spacing.base,
-  },
   title: {
     color: Colors.purple,
     marginVertical: Spacing.large