Add spacing between Tx

synapsecns · Jan 7, 2024 · 1c5af4f · 1c5af4f
1 parent f215684
commit 1c5af4f
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 19 deletions.
diff --git a/packages/synapse-interface/components/_Transaction/_Transaction.tsx b/packages/synapse-interface/components/_Transaction/_Transaction.tsx
@@ -130,7 +130,7 @@ export const _Transaction = ({
     <div
       data-test-id="_transaction"
       className={`
-        flex flex-col gap-1 justify-end items-center
+        flex flex-col gap-1 justify-end items-center my-2
         bg-tint fill-surface text-primary
         border border-solid border-surface rounded-md
       `}

diff --git a/packages/synapse-interface/components/_Transaction/_Transactions.tsx b/packages/synapse-interface/components/_Transaction/_Transactions.tsx
@@ -34,23 +34,27 @@ export const _Transactions = ({
   }, [])
 
   if (hasTransactions) {
-    return transactionsArray.map((tx: _TransactionDetails) => (
-      <_Transaction
-        synapseSDK={synapseSDK}
-        connectedAddress={connectedAddress}
-        originValue={Number(tx.originValue)}
-        originChain={tx.originChain}
-        originToken={tx.originToken}
-        destinationChain={tx.destinationChain}
-        destinationToken={tx.destinationToken}
-        originTxHash={tx.originTxHash}
-        bridgeModuleName={tx.bridgeModuleName}
-        estimatedTime={tx.estimatedTime}
-        kappa={tx?.kappa}
-        timestamp={tx.timestamp}
-        currentTime={currentTime}
-        isComplete={tx.isComplete}
-      />
-    ))
+    return (
+      <div className="mt-3">
+        {transactionsArray.map((tx: _TransactionDetails) => (
+          <_Transaction
+            synapseSDK={synapseSDK}
+            connectedAddress={connectedAddress}
+            originValue={Number(tx.originValue)}
+            originChain={tx.originChain}
+            originToken={tx.originToken}
+            destinationChain={tx.destinationChain}
+            destinationToken={tx.destinationToken}
+            originTxHash={tx.originTxHash}
+            bridgeModuleName={tx.bridgeModuleName}
+            estimatedTime={tx.estimatedTime}
+            kappa={tx?.kappa}
+            timestamp={tx.timestamp}
+            currentTime={currentTime}
+            isComplete={tx.isComplete}
+          />
+        ))}
+      </div>
+    )
   }
 }