Adjust drawer area position

This commit is contained in:
jeffvli
2022-12-12 21:06:52 -08:00
parent c57c53972a
commit 2af127ac06
@@ -42,6 +42,7 @@ const MainContainer = styled.main<{
rightExpanded?: boolean; rightExpanded?: boolean;
rightSidebarWidth?: string; rightSidebarWidth?: string;
}>` }>`
position: relative;
display: grid; display: grid;
grid-area: main; grid-area: main;
grid-template-areas: 'sidebar . right-sidebar'; grid-template-areas: 'sidebar . right-sidebar';
@@ -160,30 +161,31 @@ export const DefaultLayout = ({ shell }: DefaultLayoutProps) => {
const queueDrawerVariants: Variants = { const queueDrawerVariants: Variants = {
closed: { closed: {
height: 'calc(100vh - 150px)', height: 'calc(100vh - 170px)',
minWidth: '400px', minWidth: '400px',
position: 'absolute', position: 'absolute',
right: 0, right: 0,
top: '50px', top: '75px',
transition: { transition: {
duration: 0.3, duration: 0.5,
ease: 'anticipate', ease: 'anticipate',
}, },
width: '30vw', width: '30vw',
x: '50vw', x: '50vw',
}, },
open: { open: {
boxShadow: '2px 2px 10px 10px rgba(0,0,0,.1)', borderRadius: '10px',
height: 'calc(100vh - 150px)', boxShadow: '1px 1px 10px 5px rgba(0, 0, 0, 0.3)',
height: 'calc(100vh - 170px)',
minWidth: '400px', minWidth: '400px',
position: 'absolute', position: 'absolute',
right: '20px', right: '20px',
top: '50px', top: '75px',
transition: { transition: {
damping: 10, damping: 10,
delay: 0, delay: 0,
duration: 0.3, duration: 0.8,
ease: 'anticipate', ease: 'anticipate',
mass: 0.5, mass: 0.5,
}, },