diff options
| author | Dayana31 <[email protected]> | 2022-04-21 17:27:08 -0500 |
|---|---|---|
| committer | Dayana31 <[email protected]> | 2022-04-21 17:27:08 -0500 |
| commit | 67c50667678dd0ce4709b29a854f6a47093a1ac5 (patch) | |
| tree | b6f9f39092ad54bf6b815984d32b37d7c7ca67ab /front/odiparpack/app/components/Widget/AlbumWidget.js | |
| parent | 91140b24f0d49a9f89a080ee063e9eb023a4b73a (diff) | |
| parent | e13e630cd6e4fc0b1ff92098a28a770794c7bb9a (diff) | |
| download | DP1_project-67c50667678dd0ce4709b29a854f6a47093a1ac5.tar.gz DP1_project-67c50667678dd0ce4709b29a854f6a47093a1ac5.tar.bz2 DP1_project-67c50667678dd0ce4709b29a854f6a47093a1ac5.zip | |
Merge branch 'gabshr' into dayana
Diffstat (limited to 'front/odiparpack/app/components/Widget/AlbumWidget.js')
| -rw-r--r-- | front/odiparpack/app/components/Widget/AlbumWidget.js | 55 |
1 files changed, 55 insertions, 0 deletions
diff --git a/front/odiparpack/app/components/Widget/AlbumWidget.js b/front/odiparpack/app/components/Widget/AlbumWidget.js new file mode 100644 index 0000000..d691361 --- /dev/null +++ b/front/odiparpack/app/components/Widget/AlbumWidget.js @@ -0,0 +1,55 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { withStyles } from '@material-ui/core/styles'; +import InfoIcon from '@material-ui/icons/Info'; +import imgData from 'ba-api/imgData'; +import { GridList, GridListTile, GridListTileBar, IconButton } from '@material-ui/core'; +import PapperBlock from '../PapperBlock/PapperBlock'; +import styles from './widget-jss'; + + +class AlbumWidget extends React.Component { + render() { + const { classes } = this.props; + return ( + <PapperBlock noMargin title="My Albums (4)" whiteBg desc=""> + <div className={classes.albumRoot}> + <GridList cellHeight={180} className={classes.gridList}> + { + imgData.map((tile, index) => { + if (index >= 4) { + return false; + } + return ( + <GridListTile key={index.toString()}> + <img src={tile.img} className={classes.img} alt={tile.title} /> + <GridListTileBar + title={tile.title} + subtitle={( + <span> +by: + {tile.author} + </span> + )} + actionIcon={( + <IconButton className={classes.icon}> + <InfoIcon /> + </IconButton> + )} + /> + </GridListTile> + ); + }) + } + </GridList> + </div> + </PapperBlock> + ); + } +} + +AlbumWidget.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(AlbumWidget); |
