diff --git a/ui/src/album/AlbumSongs.js b/ui/src/album/AlbumSongs.js
index 9cdeafa47..044fdeb5b 100644
--- a/ui/src/album/AlbumSongs.js
+++ b/ui/src/album/AlbumSongs.js
@@ -49,6 +49,7 @@ const useStyles = makeStyles(
noResults: { padding: 20 },
columnIcon: {
marginLeft: '3px',
+ marginTop: '-2px',
verticalAlign: 'text-top',
},
}),
diff --git a/ui/src/playlist/PlaylistSongs.js b/ui/src/playlist/PlaylistSongs.js
index a81c12ef5..f321b70cb 100644
--- a/ui/src/playlist/PlaylistSongs.js
+++ b/ui/src/playlist/PlaylistSongs.js
@@ -4,8 +4,6 @@ import {
DatagridLoading,
ListToolbar,
TextField,
- DatagridBody,
- Datagrid,
useListController,
useRefresh,
} from 'react-admin'
@@ -16,7 +14,7 @@ import {
DurationField,
SongDetails,
SongContextMenu,
- SongDatagridRow,
+ SongDatagrid,
} from '../common'
import AddToPlaylistDialog from '../dialogs/AddToPlaylistDialog'
@@ -56,14 +54,6 @@ const useStylesListToolbar = makeStyles({
},
})
-const SongsDatagridBody = (props) => (
- } />
-)
-
-const SongsDatagrid = ({ contextVisible, ...rest }) => {
- return } />
-}
-
const PlaylistSongs = (props) => {
const classes = useStyles(props)
const classesToolbar = useStylesListToolbar(props)
@@ -120,11 +110,12 @@ const PlaylistSongs = (props) => {
size={'small'}
/>
) : (
- }
rowClick={null}
{...controllerProps}
hasBulkActions={hasBulkActions}
+ contextVisible={isXsmall}
>
{isDesktop && }
@@ -134,7 +125,7 @@ const PlaylistSongs = (props) => {
onAddToPlaylist={onAddToPlaylist}
showStar={false}
/>
-
+
)}
diff --git a/ui/src/song/SongList.js b/ui/src/song/SongList.js
index c9cd15125..5ee6dccac 100644
--- a/ui/src/song/SongList.js
+++ b/ui/src/song/SongList.js
@@ -28,6 +28,7 @@ import AddToPlaylistDialog from '../dialogs/AddToPlaylistDialog'
const useStyles = makeStyles({
columnIcon: {
marginLeft: '3px',
+ marginTop: '-2px',
verticalAlign: 'text-top',
},
})