Changed font sizes for more readibility

src/components/Stream.js

@@ -79,13 +79,7 @@ function Stream({ stream, nickname }) {
         onRequestClose={() => setShowStreamInteractBanner(false)}
       >
         <Box p={1}>
-          <Text
-            as="p"
-            variant="body2"
-            sx={{
-              fontSize: "12px",
-            }}
-          >
+          <Text as="p" variant="body2">
             {nickname} has started streaming. Click
             {
               <IconButton

src/routes/About.js

@@ -24,7 +24,7 @@ function About() {
         <Text my={2} variant="heading" as="h1" sx={{ fontSize: 5 }}>
           About
         </Text>
-        <Text my={1} mt={2} variant="heading" as="h3">
+        <Text my={1} mt={2} variant="heading" as="h3" sx={{ fontSize: 3 }}>
           The Goal
         </Text>
         <Text variant="body2" as="p">
@@ -32,7 +32,7 @@ function About() {
           encounters without the complicated setup process needed for other
           VTTs.
         </Text>
-        <Text my={1} mt={2} variant="heading" as="h3">
+        <Text my={1} mt={2} variant="heading" as="h3" sx={{ fontSize: 3 }}>
           The People
         </Text>
         <Text variant="body2" as="p">
@@ -42,7 +42,7 @@ function About() {
           for an easy way to continue their d{"&"}d campaign as in person
           interaction becomes harder.
         </Text>
-        <Text my={1} mt={2} variant="heading" as="h3">
+        <Text my={1} mt={2} variant="heading" as="h3" sx={{ fontSize: 3 }}>
           Contact
         </Text>
         <Text variant="body2" as="p">

src/theme.js

@@ -25,7 +25,8 @@ export default {
     display: 400,
   },
   lineHeights: {
-    body: 1.1,
+    body: 1.3,
+    display: 1.1,
     heading: 1.25,
   },
   breakpoints: ["12em", "24em", "40em", "56em", "64em"],
@@ -37,7 +38,7 @@ export default {
       fontSize: 1,
     },
     display: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontFamily: "display",
       fontSize: [5, 6],
       fontWeight: "display",
@@ -66,26 +67,26 @@ export default {
       fontWeight: "body",
     },
     h1: {
-      variant: "textStyles.display",
+      variant: "text.display",
     },
     h2: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontSize: 5,
     },
     h3: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontSize: 4,
     },
     h4: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontSize: 3,
     },
     h5: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontSize: 2,
     },
     h6: {
-      variant: "textStyles.heading",
+      variant: "text.heading",
       fontSize: 1,
     },
     a: {