Fix confirmation modal style (#1310)
This commit is contained in:
@ -25,14 +25,19 @@ export type ConfirmationModalProps = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const StyledConfirmationModal = styled(Modal)`
|
const StyledConfirmationModal = styled(Modal)`
|
||||||
padding: ${({ theme }) => theme.spacing(4)};
|
border-radius: ${({ theme }) => theme.spacing(1)};
|
||||||
width: calc(400px - ${({ theme }) => theme.spacing(10 * 2)});
|
padding: ${({ theme }) => theme.spacing(6)};
|
||||||
|
width: calc(400px - ${({ theme }) => theme.spacing(32)});
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const StyledCenteredButton = styled(Button)`
|
const StyledCenteredButton = styled(Button)`
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
const StyledCenteredTitle = styled.div`
|
||||||
|
text-align: center;
|
||||||
|
`;
|
||||||
|
|
||||||
export const StyledConfirmationButton = styled(StyledCenteredButton)`
|
export const StyledConfirmationButton = styled(StyledCenteredButton)`
|
||||||
border-color: ${({ theme }) => theme.color.red20};
|
border-color: ${({ theme }) => theme.color.red20};
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
@ -82,7 +87,9 @@ export function ConfirmationModal({
|
|||||||
}}
|
}}
|
||||||
onEnter={onConfirmClick}
|
onEnter={onConfirmClick}
|
||||||
>
|
>
|
||||||
<H1Title title={title} fontColor={H1TitleFontColor.Primary} />
|
<StyledCenteredTitle>
|
||||||
|
<H1Title title={title} fontColor={H1TitleFontColor.Primary} />
|
||||||
|
</StyledCenteredTitle>
|
||||||
<Section
|
<Section
|
||||||
alignment={SectionAlignment.Center}
|
alignment={SectionAlignment.Center}
|
||||||
fontColor={SectionFontColor.Primary}
|
fontColor={SectionFontColor.Primary}
|
||||||
|
|||||||
Reference in New Issue
Block a user