From e055ded6dc60b5de774625d7a6ef37181c9ac5ef Mon Sep 17 00:00:00 2001
From: Luis Fernando Molina <Luis-Fernando-Molina@users.noreply.github.com>
Date: Thu, 13 Sep 2018 09:46:32 +0200
Subject: [PATCH] Button Alignments inside each card

---
 client/src/components/UserList.js | 58 +++++++++++++++++--------------
 1 file changed, 31 insertions(+), 27 deletions(-)

diff --git a/client/src/components/UserList.js b/client/src/components/UserList.js
index 8f7c611cb..6af84cf14 100644
--- a/client/src/components/UserList.js
+++ b/client/src/components/UserList.js
@@ -119,33 +119,37 @@ class UserList extends Component {
                 </CardContent>
               </CardActionArea>
               <CardActions>
-
-                  <Button onClick={this.handleClickOpen}>User Profile</Button>
-                  <Dialog
-                    fullScreen
-                    open={this.state.open}
-                    onClose={this.handleClose}
-                    TransitionComponent={Transition}
-                  >
-                    <AppBar className={classes.appBar}>
-                      <Toolbar>
-                        <IconButton color="inherit" onClick={this.handleClose} aria-label="Close">
-                          <CloseIcon />
-                        </IconButton>
-                        <Typography variant="title" color="inherit" className={classes.flex}>
-                          User Profile
-                        </Typography>
-                        <Button color="inherit" onClick={this.handleClose}>
-                          Close
-                        </Button>
-                      </Toolbar>
-                    </AppBar>
-                      <UserProfile userId={this.state.selected}/>
-                  </Dialog>
-
-                <Button disabled size="small" color="primary">
-                  Extended Profile
-                </Button>
+                <Grid container justify="center" spacing={24}>
+                   <Grid item>
+                     <Button onClick={this.handleClickOpen}>User Profile</Button>
+                     <Dialog
+                       fullScreen
+                       open={this.state.open}
+                       onClose={this.handleClose}
+                       TransitionComponent={Transition}
+                     >
+                       <AppBar className={classes.appBar}>
+                         <Toolbar>
+                           <IconButton color="inherit" onClick={this.handleClose} aria-label="Close">
+                             <CloseIcon />
+                           </IconButton>
+                           <Typography variant="title" color="inherit" className={classes.flex}>
+                             User Profile
+                           </Typography>
+                           <Button color="inherit" onClick={this.handleClose}>
+                             Close
+                           </Button>
+                         </Toolbar>
+                       </AppBar>
+                         <UserProfile userId={this.state.selected}/>
+                     </Dialog>
+                   </Grid>
+                   <Grid item>
+                     <Button disabled color="primary">
+                       Extended Profile
+                     </Button>
+                   </Grid>
+                </Grid>
               </CardActions>
             </Card>
           </Grid>