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

remove liquidity: slider fixes, output user pool shares

This commit is contained in:
Matthias Kretschmann 2020-10-16 11:46:05 +02:00
parent 3ea627df8d
commit 3a83bea511
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 13 additions and 1 deletions

View File

@ -6,6 +6,11 @@
.userLiquidity {
composes: userLiquidity from './Add.module.css';
max-width: 12rem;
margin-top: -1rem;
margin-left: auto;
margin-right: auto;
margin-bottom: calc(var(--spacer) / 2);
}
.range {

View File

@ -16,6 +16,7 @@ import FormHelp from '../../../atoms/Input/Help'
import Button from '../../../atoms/Button'
import { getMaxValuesRemove } from './utils'
import { graphql, useStaticQuery } from 'gatsby'
import PriceUnit from '../../../atoms/Price/PriceUnit'
const contentQuery = graphql`
query PoolRemoveQuery {
@ -139,6 +140,13 @@ export default function Remove({
<Header title={content.title} backAction={() => setShowRemove(false)} />
<form className={styles.removeInput}>
<div className={styles.userLiquidity}>
<div>
<span>Available:</span>
<PriceUnit price={poolTokens} symbol="pool shares" small />
</div>
</div>
<div className={styles.range}>
<h3>{amountPercent}%</h3>
<div className={styles.slider}>
@ -146,7 +154,6 @@ export default function Remove({
type="range"
min="0"
max={amountMaxPercent}
step={Number(amountMaxPercent) < 10 ? '1' : '10'}
value={amountPercent}
onChange={handleAmountPercentChange}
/>