diff --git a/editor.planx.uk/src/@planx/components/Content/Public.tsx b/editor.planx.uk/src/@planx/components/Content/Public.tsx index d8232f954a..7c8584c09e 100644 --- a/editor.planx.uk/src/@planx/components/Content/Public.tsx +++ b/editor.planx.uk/src/@planx/components/Content/Public.tsx @@ -30,7 +30,7 @@ const Content = styled(Box, { "& a": { color: getContrastTextColor(color || "#fff", theme.palette.link.main), }, - "& *:nth-of-type(1)": { + "& *:nth-child(1)": { marginTop: 0, }, })); diff --git a/editor.planx.uk/src/pages/FlowEditor/floweditor.scss b/editor.planx.uk/src/pages/FlowEditor/floweditor.scss index dfe02405c3..9640df4a60 100644 --- a/editor.planx.uk/src/pages/FlowEditor/floweditor.scss +++ b/editor.planx.uk/src/pages/FlowEditor/floweditor.scss @@ -169,7 +169,7 @@ $fontMonospace: "Source Code Pro", monospace; opacity: 0.6; } - > span:not(:first-child) { + > span:not(:nth-child(1)) { margin-left: 6px; } } @@ -477,7 +477,7 @@ $fontMonospace: "Source Code Pro", monospace; $lineWidth; background-repeat: no-repeat, repeat-x, repeat-x; - &:nth-of-type(1) { + &:nth-child(1) { background-position: top center, top right, @@ -517,7 +517,7 @@ $fontMonospace: "Source Code Pro", monospace; $lineWidth 100%, 2px 100%; - &:nth-of-type(1) { + &:nth-child(1) { background-position: left center, left bottom, diff --git a/editor.planx.uk/src/ui/editor/RichTextInput.tsx b/editor.planx.uk/src/ui/editor/RichTextInput.tsx index 5b8d4312f6..c455cad5c4 100644 --- a/editor.planx.uk/src/ui/editor/RichTextInput.tsx +++ b/editor.planx.uk/src/ui/editor/RichTextInput.tsx @@ -97,7 +97,7 @@ export const RichContentContainer = styled(Box)(({ theme }) => ({ }, }, // Styles for placeholder text, to match ui/Input.tsx - "& p.is-editor-empty:first-child::before": { + "& p.is-editor-empty:nth-child(1)::before": { color: theme.palette.text.placeholder, opacity: 1, content: `attr(data-placeholder)`, diff --git a/editor.planx.uk/src/ui/shared/InputRow.tsx b/editor.planx.uk/src/ui/shared/InputRow.tsx index 0c4f5798f3..ff8eab5798 100644 --- a/editor.planx.uk/src/ui/shared/InputRow.tsx +++ b/editor.planx.uk/src/ui/shared/InputRow.tsx @@ -13,7 +13,7 @@ const Root = styled(Box, { "& > *": { flexGrow: 1, marginRight: 5, - "&:first:child": { + "&:nth-child(1)": { marginLeft: 0, }, "&:last-child": { diff --git a/editor.planx.uk/src/ui/shared/InputRowLabel.tsx b/editor.planx.uk/src/ui/shared/InputRowLabel.tsx index e69634e424..f8799618ba 100644 --- a/editor.planx.uk/src/ui/shared/InputRowLabel.tsx +++ b/editor.planx.uk/src/ui/shared/InputRowLabel.tsx @@ -7,6 +7,9 @@ const Label = styled(Typography)(({ theme }) => ({ flexGrow: 0, paddingRight: theme.spacing(2), alignSelf: "center", + "&:not(:nth-child(1))": { + paddingLeft: theme.spacing(2), + }, })) as typeof Typography; export default function InputRowLabel({ children }: { children: ReactNode }) {