Move scroll container to wrap lyrics only

This commit is contained in:
jeffvli 2023-06-05 02:57:20 -07:00 committed by Jeff
parent 3f78c3f420
commit a1a113d3c6
2 changed files with 33 additions and 34 deletions

View file

@ -3,7 +3,7 @@ import { motion } from 'framer-motion';
import { HiOutlineQueueList } from 'react-icons/hi2';
import { RiFileMusicLine, RiFileTextLine, RiInformationFill } from 'react-icons/ri';
import styled from 'styled-components';
import { Button, ScrollArea, TextTitle } from '/@/renderer/components';
import { Button, TextTitle } from '/@/renderer/components';
import { PlayQueue } from '/@/renderer/features/now-playing';
import {
useFullScreenPlayerStore,
@ -27,32 +27,6 @@ const QueueContainer = styled.div`
}
`;
const LyricsContainer = styled(ScrollArea)`
z-index: 1;
text-align: center;
transform: translateY(-2rem);
mask-image: linear-gradient(
180deg,
transparent 5%,
rgba(0, 0, 0, 100%) 20%,
rgba(0, 0, 0, 100%) 85%,
transparent 95%
);
&.mantine-ScrollArea-root {
height: 100%;
}
& .mantine-ScrollArea-viewport {
height: 100% !important;
}
& .mantine-ScrollArea-viewport > div {
height: 100%;
}
`;
const ActiveTabIndicator = styled(motion.div)`
position: absolute;
bottom: 0;
@ -140,9 +114,7 @@ export const FullScreenPlayerQueue = () => {
</Group>
</Center>
) : activeTab === 'lyrics' ? (
<LyricsContainer scrollHideDelay={0}>
<Lyrics />
</LyricsContainer>
<Lyrics />
) : null}
</Stack>
);