background primary/secondary and fix securtiy with grow

src/ui/LoadingScreen.tsx

@@ -2,6 +2,10 @@ import React, { useState, useEffect } from "react";
 import CircularProgress from "@mui/material/CircularProgress";
 import Typography from "@mui/material/Typography";
 import Grid from "@mui/material/Grid";
+import Box from "@mui/material/Box";
+import { Theme } from "@mui/material/styles";
+import makeStyles from "@mui/styles/makeStyles";
+import createStyles from "@mui/styles/createStyles";
 
 import { Terminal } from "../Terminal";
 import { load } from "../db";
@@ -11,7 +15,16 @@ import { GameRoot } from "./GameRoot";
 
 import { CONSTANTS } from "../Constants";
 
+const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    root: {
+      backgroundColor: theme.colors.backgroundprimary,
+    },
+  }),
+);
+
 export function LoadingScreen(): React.ReactElement {
+  const classes = useStyles();
   const [show, setShow] = useState(false);
   const [loaded, setLoaded] = useState(false);
 
@@ -38,25 +51,27 @@ export function LoadingScreen(): React.ReactElement {
     doLoad();
   }, []);
 
-  if (loaded) {
-    return <GameRoot terminal={Terminal} engine={Engine} player={Player} />;
-  }
-
   return (
-    <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
-      <Grid item>
-        <CircularProgress size={150} color="primary" />
-      </Grid>
-      <Grid item>
-        <Typography variant="h3">Loading Bitburner v{CONSTANTS.Version}</Typography>
-      </Grid>
-      {show && (
-        <Grid item>
-          <Typography>
-            If the game fails to load, consider <a href="?noScripts">killing all scripts</a>
-          </Typography>
+    <Box className={classes.root}>
+      {loaded ? (
+        <GameRoot terminal={Terminal} engine={Engine} player={Player} />
+      ) : (
+        <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
+          <Grid item>
+            <CircularProgress size={150} color="primary" />
+          </Grid>
+          <Grid item>
+            <Typography variant="h3">Loading Bitburner v{CONSTANTS.Version}</Typography>
+          </Grid>
+          {show && (
+            <Grid item>
+              <Typography>
+                If the game fails to load, consider <a href="?noScripts">killing all scripts</a>
+              </Typography>
+            </Grid>
+          )}
         </Grid>
       )}
-    </Grid>
+    </Box>
   );
 }