Fix footer styling

MetaMask · Aug 15, 2024 · 8b396dd · 8b396dd
1 parent 5bd74fd
commit 8b396dd
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 24 deletions.
diff --git a/ui/components/app/snaps/snap-ui-renderer/index.scss b/ui/components/app/snaps/snap-ui-renderer/index.scss
@@ -1,4 +1,8 @@
 .snap-ui-renderer {
+  &__content {
+    margin-bottom: 0 !important;
+  }
+
   &__container {
     & > div:first-child {
       padding: 16px;
@@ -42,11 +46,9 @@
   }
 
   &__footer {
-    grid-area: footer;
     margin-top: auto;
 
     &-centered {
-      grid-area: footer;
       margin-top: auto;
 
       & button {

diff --git a/ui/pages/confirmations/confirmation/confirmation.js b/ui/pages/confirmations/confirmation/confirmation.js
@@ -500,14 +500,21 @@ export default function ConfirmationPage({
           </button>
         </div>
       )}
-      {isSnapCustomUIDialog ? (
-        <>
+      <div className="confirmation-page__content">
+        {isSnapCustomUIDialog && (
           <Box width={BlockSize.Screen}>
             <SnapAuthorshipHeader
               snapId={pendingConfirmation?.origin}
               onCancel={handleSnapDialogCancel}
             />
           </Box>
+        )}
+        {templatedValues.networkDisplay ? (
+          <Box justifyContent="center" marginTop={2}>
+            <NetworkDisplay />
+          </Box>
+        ) : null}
+        {isSnapCustomUIDialog ? (
           <SnapUIRenderer
             snapId={pendingConfirmation?.origin}
             interfaceId={pendingConfirmation?.requestData.id}
@@ -521,27 +528,21 @@ export default function ConfirmationPage({
             onCancel={handleSnapDialogCancel}
             useFooter={isSnapDefaultDialog}
           />
-        </>
-      ) : (
-        <div className="confirmation-page__content">
-          {templatedValues.networkDisplay ? (
-            <Box justifyContent="center" marginTop={2}>
-              <NetworkDisplay />
-            </Box>
-          ) : null}
+        ) : (
           <MetaMaskTemplateRenderer sections={templatedValues.content} />
-          {showWarningModal && (
-            <ConfirmationWarningModal
-              onSubmit={async () => {
-                const res = await templatedValues.onSubmit();
-                await handleSubmitResult(res);
-                setShowWarningModal(false);
-              }}
-              onCancel={templatedValues.onCancel}
-            />
-          )}
-        </div>
-      )}
+        )}
+
+        {showWarningModal && (
+          <ConfirmationWarningModal
+            onSubmit={async () => {
+              const res = await templatedValues.onSubmit();
+              await handleSubmitResult(res);
+              setShowWarningModal(false);
+            }}
+            onCancel={templatedValues.onCancel}
+          />
+        )}
+      </div>
       {!isSnapDefaultDialog && (
         <ConfirmationFooter
           alerts={