Moves unique styles of Segment component from common files to local one

styles/typography.js

@@ -6,12 +6,10 @@ const fonts = {
   bold : 'Jost-700-Bold',
 }
 
-const sizes = {
-  mainMedium: 18,
-  mainLarge: 20,
-  titleSmall: 22,
-  titleMedium: 24,
-  titleLarge: 28
+export const sizes = {
+  base: 18,
+  subtitle: 22,
+  title: 24
 }
 
 const button = {
@@ -20,12 +18,6 @@ const button = {
   textTransform: 'uppercase'
 }
 
-const title = {
-  color: Colors.purple,
-  marginHorizontal: Spacing.base,
-  marginVertical: Spacing.large
-}
-
 export default {
   buttonTextBold: {
     fontFamily: fonts.bold,
@@ -37,18 +29,18 @@ export default {
   },
   mainText: {
     fontFamily: fonts.main,
-    fontSize: sizes.mainMedium
+    fontSize: sizes.base
   },
   pageTitle: {
     alignSelf: 'center',
     fontFamily: fonts.bold,
     fontWeight: '700',
-    fontSize: sizes.titleMedium,
-    ...title
+    fontSize: sizes.title,
+    marginHorizontal: Spacing.base,
   },
-  titleSmall: {
-    fontSize: sizes.titleSmall,
-    ...title
+  title: {
+    color: Colors.purple,
+    marginVertical: Spacing.large
   },
   underline: { textDecorationLine: 'underline' }
 }