fix: Consistent editor input border shade (#4221)

theopensystemslab · Jan 28, 2025 · 3cad4b6 · 3cad4b6
1 parent afb3720
commit 3cad4b6
Show file tree

Hide file tree

Showing 6 changed files with 10 additions and 7 deletions.
diff --git a/editor.planx.uk/src/components/EditorNavMenu.tsx b/editor.planx.uk/src/components/EditorNavMenu.tsx
@@ -78,6 +78,9 @@ const MenuButton = styled(IconButton, {
     background: theme.palette.common.white,
     color: theme.palette.text.primary,
     border: `1px solid ${theme.palette.border.main}`,
+    "&:hover": {
+      borderColor: theme.palette.border.main,
+    },
   }),
   ...(disabled && {
     color: theme.palette.text.disabled,

diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/index.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/index.tsx
@@ -86,7 +86,8 @@ const Header = styled("header")(({ theme }) => ({
     padding: "5px",
     marginRight: "5px",
     background: theme.palette.common.white,
-    border: "1px solid rgba(0, 0, 0, 0.2)",
+    border: "1px solid ${theme.palette.border.main}",
+    borderWidth: "1px",
   },
   "& svg": {
     cursor: "pointer",

diff --git a/editor.planx.uk/src/ui/editor/ColorPicker/ColorPicker.tsx b/editor.planx.uk/src/ui/editor/ColorPicker/ColorPicker.tsx
@@ -71,7 +71,7 @@ const StyledButtonBase = styled(ButtonBase, {
   padding: theme.spacing(1),
   whiteSpace: "nowrap",
   backgroundColor: theme.palette.common.white,
-  border: `1px solid ${theme.palette.border.light}`,
+  border: `1px solid ${theme.palette.border.main}`,
   ...(show && {
     color: theme.palette.primary.dark,
     "& .swatch": {

diff --git a/editor.planx.uk/src/ui/editor/RichTextInput/RichTextInput.tsx b/editor.planx.uk/src/ui/editor/RichTextInput/RichTextInput.tsx
@@ -68,7 +68,7 @@ export const RichContentContainer = styled(Box)(({ theme }) => ({
     padding: "12px 15px",
     backgroundColor: theme.palette.common.white,
     minHeight: "50px",
-    border: `1px solid ${theme.palette.border.light}`,
+    border: `1px solid ${theme.palette.border.main}`,
     display: "flex",
     flexDirection: "column",
     justifyContent: "center",

diff --git a/editor.planx.uk/src/ui/shared/Input/Input.tsx b/editor.planx.uk/src/ui/shared/Input/Input.tsx
@@ -50,7 +50,7 @@ const StyledInputBase = styled(InputBase, {
   width: "100%",
   padding: theme.spacing(0, 1.5),
   height: 50,
-  border: `1px solid ${theme.palette.border.light}`,
+  border: `1px solid ${theme.palette.border.main}`,
   "& input": {
     fontWeight: "inherit",
   },
@@ -59,11 +59,10 @@ const StyledInputBase = styled(InputBase, {
     opacity: 1,
   },
   ...(bordered && {
-    border: `2px solid ${theme.palette.text.primary}`,
+    border: `2px solid ${theme.palette.border.input}`,
   }),
   ...(format === "data" && {
     backgroundColor: "#f0f0f0",
-    borderColor: "#d3d3d3",
     fontFamily: theme.typography.data.fontFamily,
     "& input": {
       fontSize: theme.typography.body2.fontSize,

diff --git a/editor.planx.uk/src/ui/shared/PublicFileUploadButton.tsx b/editor.planx.uk/src/ui/shared/PublicFileUploadButton.tsx
@@ -38,7 +38,7 @@ const Root = styled(ButtonBase, {
   flexGrow: 0,
   backgroundColor: theme.palette.background.default,
   color: theme.palette.primary.dark,
-  border: `1px solid ${theme.palette.border.light}`,
+  border: `1px solid ${theme.palette.border.main}`,
   ...(isDragActive && {
     border: `2px dashed ${theme.palette.primary.dark}`,
   }),