diff --git a/frontend/src/components/selectResource/index.js b/frontend/src/components/selectResource/index.js
index d12b75d..93b1bf8 100644
--- a/frontend/src/components/selectResource/index.js
+++ b/frontend/src/components/selectResource/index.js
@@ -4,6 +4,11 @@ import Card from '@material-ui/core/Card';
 import CardContent from '@material-ui/core/CardContent';
 import Typography from '@material-ui/core/Typography';
 import Grid from '@material-ui/core/Grid';
+import { Link } from 'react-router-dom';
+import Link1 from '@material-ui/core/Link';
+import ListItem from '@material-ui/core/ListItem';
+import ListItemText from '@material-ui/core/ListItemText';
+
 
 const useStyles = makeStyles(theme => ({
     card: {
@@ -12,13 +17,16 @@ const useStyles = makeStyles(theme => ({
 }));
 
 function CreateResourceCard(resource, classes) {
+    function ListItemLink(props) {
+        return <ListItem button component={Link1} {...props} />;
+    }
     return (
-        <Grid item xs={4}>
-            <Card className={classes.card}>
-                <CardContent>
-                    <Typography variant="h6" component="h2">
-                        {resource["name"]}
-                    </Typography>
+        <Grid item xs={4} lg={2} >
+            <Card >
+                <CardContent style={{ padding: 0 }}>
+                    <ListItemLink to={"/" + resource["name"].toLowerCase()} component={Link}>
+                        <ListItemText primary={resource["name"]} />
+                    </ListItemLink>
                 </CardContent>
             </Card>
         </Grid>