Make nav link closer to footer and consistent

Author: rvsia

packages/react-renderer-demo/src/app/src/components/common/connected-links.js

@@ -1,42 +1,30 @@
 import React, { useContext } from 'react';
-import clsx from 'clsx';
 import Grid from '@material-ui/core/Grid';
 import Button from '@material-ui/core/Button';
 import makeStyles from '@material-ui/styles/makeStyles';
 import ChevronRight from '@material-ui/icons/ChevronRight';
 import ChevronLeft from '@material-ui/icons/ChevronLeft';
 import Link from 'next/link';
-import { useRouter } from 'next/router';
 
 import MenuContext from '../navigation/menu-context';
 
 const useStyles = makeStyles(() => ({
   linksContainer: {
     paddingLeft: 32,
-    paddingRight: 64,
-    marginTop: 16,
+    paddingRight: 32,
+    marginTop: 64,
     marginBottom: 16
   },
-  withSideNav: {
-    width: 'calc(100% - 240px)'
-  },
   link: {
     textDecoration: 'none'
   }
 }));
 
 const ConnectedLinks = () => {
   const { prev, next } = useContext(MenuContext);
-  const { pathname } = useRouter();
   const classNames = useStyles();
   return (
-    <Grid
-      container
-      justify="space-between"
-      className={clsx(classNames.linksContainer, {
-        [classNames.withSideNav]: pathname.includes('/renderer/')
-      })}
-    >
+    <Grid container justify="space-between" className={classNames.linksContainer}>
       <Grid item>
         {prev && prev.link && (
           <Link href={`/${prev.link}`}>

packages/react-renderer-demo/src/app/src/components/footer.js

@@ -44,7 +44,7 @@ const drawerWidth = 240;
 
 const useStyles = makeStyles((theme) => ({
   footer: {
-    marginTop: 64,
+    //marginTop: 64,
     backgroundColor: grey[200],
     display: 'flex',
     justifyContent: 'space-between',