[core] Fix use of ::before & ::after (#11515)

mui · Dec 27, 2023 · 4242917 · 4242917
1 parent 70b9d50
commit 4242917
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClockSection.tsx b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClockSection.tsx
@@ -72,7 +72,7 @@ const MultiSectionDigitalClockSectionRoot = styled(MenuList, {
     '&:not(:first-of-type)': {
       borderLeft: `1px solid ${(theme.vars || theme).palette.divider}`,
     },
-    '&:after': {
+    '&::after': {
       display: 'block',
       content: '""',
       // subtracting the height of one item, extra margin and borders to make sure the max height is correct

diff --git a/packages/x-date-pickers/src/internals/components/PickersInput/PickersFilledInput.tsx b/packages/x-date-pickers/src/internals/components/PickersInput/PickersFilledInput.tsx
@@ -47,7 +47,7 @@ const FilledInputRoot = styled(PickersInputRoot, {
     },
 
     ...(!ownerState.disableUnderline && {
-      '&:after': {
+      '&::after': {
         borderBottom: `2px solid ${
           (theme.vars || theme).palette[ownerState.color || 'primary']?.main
         }`,
@@ -74,7 +74,7 @@ const FilledInputRoot = styled(PickersInputRoot, {
           borderBottomColor: (theme.vars || theme).palette.error.main,
         },
       },
-      '&:before': {
+      '&::before': {
         borderBottom: `1px solid ${
           theme.vars
             ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})`

diff --git a/packages/x-date-pickers/src/internals/components/PickersInput/PickersStandardInput.tsx b/packages/x-date-pickers/src/internals/components/PickersInput/PickersStandardInput.tsx
@@ -27,7 +27,7 @@ const StandardInputRoot = styled(PickersInputRoot, {
       marginTop: 16,
     },
     ...(!ownerState.disableUnderline && {
-      '&:after': {
+      '&::after': {
         background: 'red',
         borderBottom: `2px solid ${(theme.vars || theme).palette[ownerState.color as string].main}`,
         left: 0,
@@ -53,7 +53,7 @@ const StandardInputRoot = styled(PickersInputRoot, {
           borderBottomColor: (theme.vars || theme).palette.error.main,
         },
       },
-      '&:before': {
+      '&::before': {
         borderBottom: `1px solid ${bottomLineColor}`,
         left: 0,
         bottom: 0,