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

styles/containers.js

@@ -1,13 +1,6 @@
 import Colors from './colors'
-import Spacing from './spacing'
 
 export default {
-  bottomBorder: {
-    borderStyle: 'solid',
-    borderBottomWidth: 2,
-    borderBottomColor: Colors.grey,
-    paddingBottom: Spacing.base
-  },
   centerItems: {
     alignItems: 'center',
     flex: 1,
@@ -19,7 +12,6 @@ export default {
     borderStyle: 'solid',
     borderWidth: 1,
   },
-  marginBottom: { marginBottom: Spacing.base },
   orangeButton: {
     backgroundColor: Colors.orange,
     borderRadius: 25
@@ -27,6 +19,5 @@ export default {
   page: {
     backgroundColor: Colors.tourquiseLight,
     flex: 1
-  },
-  segmentContainer: { marginHorizontal: Spacing.base }
+  }
 }

styles/redesign.js

@@ -1,5 +1,6 @@
 import Colors from './colors'
 import Containers from './containers'
-import Typography from './typography'
+import Spacing from './spacing'
+import Typography, { sizes as Sizes } from './typography'
 
-export { Colors, Containers, Typography }
+export { Colors, Containers, Spacing, Sizes, Typography }

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' }
 }