Merge pull request #175 from daithihearn/ui-enhancements-5

UI enhancements 5
daithihearn · Jul 6, 2023 · 115eb0a · 115eb0a
2 parents f0bb7fe + 92cec0c
commit 115eb0a
Show file tree

Hide file tree

Showing 8 changed files with 33 additions and 9 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "frontend",
-    "version": "7.2.2",
+    "version": "7.2.3",
     "description": "React frontend for the Cards 110",
     "author": "Daithi Hearn",
     "license": "MIT",

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,7 +1,7 @@
 {
   "short_name": "Cards 110",
   "name": "Cards 110",
-  "version": "7.2.2",
+  "version": "7.2.3",
   "icons": [
     {
       "src": "./assets/favicon.png",

diff --git a/src/components/Game/GameOver.tsx b/src/components/Game/GameOver.tsx
@@ -1,4 +1,4 @@
-import { Card, CardContent, CardHeader, Grid } from "@mui/material"
+import { Card, CardContent, CardHeader, Grid, Typography } from "@mui/material"
 
 import Leaderboard from "components/Leaderboard/Leaderboard"
 import Confetti from "react-confetti"
@@ -8,7 +8,9 @@ const GameOver = () => {
         <Grid container justifyContent="center">
             <Grid item>
                 <Card>
-                    <CardHeader title="Game Over" />
+                    <CardHeader
+                        title={<Typography variant="h2">Game Over</Typography>}
+                    />
                     <CardContent>
                         <Leaderboard />
                     </CardContent>

diff --git a/src/components/GameStats/GameStats.tsx b/src/components/GameStats/GameStats.tsx
@@ -5,6 +5,7 @@ import {
     Grid,
     Switch,
     FormControlLabel,
+    Typography,
 } from "@mui/material"
 import { useCallback, useEffect, useState } from "react"
 import { useAppSelector } from "caches/hooks"
@@ -29,7 +30,9 @@ const GameStats = () => {
     return (
         <Grid container>
             <MuiCard className="p-6 data-card">
-                <CardHeader title="Stats" />
+                <CardHeader
+                    title={<Typography variant="h2">Stats</Typography>}
+                />
                 <CardContent>
                     {myProfile.isAdmin ? (
                         <PlayerSwitcher onChange={setPlayer} />

diff --git a/src/components/Header/NavBar.tsx b/src/components/Header/NavBar.tsx
@@ -21,6 +21,7 @@ import {
     Menu,
     MenuItem,
     Toolbar,
+    Typography,
 } from "@mui/material"
 import { getIsGameActive, getIamAdmin } from "caches/GameSlice"
 import Leaderboard from "components/Leaderboard/Leaderboard"
@@ -156,7 +157,13 @@ const NavBar = () => {
                 onClose={toggleLeaderboardModal}>
                 <DialogContent>
                     <Card>
-                        <CardHeader title="Leaderboard" />
+                        <CardHeader
+                            title={
+                                <Typography variant="h2">
+                                    Leaderboard
+                                </Typography>
+                            }
+                        />
                         <CardContent>
                             <Leaderboard />
                         </CardContent>

diff --git a/src/components/MyGames/MyGames.tsx b/src/components/MyGames/MyGames.tsx
@@ -17,6 +17,7 @@ import {
     ListItemIcon,
     ListItemSecondaryAction,
     ListItemText,
+    Typography,
 } from "@mui/material"
 
 import moment from "moment"
@@ -65,7 +66,9 @@ const MyGames = () => {
         <Grid container>
             <Grid item xs={12}>
                 <Card>
-                    <CardHeader title="Games" />
+                    <CardHeader
+                        title={<Typography variant="h2">Games</Typography>}
+                    />
                     <CardContent>
                         <List>
                             {last10Games.map(row => (

diff --git a/src/components/StartNewGame/StartNewGame.tsx b/src/components/StartNewGame/StartNewGame.tsx
@@ -19,6 +19,7 @@ import {
     TableContainer,
     TableHead,
     TableRow,
+    Typography,
     useTheme,
 } from "@mui/material"
 import { useAppDispatch, useAppSelector } from "caches/hooks"
@@ -117,7 +118,13 @@ const StartNewGame = () => {
         <Grid container>
             <Grid item xs={12}>
                 <Card>
-                    <CardHeader title="Start a new game" />
+                    <CardHeader
+                        title={
+                            <Typography variant="h2">
+                                Start a new game
+                            </Typography>
+                        }
+                    />
                     <CardContent>
                         <FormControl fullWidth>
                             <form onSubmit={startGame}>

diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx
@@ -13,6 +13,7 @@ import { useSnackbar } from "notistack"
 import StatsService from "services/StatsService"
 import parseError from "utils/ErrorUtils"
 import SettingsService from "services/SettingsService"
+import { Spa } from "@mui/icons-material"
 
 const Home = () => {
     const dispatch = useAppDispatch()
@@ -61,10 +62,11 @@ const Home = () => {
                     ) : (
                         <div>
                             {myProfile.isPlayer ? (
-                                <Grid container>
+                                <Grid container sx={{ marginBottom: "10px" }}>
                                     <MyGames />
                                 </Grid>
                             ) : null}
+
                             {myProfile.isPlayer && !myProfile.isAdmin ? (
                                 <Grid container>
                                     <GameStats />