From 5d1a4db5e51158523c2c8f3979c91800ddfc041e Mon Sep 17 00:00:00 2001 From: Kevin Serrano Date: Mon, 27 Feb 2017 16:33:58 -0800 Subject: Further styling to get hex component working. Fix some typos. --- ui/app/components/hex-as-decimal-input.js | 43 +++++++++++++++++++++++-------- 1 file changed, 32 insertions(+), 11 deletions(-) (limited to 'ui/app/components/hex-as-decimal-input.js') diff --git a/ui/app/components/hex-as-decimal-input.js b/ui/app/components/hex-as-decimal-input.js index 34f628f7f..bdc0ed191 100644 --- a/ui/app/components/hex-as-decimal-input.js +++ b/ui/app/components/hex-as-decimal-input.js @@ -3,6 +3,7 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN +const extend = require('xtend') module.exports = HexAsDecimalInput @@ -23,20 +24,40 @@ function HexAsDecimalInput () { HexAsDecimalInput.prototype.render = function () { const props = this.props const { value, onChange } = props - const decimalValue = decimalize(value) + const toEth = props.toEth + const suffix = props.suffix + const decimalValue = decimalize(value, toEth) + const style = props.style return ( - h('input', { + h('.flex-row', { style: { - display: 'block', - textAlign: 'right', + alignItems: 'flex-end', + lineHeight: '13px', + fontFamily: 'Montserrat Light', + textRendering: 'geometricPrecision', }, - value: decimalValue, - onChange: (event) => { - const hexString = hexify(event.target.value) - onChange(hexString) - }, - }) + }, [ + h('input.ether-balance.ether-balance-amount', { + style: extend({ + display: 'block', + textAlign: 'right', + backgroundColor: 'transparent', + }, style), + value: decimalValue, + onChange: (event) => { + const hexString = hexify(event.target.value) + onChange(hexString) + }, + }), + h('div', { + style: { + color: ' #AEAEAE', + fontSize: '12px', + marginLeft: '5px', + }, + }, suffix), + ]) ) } @@ -45,7 +66,7 @@ function hexify (decimalString) { return '0x' + hexBN.toString('hex') } -function decimalize (input) { +function decimalize (input, toEth) { const strippedInput = ethUtil.stripHexPrefix(input) const inputBN = new BN(strippedInput, 'hex') return inputBN.toString(10) -- cgit v1.2.3