vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-06-19 18:04:22 +02:00
Code Issues Packages Projects Releases Wiki Activity

add conditional render to queue/lyric state on mobile player (#1797)

Browse Source
This commit is contained in:
jeffvli
2026-03-08 21:06:12 -07:00
parent 27ab9f89c9
commit 7dbf8dd9fe
1 changed files with 65 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/features/player/components/mobile-fullscreen-player.tsx
+19 -9
View File
@@ -495,12 +495,14 @@ export const MobileFullscreenPlayer = () => {
/> />
</motion.div> </motion.div>
<AnimatePresence>
{isQueueState && (
<motion.div <motion.div
animate={{ animate={{ opacity: 1 }}
opacity: isQueueState ? 1 : 0,
zIndex: isQueueState ? 2 : 1,
}}
className={styles.queueState} className={styles.queueState}
exit={{ opacity: 0 }}
initial={{ opacity: 0 }}
style={{ zIndex: 2 }}
transition={{ duration: 0.3, ease: 'easeInOut' }} transition={{ duration: 0.3, ease: 'easeInOut' }}
> >
<div className={styles.queueHeader}> <div className={styles.queueHeader}>
@@ -522,13 +524,17 @@ export const MobileFullscreenPlayer = () => {
<PlayQueue listKey={ItemListKey.FULL_SCREEN} searchTerm={undefined} /> <PlayQueue listKey={ItemListKey.FULL_SCREEN} searchTerm={undefined} />
</div> </div>
</motion.div> </motion.div>
)}
</AnimatePresence>
<AnimatePresence>
{isLyricsState && (
<motion.div <motion.div
animate={{ animate={{ opacity: 1 }}
opacity: isLyricsState ? 1 : 0,
zIndex: isLyricsState ? 2 : 1,
}}
className={styles.lyricsState} className={styles.lyricsState}
exit={{ opacity: 0 }}
initial={{ opacity: 0 }}
style={{ zIndex: 2 }}
transition={{ duration: 0.3, ease: 'easeInOut' }} transition={{ duration: 0.3, ease: 'easeInOut' }}
> >
<div className={styles.lyricsHeader}> <div className={styles.lyricsHeader}>
@@ -549,8 +555,12 @@ export const MobileFullscreenPlayer = () => {
variant={isPageHovered ? 'default' : 'subtle'} variant={isPageHovered ? 'default' : 'subtle'}
/> />
</div> </div>
<div className={styles.lyricsContent}>{isLyricsState && <Lyrics />}</div> <div className={styles.lyricsContent}>
<Lyrics />
</div>
</motion.div> </motion.div>
)}
</AnimatePresence>
</MobilePlayerContainer> </MobilePlayerContainer>
); );
}; };