antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 10:23:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

[enhancements]: fix carousel, full screen metadata improvements (#524)

Browse source 
* fix carousel, full screen metadata improvements

* Add missing mapped keys on multiple artist

* Remove bg opacity on metadata section

* Improve visibility of currently playing song

---------

Co-authored-by: jeffvli <jeffvictorli@gmail.com>
This commit is contained in:
Kendall Garner 2024-03-05 02:53:00 +00:00 • committed by GitHub
parent 742cef3d81
commit a45e7f24e4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 89 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

72
src/renderer/features/player/components/full-screen-player-image.tsx
View file

@ -1,7 +1,7 @@
import { Flex, Stack, Group, Center } from '@mantine/core';
import { useSetState } from '@mantine/hooks';
import { AnimatePresence, HTMLMotionProps, motion, Variants } from 'framer-motion';
import { useEffect, useRef, useLayoutEffect, useState, useCallback } from 'react';
import { useEffect, useRef, useLayoutEffect, useState, useCallback, Fragment } from 'react';
import { RiAlbumFill } from 'react-icons/ri';
import { generatePath } from 'react-router';
import { Link } from 'react-router-dom';
@ -256,7 +256,6 @@ export const FullScreenPlayerImage = () => {
align="center"
order={1}
overflow="hidden"
pb="0.5rem"
style={{
textShadow: 'var(--fullscreen-player-text-shadow)',
}}
@ -282,41 +281,48 @@ export const FullScreenPlayerImage = () => {
>
{currentSong?.album}{' '}
</TextTitle>
{currentSong?.artists?.map((artist, index) => (
<TextTitle
key={`fs-artist-${artist.id}`}
align="center"
order={3}
style={{
textShadow: 'var(--fullscreen-player-text-shadow)',
}}
>
{index > 0 && (
<TextTitle
key="fs-artists"
align="center"
order={3}
style={{
textShadow: 'var(--fullscreen-player-text-shadow)',
}}
>
{currentSong?.artists?.map((artist, index) => (
<Fragment key={`fs-artist-${artist.id}`}>
{index > 0 && (
<Text
$secondary
sx={{
display: 'inline-block',
padding: '0 0.5rem',
}}
>
•
</Text>
)}
<Text
sx={{
display: 'inline-block',
padding: '0 0.5rem',
$link
$secondary
component={Link}
style={{
textShadow: 'var(--fullscreen-player-text-shadow)',
}}
to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, {
albumArtistId: artist.id,
})}
weight={600}
>
•
{artist.name}
</Text>
)}
<Text
$link
component={Link}
style={{
textShadow: 'var(--fullscreen-player-text-shadow)',
}}
to={generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, {
albumArtistId: artist.id,
})}
weight={600}
>
{artist.name}
</Text>
</TextTitle>
))}
<Group position="center">
</Fragment>
))}
</TextTitle>
<Group
mt="sm"
position="center"
>
{currentSong?.container && (
<Badge size="lg">
{currentSong?.container} {currentSong?.bitRate}