diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js index 301674083..75b6dcb43 100644 --- a/ui/app/components/eth-balance.js +++ b/ui/app/components/eth-balance.js @@ -54,18 +54,22 @@ EthBalanceComponent.prototype.renderBalance = function (value) { textRendering: 'geometricPrecision', }, }, [ - h(tagName, { - style: { - fontSize: props.fontSize || '12px', - }, - }, balance + ' '), h(tagName, { style: { color: props.labelColor || '#AEAEAE', fontSize: props.fontSize || '12px', }, - }, label), + }, [ + h('div', balance), + h('div', { + style: { + color: '#AEAEAE', + fontSize: '12px', + }, + }, label), + ]), ]), ]) + ) } diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index b2c16e772..c9d3251e1 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -1,6 +1,7 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits +const carratInline = require('fs').readFileSync('./images/forward-carrat.svg', 'utf8') const MiniAccountPanel = require('./mini-account-panel') const EtherBalance = require('./eth-balance') @@ -37,6 +38,8 @@ PTXP.render = function () { var maxCost = ((new BN(txValue, 16)).add(new BN(gasCost, 16))).toString(16) var dataLength = txParams.data ? (txParams.data.length - 2) / 2 : 0 + var imageify = props.imageifyIdenticons === undefined ? true : props.imageifyIdenticons + return ( h('div', [ @@ -48,7 +51,7 @@ PTXP.render = function () { h(MiniAccountPanel, { imageSeed: address, - imageifyIdenticons: props.imageifyIdenticons, + imageifyIdenticons: imageify, picOrder: 'right', }, [ h('span.font-small', { @@ -66,20 +69,17 @@ PTXP.render = function () { style: { fontFamily: 'Montserrat Light, Montserrat, sans-serif', }, - }, h(EtherBalance, { - value: balance, - inline: true, - })), + }, [ + h(EtherBalance, { + value: balance, + inline: true, + labelColor: '#F7861C', + }), + ]), ]), - h('img', { - src: 'images/forward-carrat.svg', - style: { - padding: '5px 6px 0px 10px', - height: '37px', - }, - }), + forwardCarrat(imageify), this.miniAccountPanelForRecipient(), ]), @@ -222,3 +222,32 @@ PTXP.warnIfNeeded = function () { h('span', ' Your identity may be used in other contracts!'), ]) } + + +function forwardCarrat(imageify){ + if (imageify) { + return ( + + h('img', { + src: 'images/forward-carrat.svg', + style: { + padding: '5px 6px 0px 10px', + height: '37px', + }, + }) + + ) + } else { + return ( + + h('div', { + dangerouslySetInnerHTML: { __html: carratInline }, + style: { + padding: '0px 6px 0px 10px', + height: '45px', + }, + }) + + ) + } +} \ No newline at end of file