add plus icon

src/components/projects/ListProjects.jsx

@@ -3,6 +3,8 @@ import { withStyles } from '@material-ui/core/styles'
 import { Link } from 'react-router-dom'
 import Typography from '@material-ui/core/Typography'
 import Divider from '@material-ui/core/Divider'
+import Fab from '@material-ui/core/Fab'
+import AddIcon from '@material-ui/icons/Add'
 import classnames from 'classnames'
 import { useQuery } from '@apollo/react-hooks'
 import styles from './styles/ListProjects'
@@ -83,6 +85,9 @@ function ListProjects({ classes }) {
         )
       })}
       <Divider className={classes.divider} />
+      <Fab className={classes.fab}>
+        <AddIcon className={classes.addIcon}/>
+      </Fab>
     </div>
   )
 }

src/components/projects/styles/ListProjects.js

@@ -1,5 +1,9 @@
 const styles = theme => ({
   theme,
+  addIcon: {
+    color: '#4360DF',
+    fontSize: '2.5em'
+  },
   blue: {
     color: '#4360DF'
   },
@@ -9,7 +13,7 @@ const styles = theme => ({
   main: {
     display: 'grid',
     gridTemplateColumns: 'repeat(48, [col] 1fr)',
-    gridTemplateRows: '4rem 4rem 3rem 0.5fr 1fr'
+    gridTemplateRows: '4rem 4rem 3rem 0.5fr 1fr 0.3fr'
   },
   title: {
     fontSize: '2.5rem',
@@ -44,6 +48,11 @@ const styles = theme => ({
   fullWidth: {
     gridColumn: '1 / 49'
   },
+  fab: {
+    gridColumn: '3 / 5',
+    background: '#EEF2F5',
+    boxShadow: 'none'
+  },
   tableTitle: {
     color: '#939BA1',
     fontSize: '1.2rem',