Export const useStyles = makeStyles((theme: Theme,) => ({ root:

Question

Export const useStyles = makeStyles((theme: Theme,) => ({ root:

{
'& .MuiDialog-paper': theme.modalDropShadows
? undefined
: {
boxShadow: "none !important",
},

// hardcoded heights for consistent dialog sizes
// find a way to flag these

'& .MuiDialog-paperWidthXs': (props) => {
console.log({ props })
return props ? { height: '40vh', minHeight: 0, maxHeight: 'none' } : {}
},
'& .MuiDialog-paperWidthSm': (props) => props ? { height: '55vh', minHeight: 0, maxHeight: 'none' } : {},
'& .MuiDialog-paperWidthMd': (props) => props ? { height: '75vh', minHeight: 0, maxHeight: 'none' } : {},
'& .MuiDialog-paperWidthLg': (props) => props ? { height: '85vh', minHeight: 0, maxHeight: 'none' } : {},
'& .MuiDialog-paperWidthXl': (props) => props ? { height: '90vh', minHeight: 0, maxHeight: 'none' } : {},
}

}));