From a29e0d01d307478eb7913120850f7283db13564f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dafydd=20Ll=C5=B7r=20Pearson?= <DafyddLlyr@gmail.com>
Date: Fri, 30 Jun 2023 11:25:37 +0100
Subject: [PATCH] fix: Incorrect MUI classes syntax (#1890)

---
 .../src/@planx/components/Result/Public/ResultReason.tsx  | 2 +-
 .../src/@planx/components/shared/Preview/MoreInfo.tsx     | 2 +-
 editor.planx.uk/src/ui/Input.tsx                          | 8 ++------
 editor.planx.uk/src/ui/SelectInput.tsx                    | 8 ++++----
 4 files changed, 8 insertions(+), 12 deletions(-)

diff --git a/editor.planx.uk/src/@planx/components/Result/Public/ResultReason.tsx b/editor.planx.uk/src/@planx/components/Result/Public/ResultReason.tsx
index d00fff24f0..efa32a93fa 100644
--- a/editor.planx.uk/src/@planx/components/Result/Public/ResultReason.tsx
+++ b/editor.planx.uk/src/@planx/components/Result/Public/ResultReason.tsx
@@ -111,7 +111,7 @@ const StyledAccordion = styled(Accordion)(({ theme }) => ({
   "&.Mui-expanded": {
     margin: "0",
   },
-  [`& .${classes.removeTopBorder}`]: {
+  [`&.${classes.removeTopBorder}`]: {
     "&:before": {
       display: "none",
     },
diff --git a/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx b/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
index efdd7840f8..348e199977 100644
--- a/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
+++ b/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
@@ -30,7 +30,7 @@ const Root = styled(Drawer, {
     marginRight: "-100%",
   },
 
-  [`& .${classes.drawerPaper}`]: {
+  [`&.${classes.drawerPaper}`]: {
     width: drawerWidth,
     backgroundColor: theme.palette.background.default,
     border: 0,
diff --git a/editor.planx.uk/src/ui/Input.tsx b/editor.planx.uk/src/ui/Input.tsx
index 5020eb81fd..5f5f471f39 100644
--- a/editor.planx.uk/src/ui/Input.tsx
+++ b/editor.planx.uk/src/ui/Input.tsx
@@ -14,7 +14,6 @@ const PREFIX = "Input";
 
 const classes = {
   multiline: `${PREFIX}-multiline`,
-  adornedEnd: `${PREFIX}-adornedEnd`,
   focused: `${PREFIX}-focused`,
 };
 
@@ -63,17 +62,14 @@ const StyledInputBase = styled(InputBase, {
     width: "100%",
     fontWeight: FONT_WEIGHT_SEMI_BOLD,
   }),
-  [`& .${classes.multiline}`]: {
+  [`&.${classes.multiline}`]: {
     height: "auto",
     "& textarea": {
       padding: theme.spacing(1.5, 0),
       lineHeight: 1.6,
     },
   },
-  [`& .${classes.adornedEnd}`]: {
-    paddingRight: 2,
-  },
-  [`& .${classes.focused}`]: {
+  [`&.${classes.focused}`]: {
     ...(bordered && borderedFocusStyle),
   },
 }));
diff --git a/editor.planx.uk/src/ui/SelectInput.tsx b/editor.planx.uk/src/ui/SelectInput.tsx
index 791c4b749f..a58134c27f 100644
--- a/editor.planx.uk/src/ui/SelectInput.tsx
+++ b/editor.planx.uk/src/ui/SelectInput.tsx
@@ -25,7 +25,7 @@ const Root = styled(Select)(({ theme }) => ({
   padding: theme.spacing(0, 1.5),
   height: 50,
   backgroundColor: "#fff",
-  [`& .${classes.rootSelect}`]: {
+  [`&.${classes.rootSelect}`]: {
     paddingRight: theme.spacing(6),
     boxSizing: "border-box",
     backgroundColor: "#fff",
@@ -34,11 +34,11 @@ const Root = styled(Select)(({ theme }) => ({
     alignItems: "center",
     justifyContent: "flex-start",
   },
-  [`& .${classes.icon}`]: {
+  [`&.${classes.icon}`]: {
     right: theme.spacing(1),
     color: "rgba(0,0,0,0.25)",
   },
-  [`& .${classes.menuPaper}`]: {
+  [`&.${classes.menuPaper}`]: {
     border: `2px solid ${theme.palette.primary.light}`,
     borderTop: 0,
     marginTop: -2,
@@ -59,7 +59,7 @@ const Root = styled(Select)(({ theme }) => ({
       height: "auto",
     },
   },
-  [`& .${classes.inputSelect}`]: {
+  [`&.${classes.inputSelect}`]: {
     backgroundColor: "transparent",
     fontSize: "1rem",
     "&:focus": {