Add extra breakpoint at 700px

src/components/app.tsx

@@ -27,6 +27,9 @@ const useStyles = makeStyles(theme => ({
             marginLeft: 'auto',
             marginRight: 'auto',
         },
+        [theme.breakpoints.up(700 + theme.spacing(2) * 2)]: {
+            width: 700,
+        },
     },
 
     paper: {
@@ -41,6 +44,9 @@ const useStyles = makeStyles(theme => ({
             padding: theme.spacing(3),
             height: 600,
         },
+        [theme.breakpoints.up(700 + theme.spacing(2) * 2)]: {
+            height: 700,
+        },
     },
     copyright: {
         display: 'flex',