diff --git a/ui/src/album/AlbumGridView.js b/ui/src/album/AlbumGridView.js index ab8b0e697..02aff060c 100644 --- a/ui/src/album/AlbumGridView.js +++ b/ui/src/album/AlbumGridView.js @@ -7,7 +7,7 @@ import { linkToRecord, Loading } from 'react-admin' import subsonic from '../subsonic' import { ArtistLinkField } from './ArtistLinkField' -const useStyles = makeStyles({ +const useStyles = makeStyles((theme) => ({ root: { margin: '20px', }, @@ -23,7 +23,7 @@ const useStyles = makeStyles({ tileBar: { textAlign: 'center', background: - 'linear-gradient(to top, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0) 100%)', + 'linear-gradient(to top, rgba(0,0,0,1) 0%,rgba(0,0,0,0.4) 70%,rgba(0,0,0,0) 100%)', }, albumArtistName: { whiteSpace: 'nowrap', @@ -32,7 +32,10 @@ const useStyles = makeStyles({ textAlign: 'center', fontSize: '1em', }, -}) + artistLink: { + color: theme.palette.primary.light, + }, +})) const getColsForWidth = (width) => { if (width === 'xs') return 2 @@ -69,7 +72,10 @@ const LoadedAlbumGrid = ({ ids, data, basePath, width }) => { title={data[id].name} subtitle={
- + {data[id].albumArtist}
diff --git a/ui/src/album/ArtistLinkField.js b/ui/src/album/ArtistLinkField.js index 712dfb204..262c1d145 100644 --- a/ui/src/album/ArtistLinkField.js +++ b/ui/src/album/ArtistLinkField.js @@ -1,18 +1,24 @@ -import { Link } from 'react-admin' import React from 'react' +import PropTypes from 'prop-types' +import { Link } from 'react-admin' -export const ArtistLinkField = (props) => { - const filter = { artist_id: props.record.albumArtistId } +export const ArtistLinkField = ({ record, className }) => { + const filter = { artist_id: record.albumArtistId } const url = `/album?filter=${JSON.stringify( filter )}&order=ASC&sort=maxYear&displayedFilters={"compilation":true}` return ( - e.stopPropagation()}> - {props.record.albumArtist} + e.stopPropagation()} className={className}> + {record.albumArtist} ) } +ArtistLinkField.propTypes = { + className: PropTypes.string, + source: PropTypes.string, +} + ArtistLinkField.defaultProps = { source: 'artistId', addLabel: true,