feat: show redefine warnings on mobile

- adds RedefineMessage to TxChecks for small screens
- changes order of Redefine scan results and Tenderly Simulation

src/components/tx/SignOrExecuteForm/TxChecks.tsx

@@ -1,8 +1,10 @@
 import { type ReactElement, useContext } from 'react'
 import { TxSimulation } from '@/components/tx/security/tenderly'
 import { SafeTxContext } from '@/components/tx-flow/SafeTxProvider'
-import { Typography } from '@mui/material'
-import { Redefine } from '@/components/tx/security/redefine'
+import { Box, Typography } from '@mui/material'
+import { Redefine, RedefineMessage } from '@/components/tx/security/redefine'
+
+import css from './styles.module.css'
 
 const TxChecks = (): ReactElement => {
   const { safeTx } = useContext(SafeTxContext)
@@ -11,9 +13,13 @@ const TxChecks = (): ReactElement => {
     <>
       <Typography variant="h5">Transaction checks</Typography>
 
+      <TxSimulation disabled={false} transactions={safeTx} />
+
       <Redefine />
 
-      <TxSimulation disabled={false} transactions={safeTx} />
+      <Box className={css.mobileRedefineMessages}>
+        <RedefineMessage />
+      </Box>
     </>
   )
 }

src/components/tx/SignOrExecuteForm/styles.module.css

@@ -45,3 +45,13 @@
 .errorWrapper {
   margin-top: var(--space-2) !important;
 }
+
+.mobileRedefineMessages {
+  display: none;
+}
+
+@media (max-width: 899.95px) {
+  .mobileRedefineMessages {
+    display: block;
+  }
+}