fix: UI/UX tweaks
This commit is contained in:
parent
c641d6d3fa
commit
d78594c325
6 changed files with 18 additions and 19 deletions
|
|
@ -1,4 +1,4 @@
|
||||||
import { spacer, white, errorColor } from 'src/styling/variables'
|
import { spacer, white } from 'src/styling/variables'
|
||||||
const styles = {
|
const styles = {
|
||||||
grid: {
|
grid: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
|
|
@ -32,7 +32,7 @@ const styles = {
|
||||||
marginLeft: 8
|
marginLeft: 8
|
||||||
},
|
},
|
||||||
error: {
|
error: {
|
||||||
color: errorColor
|
marginTop: 20
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ import * as R from 'ramda'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import * as Yup from 'yup'
|
import * as Yup from 'yup'
|
||||||
|
|
||||||
|
import ErrorMessage from 'src/components/ErrorMessage'
|
||||||
import Modal from 'src/components/Modal'
|
import Modal from 'src/components/Modal'
|
||||||
import { Link } from 'src/components/buttons'
|
import { Link } from 'src/components/buttons'
|
||||||
import { TextInput } from 'src/components/inputs/formik'
|
import { TextInput } from 'src/components/inputs/formik'
|
||||||
|
|
@ -32,7 +33,10 @@ const BlackListModal = ({
|
||||||
LTC: 'LPKvbjwV1Kaksktzkr7TMK3FQtQEEe6Wqa',
|
LTC: 'LPKvbjwV1Kaksktzkr7TMK3FQtQEEe6Wqa',
|
||||||
DASH: 'XqQ7gU8eM76rEfey726cJpT2RGKyJyBrcn',
|
DASH: 'XqQ7gU8eM76rEfey726cJpT2RGKyJyBrcn',
|
||||||
ZEC: 't1KGyyv24eL354C9gjveBGEe8Xz9UoPKvHR',
|
ZEC: 't1KGyyv24eL354C9gjveBGEe8Xz9UoPKvHR',
|
||||||
BCH: 'qrd6za97wm03lfyg82w0c9vqgc727rhemg5yd9k3dm'
|
BCH: 'qrd6za97wm03lfyg82w0c9vqgc727rhemg5yd9k3dm',
|
||||||
|
USDT: '0x5754284f345afc66a98fbb0a0afe71e0f007b949',
|
||||||
|
XMR:
|
||||||
|
'888tNkZrPN6JsEgekjMnABU4TBzc2Dt29EPAvkRxbANsAnjyPbb3iQ1YBRk1UXcdRsiKc9dhwMVgN5S9cQUiyoogDavup3H'
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -53,9 +57,8 @@ const BlackListModal = ({
|
||||||
.trim()
|
.trim()
|
||||||
.required('An address is required')
|
.required('An address is required')
|
||||||
})}
|
})}
|
||||||
onSubmit={({ address }, { resetForm }) => {
|
onSubmit={({ address }) => {
|
||||||
handleAddToBlacklist(address.trim())
|
handleAddToBlacklist(address.trim())
|
||||||
resetForm()
|
|
||||||
}}>
|
}}>
|
||||||
<Form id="address-form">
|
<Form id="address-form">
|
||||||
<H3 className={classes.modalTitle}>
|
<H3 className={classes.modalTitle}>
|
||||||
|
|
@ -63,7 +66,6 @@ const BlackListModal = ({
|
||||||
? `Blacklist ${R.toLower(selectedCoin.display)} address`
|
? `Blacklist ${R.toLower(selectedCoin.display)} address`
|
||||||
: ''}
|
: ''}
|
||||||
</H3>
|
</H3>
|
||||||
<span className={classes.error}>{errorMsg}</span>
|
|
||||||
<Field
|
<Field
|
||||||
name="address"
|
name="address"
|
||||||
fullWidth
|
fullWidth
|
||||||
|
|
@ -72,6 +74,9 @@ const BlackListModal = ({
|
||||||
placeholder={`ex: ${placeholderAddress[selectedCoin.code]}`}
|
placeholder={`ex: ${placeholderAddress[selectedCoin.code]}`}
|
||||||
component={TextInput}
|
component={TextInput}
|
||||||
/>
|
/>
|
||||||
|
{!R.isNil(errorMsg) && (
|
||||||
|
<ErrorMessage className={classes.error}>{errorMsg}</ErrorMessage>
|
||||||
|
)}
|
||||||
</Form>
|
</Form>
|
||||||
</Formik>
|
</Formik>
|
||||||
<div className={classes.footer}>
|
<div className={classes.footer}>
|
||||||
|
|
|
||||||
|
|
@ -212,7 +212,9 @@ const Funding = () => {
|
||||||
<div className={classes.addressWrapper}>
|
<div className={classes.addressWrapper}>
|
||||||
<div className={classes.mono}>
|
<div className={classes.mono}>
|
||||||
<strong>
|
<strong>
|
||||||
<CopyToClipboard buttonClassname={classes.copyToClipboard}>
|
<CopyToClipboard
|
||||||
|
buttonClassname={classes.copyToClipboard}
|
||||||
|
key={selected.cryptoCode}>
|
||||||
{formatAddress(
|
{formatAddress(
|
||||||
selected.cryptoCode,
|
selected.cryptoCode,
|
||||||
selected.fundingAddress
|
selected.fundingAddress
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,6 @@ import { DeleteDialog } from 'src/components/DeleteDialog'
|
||||||
import { Link, Button, IconButton } from 'src/components/buttons'
|
import { Link, Button, IconButton } from 'src/components/buttons'
|
||||||
import DataTable from 'src/components/tables/DataTable'
|
import DataTable from 'src/components/tables/DataTable'
|
||||||
import { Label3, TL1 } from 'src/components/typography'
|
import { Label3, TL1 } from 'src/components/typography'
|
||||||
import { ReactComponent as CardIdIcon } from 'src/styling/icons/ID/card/zodiac.svg'
|
|
||||||
import { ReactComponent as PhoneIdIcon } from 'src/styling/icons/ID/phone/zodiac.svg'
|
import { ReactComponent as PhoneIdIcon } from 'src/styling/icons/ID/phone/zodiac.svg'
|
||||||
import { ReactComponent as DeleteIcon } from 'src/styling/icons/action/delete/enabled.svg'
|
import { ReactComponent as DeleteIcon } from 'src/styling/icons/action/delete/enabled.svg'
|
||||||
|
|
||||||
|
|
@ -49,7 +48,6 @@ const GET_CUSTOMERS = gql`
|
||||||
id
|
id
|
||||||
phone
|
phone
|
||||||
idCardData
|
idCardData
|
||||||
phone
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
@ -102,12 +100,6 @@ const IndividualDiscounts = () => {
|
||||||
<div className={classes.identification}>
|
<div className={classes.identification}>
|
||||||
<PhoneIdIcon />
|
<PhoneIdIcon />
|
||||||
<span>{customer.phone}</span>
|
<span>{customer.phone}</span>
|
||||||
{customer?.idCardData?.documentNumber && (
|
|
||||||
<>
|
|
||||||
<CardIdIcon />
|
|
||||||
<span>{customer?.idCardData?.documentNumber}</span>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -183,10 +183,10 @@ const InfoPanel = ({ step, config = {}, liveValues = {}, currency }) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<H5 className={classes.infoTitle}>Trigger overview so far</H5>
|
<H5 className={classes.infoTitle}>Trigger overview so far</H5>
|
||||||
<Info3 noMargin className={classes.infoText}>
|
<Info3 noMargin>
|
||||||
{oldText}
|
{oldText}
|
||||||
{step !== 1 && ', '}
|
{step !== 1 && ', '}
|
||||||
{newText}
|
<span className={classes.infoCurrentText}>{newText}</span>
|
||||||
{!isLastStep && '...'}
|
{!isLastStep && '...'}
|
||||||
</Info3>
|
</Info3>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -61,7 +61,7 @@ const getDefaultSettings = () => {
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
name: 'expirationTime',
|
name: 'expirationTime',
|
||||||
header: 'Expiration Time',
|
header: 'Expiration time',
|
||||||
width: 196,
|
width: 196,
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
editable: false
|
editable: false
|
||||||
|
|
@ -101,7 +101,7 @@ const getOverrides = () => {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'expirationTime',
|
name: 'expirationTime',
|
||||||
header: 'Expiration Time',
|
header: 'Expiration time',
|
||||||
width: 196,
|
width: 196,
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
editable: false
|
editable: false
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue