cerc-io/cosmos-multisig-ui
12
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 5 Wiki Activity

Tweak styles for n messages in TransactionInfo

Browse Source
This commit is contained in:
abefernan
2023-05-05 13:20:46 +02:00
parent c7f7244948
commit c2d51d179f
1 changed files with 29 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/dataViews/TransactionInfo/index.tsx
+29 -26
View File
@@ -23,43 +23,46 @@ const TransactionInfo = ({ tx }: Props) => {
const { state } = useAppContext();
return (
<StackableContainer lessPadding lessMargin>
<>
<ul className="meta-data">
<>
{tx.msgs.map((msg, index) => (
<>
{isTxMsgSend(msg) ? <TxMsgSendDetails key={index} msg={msg} /> : null}
{isTxMsgDelegate(msg) ? <TxMsgDelegateDetails key={index} msg={msg} /> : null}
{isTxMsgUndelegate(msg) ? <TxMsgUndelegateDetails key={index} msg={msg} /> : null}
{isTxMsgRedelegate(msg) ? <TxMsgRedelegateDetails key={index} msg={msg} /> : null}
{isTxMsgClaimRewards(msg) ? <TxMsgClaimRewardsDetails key={index} msg={msg} /> : null}
</>
<StackableContainer key={index} lessPadding lessMargin>
{isTxMsgSend(msg) ? <TxMsgSendDetails msg={msg} /> : null}
{isTxMsgDelegate(msg) ? <TxMsgDelegateDetails msg={msg} /> : null}
{isTxMsgUndelegate(msg) ? <TxMsgUndelegateDetails msg={msg} /> : null}
{isTxMsgRedelegate(msg) ? <TxMsgRedelegateDetails msg={msg} /> : null}
{isTxMsgClaimRewards(msg) ? <TxMsgClaimRewardsDetails msg={msg} /> : null}
</StackableContainer>
))}
{tx.fee ? (
<>
<StackableContainer lessPadding lessMargin>
{tx.fee ? (
<>
<li>
<label>Gas:</label>
<div>{tx.fee.gas}</div>
</li>
<li>
<label>Fee:</label>
<div>{printableCoins(tx.fee.amount, state.chain)}</div>
</li>
</>
) : null}
{tx.memo ? (
<li>
<label>Gas:</label>
<div>{tx.fee.gas}</div>
<label>Memo:</label>
<div>{tx.memo}</div>
</li>
<li>
<label>Fee:</label>
<div>{printableCoins(tx.fee.amount, state.chain)}</div>
</li>
</>
) : null}
{tx.memo ? (
<li>
<label>Memo:</label>
<div>{tx.memo}</div>
</li>
) : null}
) : null}
</StackableContainer>
</>
</ul>
<style jsx>{`
ul {
.meta-data {
list-style: none;
padding: 0;
margin: 0;
margin-top: 25px;
}
.meta-data li {
margin-top: 10px;
@@ -80,7 +83,7 @@ const TransactionInfo = ({ tx }: Props) => {
display: block;
}
`}</style>
</StackableContainer>
</>
);
};