improve style for error dialog

ethpandaops · Nov 4, 2024 · d1f5966 · d1f5966
1 parent e22314b
commit d1f5966
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/ui-package/src/components/SubmitDepositsForm/DepositEntry.tsx b/ui-package/src/components/SubmitDepositsForm/DepositEntry.tsx
@@ -67,12 +67,12 @@ const DepositEntry = (props: IDepositEntryProps): React.ReactElement => {
           }
         </button>
         {errorModal && (
-          <Modal show={true} onHide={() => setErrorModal(null)} size="lg">
+          <Modal show={true} onHide={() => setErrorModal(null)} size="lg" className="submit-deposit-modal">
             <Modal.Header closeButton>
               <Modal.Title>Deposit Transaction Failed</Modal.Title>
             </Modal.Header>
             <Modal.Body>
-              <pre className="m-0">{errorModal}</pre>
+              <pre className="m-0 deposit-error">{errorModal}</pre>
             </Modal.Body>
             <Modal.Footer>
               <button className="btn btn-primary" onClick={() => setErrorModal(null)}>Close</button>

diff --git a/ui-package/src/components/SubmitDepositsForm/SubmitDepositsForm.scss b/ui-package/src/components/SubmitDepositsForm/SubmitDepositsForm.scss
@@ -0,0 +1,7 @@
+
+.submit-deposit-modal {
+    .deposit-error {
+        text-wrap: wrap;
+        word-break: break-word;
+    }
+}