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

add/remove inputs

This commit is contained in:
Matthias Kretschmann 2020-08-26 09:01:43 +02:00
parent 63fe171dd7
commit 5e61123669
Signed by: m
GPG Key ID: 606EEEF3C479A91F
4 changed files with 32 additions and 15 deletions

View File

@ -1,2 +1,7 @@
.add { .add {
} }
.addInput {
max-width: 12rem;
margin: 0 auto var(--spacer) auto;
}

View File

@ -7,6 +7,7 @@ import { useOcean } from '@oceanprotocol/react'
import Header from './Header' import Header from './Header'
import Loader from '../../../atoms/Loader' import Loader from '../../../atoms/Loader'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import InputElement from '../../../atoms/Input/InputElement'
export default function Add({ export default function Add({
setShowAdd, setShowAdd,
@ -47,14 +48,16 @@ export default function Add({
<div className={styles.add}> <div className={styles.add}>
<Header title="Add Liquidity" backAction={() => setShowAdd(false)} /> <Header title="Add Liquidity" backAction={() => setShowAdd(false)} />
<Input <div className={styles.addInput}>
name="ocean" <InputElement
label="OCEAN" value={amount}
type="number" name="ocean"
placeholder="0" type="number"
onChange={handleAmountChange} prefix="OCEAN"
/> placeholder="0"
{/* <Input name="dt" label={dtSymbol} type="number" placeholder="0" /> */} onChange={handleAmountChange}
/>
</div>
<p>You will receive:</p> <p>You will receive:</p>

View File

@ -0,0 +1,4 @@
.removeInput {
max-width: 12rem;
margin: 0 auto var(--spacer) auto;
}

View File

@ -7,6 +7,7 @@ import { useOcean } from '@oceanprotocol/react'
import Header from './Header' import Header from './Header'
import { toast } from 'react-toastify' import { toast } from 'react-toastify'
import Loader from '../../../atoms/Loader' import Loader from '../../../atoms/Loader'
import InputElement from '../../../atoms/Input/InputElement'
export default function Remove({ export default function Remove({
setShowRemove, setShowRemove,
@ -51,13 +52,17 @@ export default function Remove({
backAction={() => setShowRemove(false)} backAction={() => setShowRemove(false)}
/> />
<Input <div className={styles.removeInput}>
name="ocean" <InputElement
label="OCEAN" value={amount}
type="number" name="ocean"
placeholder="0" type="number"
onChange={handleAmountChange} prefix="OCEAN"
/> placeholder="0"
onChange={handleAmountChange}
/>
</div>
{/* <Input name="dt" label={dtSymbol} type="number" placeholder="0" /> */} {/* <Input name="dt" label={dtSymbol} type="number" placeholder="0" /> */}
<p>You will receive:</p> <p>You will receive:</p>