feat: ran prettier over changes
This commit is contained in:
committed by
Deluan Quintão
parent
28bcd3f99e
commit
6da2f1ba92
@@ -38,7 +38,11 @@ const AlbumDetails = ({ classes, record }) => {
|
|||||||
className={classes.albumCover}
|
className={classes.albumCover}
|
||||||
onClick={handleOpenLightbox}
|
onClick={handleOpenLightbox}
|
||||||
>
|
>
|
||||||
<PlayButton record={record} className={classes.playButton} size={"large"} />
|
<PlayButton
|
||||||
|
record={record}
|
||||||
|
className={classes.playButton}
|
||||||
|
size={'large'}
|
||||||
|
/>
|
||||||
</CardMedia>
|
</CardMedia>
|
||||||
<CardContent className={classes.albumDetails}>
|
<CardContent className={classes.albumDetails}>
|
||||||
<Typography variant="h5" className={classes.albumTitle}>
|
<Typography variant="h5" className={classes.albumTitle}>
|
||||||
|
|||||||
@@ -18,8 +18,8 @@ const useStyles = makeStyles((theme) => ({
|
|||||||
margin: '20px',
|
margin: '20px',
|
||||||
},
|
},
|
||||||
tileBar: {
|
tileBar: {
|
||||||
transition:'all 150ms ease-out',
|
transition: 'all 150ms ease-out',
|
||||||
opacity:0,
|
opacity: 0,
|
||||||
textAlign: 'left',
|
textAlign: 'left',
|
||||||
marginBottom: '3px',
|
marginBottom: '3px',
|
||||||
background:
|
background:
|
||||||
@@ -42,31 +42,31 @@ const useStyles = makeStyles((theme) => ({
|
|||||||
color: theme.palette.primary.light,
|
color: theme.palette.primary.light,
|
||||||
},
|
},
|
||||||
albumArtist: {
|
albumArtist: {
|
||||||
fontSize:'12px',
|
fontSize: '12px',
|
||||||
color:'#c5c5c5',
|
color: '#c5c5c5',
|
||||||
overflow:'hidden',
|
overflow: 'hidden',
|
||||||
whiteSpace:'nowrap',
|
whiteSpace: 'nowrap',
|
||||||
textOverflow: 'ellipsis'
|
textOverflow: 'ellipsis',
|
||||||
},
|
},
|
||||||
albumName: {
|
albumName: {
|
||||||
fontSize:'14px',
|
fontSize: '14px',
|
||||||
color:'#eee',
|
color: '#eee',
|
||||||
overflow:'hidden',
|
overflow: 'hidden',
|
||||||
whiteSpace:'nowrap',
|
whiteSpace: 'nowrap',
|
||||||
textOverflow: 'ellipsis'
|
textOverflow: 'ellipsis',
|
||||||
},
|
},
|
||||||
link: {
|
link: {
|
||||||
position:'relative',
|
position: 'relative',
|
||||||
display: 'block',
|
display: 'block',
|
||||||
textDecoration:'none',
|
textDecoration: 'none',
|
||||||
"&:hover $tileBar": {
|
'&:hover $tileBar': {
|
||||||
opacity:1,
|
opacity: 1,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
albumLlink: {
|
albumLlink: {
|
||||||
position:'relative',
|
position: 'relative',
|
||||||
display: 'block',
|
display: 'block',
|
||||||
textDecoration:'none',
|
textDecoration: 'none',
|
||||||
},
|
},
|
||||||
}))
|
}))
|
||||||
|
|
||||||
@@ -111,17 +111,27 @@ const AlbumGridTile = ({ showArtist, record, basePath }) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<Link className={classes.link} to={linkToRecord(basePath, record.id, 'show')}>
|
<Link
|
||||||
|
className={classes.link}
|
||||||
|
to={linkToRecord(basePath, record.id, 'show')}
|
||||||
|
>
|
||||||
<Cover album={record} />
|
<Cover album={record} />
|
||||||
<GridListTileBar
|
<GridListTileBar
|
||||||
className={isDesktop ? classes.tileBar : classes.tileBarMobile}
|
className={isDesktop ? classes.tileBar : classes.tileBarMobile}
|
||||||
subtitle={
|
subtitle={
|
||||||
<PlayButton record={record} className={classes.playButton} size="small" />
|
<PlayButton
|
||||||
}
|
record={record}
|
||||||
actionIcon={<AlbumContextMenu record={record} color={'white'} />}
|
className={classes.playButton}
|
||||||
/>
|
size="small"
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
actionIcon={<AlbumContextMenu record={record} color={'white'} />}
|
||||||
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
<Link className={classes.albumLlink} to={linkToRecord(basePath, record.id, 'show')}>
|
<Link
|
||||||
|
className={classes.albumLlink}
|
||||||
|
to={linkToRecord(basePath, record.id, 'show')}
|
||||||
|
>
|
||||||
<div className={classes.albumName}>{record.name}</div>
|
<div className={classes.albumName}>{record.name}</div>
|
||||||
<div className={classes.albumArtist}>{record.albumArtist}</div>
|
<div className={classes.albumArtist}>{record.albumArtist}</div>
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
@@ -12,13 +12,13 @@ export const useStyles = makeStyles((theme) => ({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
playButton: {
|
playButton: {
|
||||||
opacity:0,
|
opacity: 0,
|
||||||
transition:'all 150ms ease-out'
|
transition: 'all 150ms ease-out',
|
||||||
},
|
},
|
||||||
albumCover: {
|
albumCover: {
|
||||||
display: 'inline-flex',
|
display: 'inline-flex',
|
||||||
justifyContent:'center',
|
justifyContent: 'center',
|
||||||
alignItems:'center',
|
alignItems: 'center',
|
||||||
cursor: 'pointer',
|
cursor: 'pointer',
|
||||||
|
|
||||||
[theme.breakpoints.down('xs')]: {
|
[theme.breakpoints.down('xs')]: {
|
||||||
@@ -34,8 +34,8 @@ export const useStyles = makeStyles((theme) => ({
|
|||||||
width: '15em',
|
width: '15em',
|
||||||
},
|
},
|
||||||
'&:hover $playButton': {
|
'&:hover $playButton': {
|
||||||
opacity:1,
|
opacity: 1,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
albumDetails: {
|
albumDetails: {
|
||||||
display: 'inline-block',
|
display: 'inline-block',
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ const PlayButton = ({ record, size = 'small', ...rest }) => {
|
|||||||
}
|
}
|
||||||
const dataProvider = useDataProvider()
|
const dataProvider = useDataProvider()
|
||||||
const dispatch = useDispatch()
|
const dispatch = useDispatch()
|
||||||
const playAlbum = record => {
|
const playAlbum = (record) => {
|
||||||
dataProvider
|
dataProvider
|
||||||
.getList('albumSong', {
|
.getList('albumSong', {
|
||||||
pagination: { page: 1, perPage: -1 },
|
pagination: { page: 1, perPage: -1 },
|
||||||
|
|||||||
Reference in New Issue
Block a user