// ** MUI Imports import { Theme } from '@mui/material/styles' // ** Util Import import { hexToRGBA } from '../../../core/utils/hex-to-rgba' const Timeline = (theme: Theme) => { return { MuiTimelineItem: { styleOverrides: { root: { '&:not(:last-of-type)': { '& .MuiTimelineContent-root': { marginBottom: theme.spacing(4) } } } } }, MuiTimelineConnector: { styleOverrides: { root: { backgroundColor: theme.palette.divider } } }, MuiTimelineContent: { styleOverrides: { root: { marginTop: theme.spacing(0.5) } } }, MuiTimelineDot: { styleOverrides: { filledPrimary: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.primary.main, 0.12)}` }, filledSecondary: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.secondary.main, 0.12)}` }, filledSuccess: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.success.main, 0.12)}` }, filledError: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.error.main, 0.12)}` }, filledWarning: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.warning.main, 0.12)}` }, filledInfo: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.info.main, 0.12)}` }, filledGrey: { boxShadow: `0 0 0 3px ${hexToRGBA(theme.palette.grey[400], 0.12)}` }, outlinedPrimary: { '& svg': { color: theme.palette.primary.main } }, outlinedSecondary: { '& svg': { color: theme.palette.secondary.main } }, outlinedSuccess: { '& svg': { color: theme.palette.success.main } }, outlinedError: { '& svg': { color: theme.palette.error.main } }, outlinedWarning: { '& svg': { color: theme.palette.warning.main } }, outlinedInfo: { '& svg': { color: theme.palette.info.main } }, outlinedGrey: { '& svg': { color: theme.palette.grey[500] } } } } } } export default Timeline