mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
fix: incoming webhooks form UI adjustments (#5973)
Small UI improvements in the new incoming webhooks form after aligning with @nicolaesocaciu. ![image](https://github.com/Unleash/unleash/assets/14320932/6f829863-ab94-4d35-a1d7-d8722e8ec159)
This commit is contained in:
parent
7b30ab09d2
commit
77fcc9e840
@ -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 (
|
||||
<div>
|
||||
<IncomingWebhooksFormURL name={name} />
|
||||
<StyledRaisedSection>
|
||||
<FormSwitch checked={enabled} setChecked={setEnabled}>
|
||||
Incoming webhook status
|
||||
@ -136,6 +135,7 @@ export const IncomingWebhooksForm = ({
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
autoComplete='off'
|
||||
/>
|
||||
<IncomingWebhooksFormURL name={name} />
|
||||
<ConditionallyRender
|
||||
condition={incomingWebhook === undefined}
|
||||
show={
|
||||
|
@ -7,23 +7,22 @@ import useToast from 'hooks/useToast';
|
||||
const StyledIncomingWebhookUrlSection = styled('div')(({ theme }) => ({
|
||||
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 = ({
|
||||
<StyledIncomingWebhookUrl>
|
||||
{url}
|
||||
<Tooltip title='Copy URL' arrow>
|
||||
<IconButton onClick={onCopyToClipboard} size='small'>
|
||||
<IconButton onClick={onCopyToClipboard} size='large'>
|
||||
<CopyIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
Loading…
Reference in New Issue
Block a user