Style: input focused 시 outLine 바꾸기

const TextInput = MuiStyled(TextField)(({ theme }) => ({
  outline: 'none',
  backgroundColor: 'white',
  boxShadow: 'rgba(0, 0, 0, 0.24) 0px 3px 8px',

  '& label': {
    fontWeight: '500',

    '&.Mui-focused': {
      color: 'black',
    },
  },

  '& textarea': {
    color: 'black',
    outline: 'none',
    border: 'none',
  },

  ...(theme.palette.mode === 'dark' && {
    backgroundColor: '#a1d6ff',

    '& .MuiOutlinedInput-root': {
      '& .Mui-focused': {
        borderColor: '#a1d6ff',
      },
    },

    '& label': {
      '&.Mui-focused': {
        color: 'black',
      },
    },
  }),
}));

border-color에 스타일이 덮여 씌어지지 않음

choigirang / portfolio

Style: input focused 시 outLine 바꾸기 #7