1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-11-15 01:34:57 +01:00

adding liquidity success output tweaks

This commit is contained in:
Matthias Kretschmann 2020-10-07 13:55:54 +02:00
parent 231fdbb7fe
commit 5eef2275fe
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 27 additions and 9 deletions

View File

@ -11,6 +11,11 @@
justify-content: center; justify-content: center;
} }
.actions + div {
margin-top: calc(var(--spacer) / 2);
margin-bottom: calc(var(--spacer) / 2);
}
.actions button { .actions button {
margin-left: calc(var(--spacer) / 4); margin-left: calc(var(--spacer) / 4);
margin-right: calc(var(--spacer) / 4); margin-right: calc(var(--spacer) / 4);

View File

@ -3,6 +3,7 @@ import Loader from '../../../atoms/Loader'
import Button from '../../../atoms/Button' import Button from '../../../atoms/Button'
import Alert from '../../../atoms/Alert' import Alert from '../../../atoms/Alert'
import styles from './Actions.module.css' import styles from './Actions.module.css'
import EtherscanLink from '../../../atoms/EtherscanLink'
export default function Actions({ export default function Actions({
isLoading, isLoading,
@ -18,15 +19,27 @@ export default function Actions({
action: () => void action: () => void
}): ReactElement { }): ReactElement {
return ( return (
<div className={styles.actions}> <>
{isLoading ? ( <div className={styles.actions}>
<Loader message={loaderMessage} /> {isLoading ? (
) : ( <Loader message={loaderMessage} />
<Button style="primary" size="small" onClick={() => action()}> ) : (
{actionName} <Button style="primary" size="small" onClick={() => action()}>
</Button> {actionName}
</Button>
)}
</div>
{txId && (
<>
<Alert
text={`Successfully added liquidity. Transaction ID: ${txId}`}
state="success"
/>
<EtherscanLink network="rinkeby" path={`/tx/${txId}`}>
Etherscan
</EtherscanLink>
</>
)} )}
{txId && <Alert text={`Transaction ID: ${txId}`} state="success" />} </>
</div>
) )
} }