update DateTimePicker/Date picker styles

src/common/Picker/DatePicker.tsx

@@ -1,28 +1,17 @@
 import React from 'react';
-import clsx from 'clsx';
 import {
   DatePicker as MUIDatePicker,
   DatePickerProps,
 } from '@material-ui/pickers';
 import { DATE_FORMAT } from '@config/app';
 import useI18N from './useI18N';
-import useDialogStyles from './useDialogStyles';
 
 function DatePicker({
-  className,
   format = DATE_FORMAT.DAY_MONTH_AND_YEAR,
   ...props
 }: DatePickerProps) {
-  const classes = useDialogStyles();
   const translations = useI18N();
-  return (
-    <MUIDatePicker
-      {...props}
-      format={format}
-      DialogProps={{ className: clsx(className, classes.dialog) }}
-      {...translations}
-    />
-  );
+  return <MUIDatePicker {...props} format={format} {...translations} />;
 }
 
 export default DatePicker;

src/common/Picker/DateTimePicker.tsx

@@ -1,8 +1,6 @@
 import React from 'react';
-import clsx from 'clsx';
 import { DATE_FORMAT } from '@config/app';
 import useI18N from './useI18N';
-import useDialogStyles from './useDialogStyles';
 
 import {
   DateTimePicker as MUIDateTimePicker,
@@ -10,19 +8,16 @@ import {
 } from '@material-ui/pickers';
 
 function DateTimePicker({
-  className,
   ampm = false,
   format = DATE_FORMAT.HOUR_MINUTES_DAY_MONTH_AND_YEAR,
   ...props
 }: DateTimePickerProps) {
-  const classes = useDialogStyles();
   const translations = useI18N();
   return (
     <MUIDateTimePicker
       {...props}
       ampm={ampm}
       format={format}
-      DialogProps={{ className: clsx(className, classes.dialog) }}
       {...translations}
     />
   );

src/common/Picker/useDialogStyles.ts

@@ -1,21 +0,0 @@
-import { makeStyles } from '@material-ui/core/styles';
-
-const useStyles = makeStyles(theme => ({
-  dialog: {
-    '& .MuiTabs-indicator': {
-      backgroundColor: theme.palette.secondary.main,
-    },
-    '& .MuiPickersDay-daySelected': {
-      backgroundColor: theme.palette.secondary.main,
-      color: theme.palette.secondary.contrastText,
-    },
-    '& .MuiPickersDay-current:not(.MuiPickersDay-daySelected)': {
-      color: theme.palette.secondary.main,
-    },
-    '& .MuiDialogActions-root .MuiButton-root': {
-      color: theme.palette.secondary.contrastText,
-    },
-  },
-}));
-
-export default useStyles;