From c7058d0a756fb5439e95720326fb8dd6f096006d Mon Sep 17 00:00:00 2001
From: Hawk <falk.ba@gmx.de>
Date: Fri, 17 Apr 2020 23:23:35 +0200
Subject: [PATCH] grid layout #9

---
 .../src/components/selectResource/index.js    | 26 ++++++++++++-------
 1 file changed, 16 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/selectResource/index.js b/frontend/src/components/selectResource/index.js
index dc137fb..b6d369c 100644
--- a/frontend/src/components/selectResource/index.js
+++ b/frontend/src/components/selectResource/index.js
@@ -2,7 +2,8 @@ import React from 'react';
 import { makeStyles } from '@material-ui/core/styles';
 import Card from '@material-ui/core/Card';
 import CardContent from '@material-ui/core/CardContent';
-import Typography from '@material-ui/core/Typography'
+import Typography from '@material-ui/core/Typography';
+import Grid from '@material-ui/core/Grid';
 
 const useStyles = makeStyles(theme => ({
     card: {
@@ -11,13 +12,18 @@ const useStyles = makeStyles(theme => ({
 }));
 
 function CreateResourceCard(resource, classes) {
-    return (<Card className={classes.card}>
-        <CardContent>
-            <Typography variant="h5" component="h2">
-                {JSON.stringify(resource)}
-            </Typography>
-        </CardContent>
-    </Card>)
+    return (
+        <Grid item xs={4}>
+            <Card className={classes.card}>
+                <CardContent>
+                    <Typography variant="h6" component="h2">
+                        {resource["name"]}
+                    </Typography>
+                </CardContent>
+            </Card>
+        </Grid>
+
+    )
 }
 
 export default function SelectResource() {
@@ -38,9 +44,9 @@ export default function SelectResource() {
 
     return (
 
-        <React.Fragment>
+        <Grid container spacing={2}>
             {resources}
-        </React.Fragment>
+        </Grid>
 
     );
 }