mirror of
https://github.com/D4M13N-D3V/comissions-app-ui.git
synced 2025-03-14 00:05:07 +00:00
108 lines
3.2 KiB
TypeScript
108 lines
3.2 KiB
TypeScript
// ** MUI Imports
|
|
import { Theme } from '@mui/material/styles'
|
|
|
|
// ** Util Import
|
|
import { hexToRGBA } from '../../../core/utils/hex-to-rgba'
|
|
|
|
const Dialog = (theme: Theme) => {
|
|
return {
|
|
MuiDialog: {
|
|
styleOverrides: {
|
|
paper: {
|
|
boxShadow: theme.shadows[6],
|
|
'&:not(.MuiDialog-paperFullScreen)': {
|
|
'@media (max-width:599px)': {
|
|
margin: theme.spacing(4),
|
|
width: `calc(100% - ${theme.spacing(8)})`,
|
|
maxWidth: `calc(100% - ${theme.spacing(8)}) !important`
|
|
}
|
|
},
|
|
'& > .MuiList-root': {
|
|
paddingLeft: theme.spacing(1),
|
|
paddingRight: theme.spacing(1)
|
|
}
|
|
}
|
|
}
|
|
},
|
|
MuiDialogTitle: {
|
|
styleOverrides: {
|
|
root: {
|
|
padding: theme.spacing(5)
|
|
}
|
|
}
|
|
},
|
|
MuiDialogContent: {
|
|
styleOverrides: {
|
|
root: {
|
|
padding: theme.spacing(5),
|
|
'& + .MuiDialogContent-root': {
|
|
paddingTop: 0
|
|
},
|
|
'& + .MuiDialogActions-root': {
|
|
paddingTop: 0
|
|
},
|
|
|
|
// Styling for Mobile Date Picker starts
|
|
'& .PrivatePickersToolbar-root': {
|
|
padding: theme.spacing(4, 5),
|
|
color: theme.palette.primary.contrastText,
|
|
backgroundColor: theme.palette.primary.main,
|
|
'& .MuiTypography-root': {
|
|
color: theme.palette.primary.contrastText
|
|
},
|
|
'& span.MuiTypography-overline': {
|
|
fontSize: '1rem',
|
|
lineHeight: '24px',
|
|
letterSpacing: '0.15px'
|
|
},
|
|
'& ~ div[class^="css-"] > div[class^="css-"]': {
|
|
marginTop: theme.spacing(6),
|
|
marginBottom: theme.spacing(6),
|
|
'& > div[class^="css-"]': {
|
|
backgroundColor:
|
|
theme.palette.mode === 'light' ? theme.palette.grey[50] : theme.palette.background.default,
|
|
'& ~ .MuiIconButton-root span.MuiTypography-caption': {
|
|
color: 'inherit'
|
|
}
|
|
}
|
|
},
|
|
'& .PrivateTimePickerToolbar-hourMinuteLabel': {
|
|
alignItems: 'center',
|
|
'& > .MuiButton-root span.MuiTypography-root': {
|
|
fontWeight: 300,
|
|
lineHeight: '72px',
|
|
fontSize: '3.75rem',
|
|
letterSpacing: '-0.5px'
|
|
},
|
|
'& > .MuiTypography-root': {
|
|
color: hexToRGBA(theme.palette.primary.contrastText, 0.54),
|
|
'& + .MuiButton-root > span.MuiTypography-root': {
|
|
color: hexToRGBA(theme.palette.primary.contrastText, 0.54)
|
|
}
|
|
}
|
|
},
|
|
'& .PrivateTimePickerToolbar-ampmSelection span.MuiTypography-root:not(.Mui-selected)': {
|
|
color: hexToRGBA(theme.palette.primary.contrastText, 0.54)
|
|
}
|
|
}
|
|
|
|
// Styling for Mobile Date Picker ends
|
|
}
|
|
}
|
|
},
|
|
MuiDialogActions: {
|
|
styleOverrides: {
|
|
root: {
|
|
padding: theme.spacing(5),
|
|
'&.dialog-actions-dense': {
|
|
padding: theme.spacing(2.5),
|
|
paddingTop: 0
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
export default Dialog
|