Revert "[TextField] Fix error focus style (mui#35167)"

This reverts commit df49d6a.
oliviertassinari · Dec 31, 2022 · 3efe5a1 · 3efe5a1
1 parent 33a0e1c
commit 3efe5a1
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 17 deletions.
diff --git a/packages/mui-material/src/FilledInput/FilledInput.js b/packages/mui-material/src/FilledInput/FilledInput.js
@@ -91,13 +91,9 @@ const FilledInputRoot = styled(InputBaseRoot, {
         // See https://github.com/mui/material-ui/issues/31766
         transform: 'scaleX(1) translateX(0)',
       },
-      [`&.${filledInputClasses.error}`]: {
-        '&:before, &:after': {
-          borderBottomColor: (theme.vars || theme).palette.error.main,
-        },
-        '&:focus-within:after': {
-          transform: 'scaleX(1)', // error is always underlined in red
-        },
+      [`&.${filledInputClasses.error}:after`]: {
+        borderBottomColor: (theme.vars || theme).palette.error.main,
+        transform: 'scaleX(1)', // error is always underlined in red
       },
       '&:before': {
         borderBottom: `1px solid ${
@@ -116,7 +112,7 @@ const FilledInputRoot = styled(InputBaseRoot, {
         }),
         pointerEvents: 'none', // Transparent to the hover style.
       },
-      [`&:hover:not(.${filledInputClasses.disabled}, .${filledInputClasses.error}):before`]: {
+      [`&:hover:not(.${filledInputClasses.disabled}):before`]: {
         borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`,
       },
       [`&.${filledInputClasses.disabled}:before`]: {

diff --git a/packages/mui-material/src/Input/Input.js b/packages/mui-material/src/Input/Input.js
@@ -75,13 +75,9 @@ const InputRoot = styled(InputBaseRoot, {
         // See https://github.com/mui/material-ui/issues/31766
         transform: 'scaleX(1) translateX(0)',
       },
-      [`&.${inputClasses.error}`]: {
-        '&:before, &:after': {
-          borderBottomColor: (theme.vars || theme).palette.error.main,
-        },
-        '&:focus-within:after': {
-          transform: 'scaleX(1)', // error is always underlined in red
-        },
+      [`&.${inputClasses.error}:after`]: {
+        borderBottomColor: (theme.vars || theme).palette.error.main,
+        transform: 'scaleX(1)', // error is always underlined in red
       },
       '&:before': {
         borderBottom: `1px solid ${bottomLineColor}`,
@@ -96,8 +92,8 @@ const InputRoot = styled(InputBaseRoot, {
         }),
         pointerEvents: 'none', // Transparent to the hover style.
       },
-      [`&:hover:not(.${inputClasses.disabled}, .${inputClasses.error}):before`]: {
-        borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`,
+      [`&:hover:not(.${inputClasses.disabled}):before`]: {
+        borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
         // Reset on touch devices, it doesn't add specificity
         '@media (hover: none)': {
           borderBottom: `1px solid ${bottomLineColor}`,