mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Further styling to get hex component working. Fix some typos.
This commit is contained in:
parent
9e6e3f55b7
commit
5d1a4db5e5
@ -3,6 +3,7 @@ const h = require('react-hyperscript')
|
|||||||
const inherits = require('util').inherits
|
const inherits = require('util').inherits
|
||||||
const ethUtil = require('ethereumjs-util')
|
const ethUtil = require('ethereumjs-util')
|
||||||
const BN = ethUtil.BN
|
const BN = ethUtil.BN
|
||||||
|
const extend = require('xtend')
|
||||||
|
|
||||||
module.exports = HexAsDecimalInput
|
module.exports = HexAsDecimalInput
|
||||||
|
|
||||||
@ -23,20 +24,40 @@ function HexAsDecimalInput () {
|
|||||||
HexAsDecimalInput.prototype.render = function () {
|
HexAsDecimalInput.prototype.render = function () {
|
||||||
const props = this.props
|
const props = this.props
|
||||||
const { value, onChange } = 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 (
|
return (
|
||||||
h('input', {
|
h('.flex-row', {
|
||||||
style: {
|
style: {
|
||||||
|
alignItems: 'flex-end',
|
||||||
|
lineHeight: '13px',
|
||||||
|
fontFamily: 'Montserrat Light',
|
||||||
|
textRendering: 'geometricPrecision',
|
||||||
|
},
|
||||||
|
}, [
|
||||||
|
h('input.ether-balance.ether-balance-amount', {
|
||||||
|
style: extend({
|
||||||
display: 'block',
|
display: 'block',
|
||||||
textAlign: 'right',
|
textAlign: 'right',
|
||||||
},
|
backgroundColor: 'transparent',
|
||||||
|
}, style),
|
||||||
value: decimalValue,
|
value: decimalValue,
|
||||||
onChange: (event) => {
|
onChange: (event) => {
|
||||||
const hexString = hexify(event.target.value)
|
const hexString = hexify(event.target.value)
|
||||||
onChange(hexString)
|
onChange(hexString)
|
||||||
},
|
},
|
||||||
})
|
}),
|
||||||
|
h('div', {
|
||||||
|
style: {
|
||||||
|
color: ' #AEAEAE',
|
||||||
|
fontSize: '12px',
|
||||||
|
marginLeft: '5px',
|
||||||
|
},
|
||||||
|
}, suffix),
|
||||||
|
])
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -45,7 +66,7 @@ function hexify (decimalString) {
|
|||||||
return '0x' + hexBN.toString('hex')
|
return '0x' + hexBN.toString('hex')
|
||||||
}
|
}
|
||||||
|
|
||||||
function decimalize (input) {
|
function decimalize (input, toEth) {
|
||||||
const strippedInput = ethUtil.stripHexPrefix(input)
|
const strippedInput = ethUtil.stripHexPrefix(input)
|
||||||
const inputBN = new BN(strippedInput, 'hex')
|
const inputBN = new BN(strippedInput, 'hex')
|
||||||
return inputBN.toString(10)
|
return inputBN.toString(10)
|
||||||
|
@ -138,12 +138,17 @@ PTXP.render = function () {
|
|||||||
h('.cell.row', {
|
h('.cell.row', {
|
||||||
|
|
||||||
}, [
|
}, [
|
||||||
h('.cell.label', 'Total Gas'),
|
h('.cell.label', 'Gas Limit'),
|
||||||
h('.cell.value', {
|
h('.cell.value', {
|
||||||
|
|
||||||
}, [
|
}, [
|
||||||
h(HexInput, {
|
h(HexInput, {
|
||||||
value: gas,
|
value: gas,
|
||||||
|
suffix: 'UNITS',
|
||||||
|
style: {
|
||||||
|
position: 'relative',
|
||||||
|
top: '5px',
|
||||||
|
},
|
||||||
onChange: (newHex) => {
|
onChange: (newHex) => {
|
||||||
this.setState({ gas: newHex })
|
this.setState({ gas: newHex })
|
||||||
},
|
},
|
||||||
@ -159,8 +164,13 @@ PTXP.render = function () {
|
|||||||
}, [
|
}, [
|
||||||
h(HexInput, {
|
h(HexInput, {
|
||||||
value: gasPrice,
|
value: gasPrice,
|
||||||
|
suffix: 'WEI',
|
||||||
|
style: {
|
||||||
|
position: 'relative',
|
||||||
|
top: '5px',
|
||||||
|
},
|
||||||
onChange: (newHex) => {
|
onChange: (newHex) => {
|
||||||
this.setState({ gas: newHex })
|
this.setState({ gasPrice: newHex })
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
])
|
])
|
||||||
|
@ -16,9 +16,6 @@ PendingTx.prototype.render = function () {
|
|||||||
const txData = props.txData
|
const txData = props.txData
|
||||||
const txParams = txData.txParams
|
const txParams = txData.txParams
|
||||||
|
|
||||||
const gas = state.gas || txParams.gas
|
|
||||||
const gasPrice = state.gasPrice || txData.gasPrice
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
h('div', {
|
h('div', {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user