Fix queue container layout
This commit is contained in:
parent
7ab532be07
commit
3d409bb6f1
1 changed files with 9 additions and 3 deletions
|
@ -1,4 +1,4 @@
|
|||
import { Stack, Group, Center } from '@mantine/core';
|
||||
import { Group, Center } from '@mantine/core';
|
||||
import { motion } from 'framer-motion';
|
||||
import { HiOutlineQueueList } from 'react-icons/hi2';
|
||||
import { RiFileMusicLine, RiFileTextLine, RiInformationFill } from 'react-icons/ri';
|
||||
|
@ -41,6 +41,12 @@ const HeaderItemWrapper = styled.div`
|
|||
z-index: 2;
|
||||
`;
|
||||
|
||||
const GridContainer = styled.div`
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
grid-template-columns: 1fr;
|
||||
`;
|
||||
|
||||
export const FullScreenPlayerQueue = () => {
|
||||
const { activeTab } = useFullScreenPlayerStore();
|
||||
const { setStore } = useFullScreenPlayerStoreActions();
|
||||
|
@ -67,7 +73,7 @@ export const FullScreenPlayerQueue = () => {
|
|||
];
|
||||
|
||||
return (
|
||||
<Stack className="full-screen-player-queue-container">
|
||||
<GridContainer className="full-screen-player-queue-container">
|
||||
<Group
|
||||
grow
|
||||
align="center"
|
||||
|
@ -116,6 +122,6 @@ export const FullScreenPlayerQueue = () => {
|
|||
) : activeTab === 'lyrics' ? (
|
||||
<Lyrics />
|
||||
) : null}
|
||||
</Stack>
|
||||
</GridContainer>
|
||||
);
|
||||
};
|
||||
|
|
Reference in a new issue