Text tweaks (e.g. line height)

src/components/cards/partials/rows/CommentRow.tsx

@@ -51,7 +51,7 @@ const CommentRow: SFC<IProps> = ({
         >
           <Text
             numberOfLines={numberOfLines}
-            style={[cardStyles.normalText, isRead && cardStyles.mutedText]}
+            style={[cardStyles.commentText, isRead && cardStyles.mutedText]}
           >
             {body}
           </Text>

src/components/cards/partials/rows/styles.ts

@@ -15,12 +15,11 @@ export default StyleSheet.create({
   } as ViewStyle,
 
   mainContentContainer: {
-    alignItems: 'center',
     borderColor: theme.base01,
     // borderRadius: radius,
     // borderWidth: 1,
     flex: 1,
-    flexDirection: 'row',
+    justifyContent: 'center',
     // paddingHorizontal: contentPadding,
     // paddingVertical: contentPadding / 2,
   } as ViewStyle,

src/components/cards/styles.ts

@@ -42,6 +42,7 @@ export default StyleSheet.create({
     alignSelf: 'center',
     color: theme.base05,
     fontSize: smallTextSize,
+    lineHeight: smallTextSize + 4,
   } as TextStyle,
 
   mutedText: {
@@ -50,14 +51,23 @@ export default StyleSheet.create({
 
   normalText: {
     color: theme.base04,
+    lineHeight: 20,
   } as TextStyle,
 
   smallText: {
     fontSize: smallTextSize,
+    lineHeight: smallTextSize + 4,
   } as TextStyle,
 
   descriptionText: {
     color: theme.base05,
     lineHeight: 20,
   } as TextStyle,
+
+  commentText: {
+    color: theme.base04,
+    // flex: 1,
+    lineHeight: 20,
+    // textAlign: 'justify',
+  } as TextStyle,
 })