diff --git a/frontend/src/component/incomingWebhooks/IncomingWebhooksModal/IncomingWebhooksForm/IncomingWebhooksForm.tsx b/frontend/src/component/incomingWebhooks/IncomingWebhooksModal/IncomingWebhooksForm/IncomingWebhooksForm.tsx index b0a6c5bd511..7ab5618dd99 100644 --- a/frontend/src/component/incomingWebhooks/IncomingWebhooksModal/IncomingWebhooksForm/IncomingWebhooksForm.tsx +++ b/frontend/src/component/incomingWebhooks/IncomingWebhooksModal/IncomingWebhooksForm/IncomingWebhooksForm.tsx @@ -30,7 +30,7 @@ const StyledInputDescription = styled('p')(({ theme }) => ({ color: theme.palette.text.primary, marginBottom: theme.spacing(1), '&:not(:first-of-type)': { - marginTop: theme.spacing(4), + marginTop: theme.spacing(3), }, })); @@ -105,7 +105,6 @@ export const IncomingWebhooksForm = ({ return (
- Incoming webhook status @@ -136,6 +135,7 @@ export const IncomingWebhooksForm = ({ onChange={(e) => setDescription(e.target.value)} autoComplete='off' /> + ({ display: 'flex', flexDirection: 'column', - alignItems: 'center', padding: theme.spacing(1.5), gap: theme.spacing(1.5), border: `1px solid ${theme.palette.divider}`, borderRadius: theme.shape.borderRadiusMedium, marginBottom: theme.spacing(4), + marginTop: theme.spacing(3), })); const StyledIncomingWebhookUrlSectionDescription = styled('p')(({ theme }) => ({ fontSize: theme.fontSizes.smallBody, - color: theme.palette.text.secondary, })); const StyledIncomingWebhookUrl = styled('div')(({ theme }) => ({ fontSize: theme.fontSizes.smallBody, backgroundColor: theme.palette.background.elevation2, - padding: theme.spacing(1), + padding: theme.spacing(0.5, 1, 0.5, 2), width: '100%', borderRadius: theme.shape.borderRadiusMedium, display: 'flex', @@ -60,7 +59,7 @@ export const IncomingWebhooksFormURL = ({ {url} - +