import makeStyles from '@mui/styles/makeStyles';
import type { Theme } from '../@styles/theme-provider';

const createClasses = makeStyles<Theme>(theme => ({
  input: {
    '&::-webkit-outer-spin-button': {
      '-webkit-appearance': 'none',
      margin: 0
    },
    '&::-webkit-inner-spin-button': {
      '-webkit-appearance': 'none',
      margin: 0
    },
    '&[type=number]': {
      '-moz-appearance': 'textfield'
    }
  },
  dash: {
    margin: theme.spacing(0, 1)
  },
  button: {
    padding: theme.spacing(0.5),
    margin: theme.spacing(0.5)
  },
  icon: {
    width: theme.spacing(2),
    height: theme.spacing(2),
    color: theme.palette.primary[200]
  }
}));

export default createClasses;