diff --git a/stylesheets/_modal.scss b/stylesheets/_modal.scss
index fcf19aa74..a331c7e47 100644
--- a/stylesheets/_modal.scss
+++ b/stylesheets/_modal.scss
@@ -128,6 +128,13 @@
.session-confirm-wrapper {
.session-modal__body {
width: 376px;
+ }
+ }
+}
+
+.no-body-padding {
+ .session-confirm-wrapper {
+ .session-modal__body {
padding: 0;
.session-modal__centered {
margin: 0;
diff --git a/ts/components/buttons/ModalConfirmButtonContainer.tsx b/ts/components/buttons/ModalConfirmButtonContainer.tsx
deleted file mode 100644
index 573c38fe7..000000000
--- a/ts/components/buttons/ModalConfirmButtonContainer.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import styled from 'styled-components';
-import { Flex } from '../basic/Flex';
-
-/** We use this in the modals only to bypass the padding on the body so the buttons take up the full space width of the modal window
- * See .session-modal__body for padding values
- */
-export const ModalConfirmButtonContainer = styled(Flex)`
- margin-top: 0px;
- margin-right: calc(var(--margins-lg) * -1);
- margin-bottom: calc(var(--margins-lg) * -1);
- margin-left: calc(var(--margins-lg) * -1);
-`;
diff --git a/ts/components/dialog/HideRecoveryPasswordDialog.tsx b/ts/components/dialog/HideRecoveryPasswordDialog.tsx
index 77b93d16c..0a54451fe 100644
--- a/ts/components/dialog/HideRecoveryPasswordDialog.tsx
+++ b/ts/components/dialog/HideRecoveryPasswordDialog.tsx
@@ -5,10 +5,10 @@ import { SettingsKey } from '../../data/settings-key';
import { updateHideRecoveryPasswordModel } from '../../state/ducks/modalDialog';
import { showSettingsSection } from '../../state/ducks/section';
import { SessionWrapperModal } from '../SessionWrapperModal';
+import { Flex } from '../basic/Flex';
import { SessionButton, SessionButtonColor, SessionButtonType } from '../basic/SessionButton';
import { SessionHtmlRenderer } from '../basic/SessionHTMLRenderer';
import { SpacerMD } from '../basic/Text';
-import { ModalConfirmButtonContainer } from '../buttons/ModalConfirmButtonContainer';
const StyledDescriptionContainer = styled.div`
width: 280px;
@@ -76,6 +76,7 @@ export function HideRecoveryPasswordDialog(props: HideRecoveryPasswordDialogProp
onClose={onClose}
showExitIcon={false}
showHeader={true}
+ additionalClassName="no-body-padding"
>
-
-
-
-
+
+
+
+
);
}
diff --git a/ts/components/dialog/ReactListModal.tsx b/ts/components/dialog/ReactListModal.tsx
index c7f260f8e..632a55a69 100644
--- a/ts/components/dialog/ReactListModal.tsx
+++ b/ts/components/dialog/ReactListModal.tsx
@@ -334,7 +334,7 @@ export const ReactListModal = (props: Props) => {
return (
diff --git a/ts/components/dialog/TermsOfServicePrivacyDialog.tsx b/ts/components/dialog/TermsOfServicePrivacyDialog.tsx
index f3e7cce98..ec8a77411 100644
--- a/ts/components/dialog/TermsOfServicePrivacyDialog.tsx
+++ b/ts/components/dialog/TermsOfServicePrivacyDialog.tsx
@@ -2,9 +2,9 @@ import { shell } from 'electron';
import { useDispatch } from 'react-redux';
import { updateTermsOfServicePrivacyModal } from '../../state/onboarding/ducks/modals';
import { SessionWrapperModal } from '../SessionWrapperModal';
+import { Flex } from '../basic/Flex';
import { SessionButton, SessionButtonType } from '../basic/SessionButton';
import { SpacerSM } from '../basic/Text';
-import { ModalConfirmButtonContainer } from '../buttons/ModalConfirmButtonContainer';
export type TermsOfServicePrivacyDialogProps = {
show: boolean;
@@ -30,10 +30,11 @@ export function TermsOfServicePrivacyDialog(props: TermsOfServicePrivacyDialogPr
showExitIcon={true}
showHeader={true}
headerReverse={true}
+ additionalClassName={'no-body-padding'}
>
{window.i18n('urlOpenBrowser')}
-
+
-
+
);
}