mirror of
https://github.com/jeffvli/feishin.git
synced 2026-06-24 12:57:55 +02:00
add conditional render to queue/lyric state on mobile player (#1797)
This commit is contained in:
@@ -495,12 +495,14 @@ export const MobileFullscreenPlayer = () => {
|
||||
/>
|
||||
</motion.div>
|
||||
|
||||
<AnimatePresence>
|
||||
{isQueueState && (
|
||||
<motion.div
|
||||
animate={{
|
||||
opacity: isQueueState ? 1 : 0,
|
||||
zIndex: isQueueState ? 2 : 1,
|
||||
}}
|
||||
animate={{ opacity: 1 }}
|
||||
className={styles.queueState}
|
||||
exit={{ opacity: 0 }}
|
||||
initial={{ opacity: 0 }}
|
||||
style={{ zIndex: 2 }}
|
||||
transition={{ duration: 0.3, ease: 'easeInOut' }}
|
||||
>
|
||||
<div className={styles.queueHeader}>
|
||||
@@ -522,13 +524,17 @@ export const MobileFullscreenPlayer = () => {
|
||||
<PlayQueue listKey={ItemListKey.FULL_SCREEN} searchTerm={undefined} />
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
|
||||
<AnimatePresence>
|
||||
{isLyricsState && (
|
||||
<motion.div
|
||||
animate={{
|
||||
opacity: isLyricsState ? 1 : 0,
|
||||
zIndex: isLyricsState ? 2 : 1,
|
||||
}}
|
||||
animate={{ opacity: 1 }}
|
||||
className={styles.lyricsState}
|
||||
exit={{ opacity: 0 }}
|
||||
initial={{ opacity: 0 }}
|
||||
style={{ zIndex: 2 }}
|
||||
transition={{ duration: 0.3, ease: 'easeInOut' }}
|
||||
>
|
||||
<div className={styles.lyricsHeader}>
|
||||
@@ -549,8 +555,12 @@ export const MobileFullscreenPlayer = () => {
|
||||
variant={isPageHovered ? 'default' : 'subtle'}
|
||||
/>
|
||||
</div>
|
||||
<div className={styles.lyricsContent}>{isLyricsState && <Lyrics />}</div>
|
||||
<div className={styles.lyricsContent}>
|
||||
<Lyrics />
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</MobilePlayerContainer>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user