8334bd274f
* feat: transactions page * fix: remove unused txHash function * refactor: rewrite transactions sql queries * fix: use left instead of inner join on txs * fix: change expandable table logic * fix: add other coins * refactor: move log download function to component * refactor: use name values in RadioGroup * fix: assorted fixes * feat: virtualize expandable table * fix: clean up imports * fix: remove border radius * fix: move formatting out of CopyToClipboard And use CSS instead of JS to format. * fix: remove customer's last name formatting This was using lodash's string case functions, which produce unwanted results if, for instance, a user has a double-barrel last name.
160 lines
2.8 KiB
JavaScript
160 lines
2.8 KiB
JavaScript
import baseStyles from '../Logs.styles'
|
|
|
|
import { offColor, white } from '../../styling/variables'
|
|
import typographyStyles from '../../components/typography/styles'
|
|
|
|
const { label1, mono, p } = typographyStyles
|
|
const { titleWrapper, titleAndButtonsContainer, buttonsWrapper } = baseStyles
|
|
|
|
const cpcStyles = {
|
|
wrapper: {
|
|
extend: mono,
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
height: 32
|
|
},
|
|
address: {
|
|
lineBreak: 'anywhere'
|
|
},
|
|
buttonWrapper: {
|
|
'& button': {
|
|
border: 'none',
|
|
backgroundColor: 'transparent',
|
|
cursor: 'pointer'
|
|
}
|
|
},
|
|
popoverContent: {
|
|
extend: label1,
|
|
display: 'flex',
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
color: white,
|
|
borderRadius: 4,
|
|
padding: [[5, 9]]
|
|
}
|
|
}
|
|
|
|
const detailsRowStyles = {
|
|
wrapper: {
|
|
display: 'flex',
|
|
flexDirection: 'column'
|
|
},
|
|
col: {
|
|
display: 'flex',
|
|
flexDirection: 'column'
|
|
},
|
|
col1: {
|
|
width: 413
|
|
},
|
|
col2: {
|
|
width: 506
|
|
},
|
|
col3: {
|
|
width: 233
|
|
},
|
|
innerRow: {
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between'
|
|
},
|
|
row: {
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
margin: [[25, 0]]
|
|
},
|
|
mono: {
|
|
extend: mono
|
|
},
|
|
txIcon: {
|
|
marginRight: 10
|
|
},
|
|
availableIds: {
|
|
width: 110,
|
|
marginRight: 61,
|
|
'& > div': {
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
'& button': {
|
|
'&:first-child': {
|
|
marginRight: 4
|
|
},
|
|
'&:last-child': {
|
|
marginLeft: 4
|
|
},
|
|
'&:only-child': {
|
|
margin: 0
|
|
},
|
|
'&:nth-child(2):last-child': {
|
|
margin: 0
|
|
}
|
|
}
|
|
}
|
|
},
|
|
commissionWrapper: {
|
|
width: 110,
|
|
marginRight: 155
|
|
},
|
|
idCardDataCard: {
|
|
extend: p,
|
|
display: 'flex',
|
|
padding: [[11, 8]],
|
|
'& > div': {
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
'& > div': {
|
|
width: 144,
|
|
height: 37,
|
|
marginBottom: 15,
|
|
'&:last-child': {
|
|
marginBottom: 0
|
|
}
|
|
}
|
|
}
|
|
},
|
|
cryptoAddr: {
|
|
width: 252
|
|
},
|
|
txId: {
|
|
width: 346
|
|
},
|
|
sessionId: {
|
|
width: 184
|
|
}
|
|
}
|
|
|
|
const labelStyles = {
|
|
label: {
|
|
extend: label1,
|
|
color: offColor,
|
|
marginBottom: 4
|
|
}
|
|
}
|
|
|
|
const mainStyles = {
|
|
titleWrapper,
|
|
titleAndButtonsContainer,
|
|
buttonsWrapper,
|
|
headerLabels: {
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
'& div': {
|
|
display: 'flex',
|
|
alignItems: 'center'
|
|
},
|
|
'& > div:first-child': {
|
|
marginRight: 24
|
|
},
|
|
'& span': {
|
|
extend: label1,
|
|
marginLeft: 6
|
|
}
|
|
},
|
|
overflowTd: {
|
|
overflow: 'hidden',
|
|
whiteSpace: 'nowrap',
|
|
textOverflow: 'ellipsis'
|
|
}
|
|
}
|
|
|
|
export { cpcStyles, detailsRowStyles, labelStyles, mainStyles }
|