{"size": 1321, "ext": "js", "max_stars_repo_path": "excel-tracker-application/src/components/Home/coolcard.js", "max_stars_repo_name": "walkman1915/excel-tracker", "max_stars_repo_stars_event_min_datetime": "2020-01-10T17:53:55.000Z", "max_stars_repo_stars_event_max_datetime": "2020-01-22T15:27:56.000Z", "max_issues_repo_path": "excel-tracker-application/src/components/Home/coolcard.js", "max_issues_repo_name": "walkman1915/excel-tracker", "max_issues_repo_issues_event_min_datetime": "2020-01-13T17:14:59.000Z", "max_issues_repo_issues_event_max_datetime": "2020-04-08T07:53:49.000Z", "max_forks_repo_path": "excel-tracker-application/src/components/Home/coolcard.js", "max_forks_repo_name": "walkman1915/excel-tracker", "max_forks_repo_forks_event_min_datetime": "2020-05-26T19:19:22.000Z", "max_forks_repo_forks_event_max_datetime": "2020-05-26T19:19:22.000Z"}
{"max_stars_count": 2, "max_issues_count": 30, "max_forks_count": 1, "avg_line_length": 26.42, "max_line_length": 69, "alphanum_fraction": 0.6222558668}
import React, { Component } from 'react';
import Card from '@material-ui/core/Card';
import CardActionArea from '@material-ui/core/CardActionArea';
import CardContent from '@material-ui/core/CardContent';
import CardMedia from '@material-ui/core/CardMedia';
import Typography from '@material-ui/core/Typography';

import {
  withRouter
} from "react-router-dom";

/**
 * Image cards displayed on the dashboard of the application. Expects
 * the title, image, and onclick functionality to be passed
 * in through props.
 * 
 * Cards created using the Material UI Card
 * demos here: https://material-ui.com/components/cards/
 * (January 2020)
 */
class ImgMediaCard extends Component {


  render() {
    return (
      <div>
  
      <Card>
        <CardActionArea style = {{height: '80%'}}>
          <CardMedia
            component="img"
            alt={this.props.pageName}
            height= "100%"
            image={this.props.image}
            title={this.props.pageName}
            onClick={this.props.onClick}
          />
          <CardContent>
            <Typography gutterBottom variant="h5" component="h2">
              {this.props.pageName}
            </Typography>
          </CardContent>
        </CardActionArea>
      </Card>
    </div>
    );
  }
}

export default (withRouter(ImgMediaCard));