fix about page to be mobile dynamic

MiTo0o · Jul 26, 2024 · f1317e1 · f1317e1
1 parent 1704742
commit f1317e1
Showing 1 changed file with 16 additions and 2 deletions.
diff --git a/src/Pages/About.tsx b/src/Pages/About.tsx
@@ -22,6 +22,20 @@ function About() {
         default: "#1E272C",
       },
     },
+    typography: {
+      h6: {
+        fontSize: "1.25rem",
+        [`@media (max-width:600px)`]: {
+          fontSize: "1rem",
+        },
+      },
+      body1: {
+        fontSize: "1rem",
+        [`@media (max-width:600px)`]: {
+          fontSize: "0.875rem",
+        },
+      },
+    },
   });
 
   return (
@@ -32,9 +46,9 @@ function About() {
         direction="column"
         justifyContent="center"
         alignItems="center"
-        style={{ minHeight: "100vh" }}
+        style={{ minHeight: "100vh", padding: "0 20px" }}
       >
-        <Grid item>
+        <Grid item xs={12} sm={10} md={8}>
           <Typography align="center" variant="h6" pb={3}>
             Welcome to my dog gallery website!
           </Typography>