update styling a bit

iamnapo · May 19, 2021 · fd81b9d · fd81b9d
1 parent 3a4ee0c
commit fd81b9d
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 29 deletions.
diff --git a/template/src/index.scss b/template/src/index.scss
@@ -3,6 +3,11 @@
 @import "~@fontsource/roboto/500.css";
 @import "~@fontsource/roboto/700.css";
 
+html,
 body {
 	margin: 0;
 }
+
+body {
+	min-height: 100vh;
+}
diff --git a/template/src/screens/Home.js b/template/src/screens/Home.js
@@ -1,4 +1,4 @@
-import { Box, Grid, Link, Typography } from "@material-ui/core";
+import { Grid, Link, Typography } from "@material-ui/core";
 import { useCallback } from "react";
 import { Loyalty } from "@material-ui/icons";
 
@@ -9,35 +9,32 @@ const Home = () => {
 	const stuff = useGlobalState(useCallback((e) => e.stuff, []));
 
 	return (
-		<Box>
-			<Grid
-				container
-				component="header"
-				alignItems="center"
-				justifyContent="center"
-				textAlign="center"
-				direction="column"
-				bgcolor="secondary.main"
-				minHeight="100vh"
-			>
-				<Grid item>
-					<Logo />
-				</Grid>
-				<Grid item>
-					<Typography variant="h4" sx={{ color: "common.white" }}>
-						{"Edit "}
-						<code>{"src/App.js"}</code>
-						{" and save to reload."}
-						<Loyalty />
-					</Typography>
-				</Grid>
-				<Grid item>
-					<Link href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
-						<Typography variant="h5">{stuff}</Typography>
-					</Link>
-				</Grid>
+		<Grid
+			container
+			alignItems="center"
+			justifyContent="center"
+			textAlign="center"
+			direction="column"
+			bgcolor="secondary.main"
+			height="100vh"
+		>
+			<Grid item>
+				<Logo />
 			</Grid>
-		</Box>
+			<Grid item>
+				<Typography variant="h4" sx={{ color: "common.white" }}>
+					{"Edit "}
+					<code>{"src/App.js"}</code>
+					{" and save to reload."}
+					<Loyalty />
+				</Typography>
+			</Grid>
+			<Grid item>
+				<Link href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
+					<Typography variant="h5">{stuff}</Typography>
+				</Link>
+			</Grid>
+		</Grid>
 	);
 };