Introduces License and About components redesign

styles/colors.js

@@ -1,4 +1,5 @@
 export default {
+  greenSuperLight: '#E9F2ED',
   grey: '#A5A5A5',
   greyLight: '#D2D2D2',
   greySuperLight: '#F2F2F2',

styles/containers.js

@@ -5,7 +5,7 @@ export default {
   bottomBorder: {
     borderStyle: 'solid',
     borderBottomWidth: 2,
-    borderBottomColor: Colors.greySuperLight,
+    borderBottomColor: Colors.greyLight,
     paddingBottom: Spacing.base
   },
   centerItems: {
@@ -24,5 +24,9 @@ export default {
     backgroundColor: Colors.orange,
     borderRadius: 25
   },
+  page: {
+    backgroundColor: Colors.greenSuperLight,
+    flex: 1
+  },
   segmentContainer: { marginHorizontal: Spacing.base }
 }

styles/typography.js

@@ -20,6 +20,12 @@ const button = {
   textTransform: 'uppercase'
 }
 
+const title = {
+  color: Colors.purple,
+  marginHorizontal: Spacing.base,
+  marginVertical: Spacing.large
+}
+
 export default {
   buttonTextBold: {
     fontFamily: fonts.bold,
@@ -33,10 +39,16 @@ export default {
     fontFamily: fonts.main,
     fontSize: sizes.mainMedium
   },
+  pageTitle: {
+    alignSelf: 'center',
+    fontFamily: fonts.bold,
+    fontWeight: '700',
+    fontSize: sizes.titleMedium,
+    ...title
+  },
   titleSmall: {
-    color: Colors.purple,
     fontSize: sizes.titleSmall,
-    marginVertical: Spacing.base
+    ...title
   },
   underline: { textDecorationLine: 'underline' }
 }