From e8698b8273dd9009dc2460d26629db62fe97a69e Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Thu, 8 May 2025 18:22:38 +0000 Subject: [PATCH 1/2] chore: fix first-child warning --- site/src/components/InputGroup/InputGroup.tsx | 4 ++-- site/src/components/Markdown/Markdown.tsx | 10 +++++----- site/src/components/Table/Table.tsx | 6 +++--- site/src/modules/resources/ResourceCard.tsx | 2 +- .../modules/workspaces/WorkspaceTiming/Chart/Chart.tsx | 2 +- .../modules/workspaces/WorkspaceTiming/Chart/XAxis.tsx | 2 +- .../modules/workspaces/WorkspaceTiming/Chart/YAxis.tsx | 2 +- .../TemplateInsightsPage/TemplateInsightsPage.tsx | 2 +- .../WorkspaceNotifications/Notifications.tsx | 2 +- 9 files changed, 16 insertions(+), 16 deletions(-) diff --git a/site/src/components/InputGroup/InputGroup.tsx b/site/src/components/InputGroup/InputGroup.tsx index 74cce008309dd..c475e1e3bee71 100644 --- a/site/src/components/InputGroup/InputGroup.tsx +++ b/site/src/components/InputGroup/InputGroup.tsx @@ -25,7 +25,7 @@ export const InputGroup: FC> = (props) => { zIndex: 2, }, - "& > *:first-child": { + "& > *:first-of-type": { borderTopRightRadius: 0, borderBottomRightRadius: 0, @@ -45,7 +45,7 @@ export const InputGroup: FC> = (props) => { }, }, - "& > *:not(:first-child):not(:last-child)": { + "& > *:not(:first-of-type):not(:last-child)": { borderRadius: 0, "&.MuiFormControl-root .MuiInputBase-root": { diff --git a/site/src/components/Markdown/Markdown.tsx b/site/src/components/Markdown/Markdown.tsx index b68919dce51f8..6fdf9e17a6177 100644 --- a/site/src/components/Markdown/Markdown.tsx +++ b/site/src/components/Markdown/Markdown.tsx @@ -348,19 +348,19 @@ const MarkdownGfmAlert: FC = ({ "[&_p]:m-0 [&_p]:mb-2", alertType === "important" && - "border-highlight-purple [&_p:first-child]:text-highlight-purple", + "border-highlight-purple [&_p:first-of-type]:text-highlight-purple", alertType === "warning" && - "border-border-warning [&_p:first-child]:text-border-warning", + "border-border-warning [&_p:first-of-type]:text-border-warning", alertType === "note" && - "border-highlight-sky [&_p:first-child]:text-highlight-sky", + "border-highlight-sky [&_p:first-of-type]:text-highlight-sky", alertType === "tip" && - "border-highlight-green [&_p:first-child]:text-highlight-green", + "border-highlight-green [&_p:first-of-type]:text-highlight-green", alertType === "caution" && - "border-highlight-red [&_p:first-child]:text-highlight-red", + "border-highlight-red [&_p:first-of-type]:text-highlight-red", )} >

diff --git a/site/src/components/Table/Table.tsx b/site/src/components/Table/Table.tsx index 29714821881f9..c20fe99428e09 100644 --- a/site/src/components/Table/Table.tsx +++ b/site/src/components/Table/Table.tsx @@ -36,10 +36,10 @@ export const TableBody = React.forwardRef< tr:first-child>td]:border-t [&>tr>td:first-child]:border-l", + "[&>tr:first-of-type>td]:border-t [&>tr>td:first-of-type]:border-l", "[&>tr:last-child>td]:border-b [&>tr>td:last-child]:border-r", - "[&>tr:first-child>td:first-child]:rounded-tl-md [&>tr:first-child>td:last-child]:rounded-tr-md", - "[&>tr:last-child>td:first-child]:rounded-bl-md [&>tr:last-child>td:last-child]:rounded-br-md", + "[&>tr:first-of-type>td:first-of-type]:rounded-tl-md [&>tr:first-of-type>td:last-child]:rounded-tr-md", + "[&>tr:last-child>td:first-of-type]:rounded-bl-md [&>tr:last-child>td:last-child]:rounded-br-md", className, )} {...props} diff --git a/site/src/modules/resources/ResourceCard.tsx b/site/src/modules/resources/ResourceCard.tsx index 325a737e1adc1..14f308f36b642 100644 --- a/site/src/modules/resources/ResourceCard.tsx +++ b/site/src/modules/resources/ResourceCard.tsx @@ -19,7 +19,7 @@ const styles = { borderBottom: 0, }, - "&:first-child": { + "&:first-of-type": { borderTopLeftRadius: 8, borderTopRightRadius: 8, }, diff --git a/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx b/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx index 8d4f98e1d4c42..cdef0fc68bdc2 100644 --- a/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx +++ b/site/src/modules/workspaces/WorkspaceTiming/Chart/Chart.tsx @@ -185,7 +185,7 @@ const styles = { }, }, - "& li:first-child": { + "& li:first-of-type": { color: theme.palette.text.secondary, }, diff --git a/site/src/modules/workspaces/WorkspaceTiming/Chart/XAxis.tsx b/site/src/modules/workspaces/WorkspaceTiming/Chart/XAxis.tsx index d86731a615327..82c385e533802 100644 --- a/site/src/modules/workspaces/WorkspaceTiming/Chart/XAxis.tsx +++ b/site/src/modules/workspaces/WorkspaceTiming/Chart/XAxis.tsx @@ -56,7 +56,7 @@ const XAxisLabel: FC> = (props) => { // Note: This adjustment is not applied to the first element, // as the 0 label/value is not displayed in the chart. width: "calc(var(--x-axis-width) * 2)", - "&:not(:first-child)": { + "&:not(:first-of-type)": { marginLeft: "calc(-1 * var(--x-axis-width))", }, }, diff --git a/site/src/modules/workspaces/WorkspaceTiming/Chart/YAxis.tsx b/site/src/modules/workspaces/WorkspaceTiming/Chart/YAxis.tsx index 4903f306c1ad4..2812904fdc6d9 100644 --- a/site/src/modules/workspaces/WorkspaceTiming/Chart/YAxis.tsx +++ b/site/src/modules/workspaces/WorkspaceTiming/Chart/YAxis.tsx @@ -35,7 +35,7 @@ const styles = { flexShrink: 0, }, section: (theme) => ({ - "&:not(:first-child)": { + "&:not(:first-of-type)": { borderTop: `1px solid ${theme.palette.divider}`, }, }), diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx index 33711e98e2f0f..325b86a70cf37 100644 --- a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx +++ b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx @@ -559,7 +559,7 @@ const TemplateParametersUsagePanel: FC = ({ marginRight: -24, borderTop: `1px solid ${theme.palette.divider}`, width: "calc(100% + 48px)", - "&:first-child": { + "&:first-of-type": { borderTop: 0, }, gap: 24, diff --git a/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx b/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx index 24fae9d4b073a..2a3efaae27cc7 100644 --- a/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx @@ -123,7 +123,7 @@ const styles = { lineHeight: "1.5", borderTop: `1px solid ${theme.palette.divider}`, - "&:first-child": { + "&:first-of-type": { borderTop: 0, }, }), From 959bf49310435936e2b98135ef58bb65fe0c4d34 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Fri, 9 May 2025 14:01:12 +0000 Subject: [PATCH 2/2] fix input group border --- site/src/components/InputGroup/InputGroup.tsx | 5 ----- 1 file changed, 5 deletions(-) diff --git a/site/src/components/InputGroup/InputGroup.tsx b/site/src/components/InputGroup/InputGroup.tsx index c475e1e3bee71..faa8d98beabb6 100644 --- a/site/src/components/InputGroup/InputGroup.tsx +++ b/site/src/components/InputGroup/InputGroup.tsx @@ -28,11 +28,6 @@ export const InputGroup: FC> = (props) => { "& > *:first-of-type": { borderTopRightRadius: 0, borderBottomRightRadius: 0, - - "&.MuiFormControl-root .MuiInputBase-root": { - borderTopRightRadius: 0, - borderBottomRightRadius: 0, - }, }, "& > *:last-child": {