mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-22 17:33:23 +01:00
Add new component for tx-history to avoid messing with other styles. Add fixed width specifically to this style.
This commit is contained in:
parent
570d560932
commit
5343404d0d
@ -72,7 +72,7 @@
|
||||
"txParams": {
|
||||
"from": "0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc",
|
||||
"to": "0x18a3462427bcc9133bb46e88bcbe39cd7ef0e761",
|
||||
"value": "0x66c8104aa57038000",
|
||||
"value": "0x99966c8104aa57038000",
|
||||
"origin": "thelongestdomainnameintheworldandthensomeandthensomemoreandmore.com",
|
||||
"metamaskId": 1467923203344608,
|
||||
"metamaskNetworkId": "2"
|
||||
|
70
ui/app/components/eth-balance-tx-history.js
Normal file
70
ui/app/components/eth-balance-tx-history.js
Normal file
@ -0,0 +1,70 @@
|
||||
const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const formatBalance = require('../util').formatBalance
|
||||
const generateBalanceObject = require('../util').generateBalanceObject
|
||||
const Tooltip = require('./tooltip.js')
|
||||
module.exports = EthBalanceComponent
|
||||
|
||||
inherits(EthBalanceComponent, Component)
|
||||
function EthBalanceComponent () {
|
||||
Component.call(this)
|
||||
}
|
||||
|
||||
EthBalanceComponent.prototype.render = function () {
|
||||
var state = this.props
|
||||
var style = state.style
|
||||
var value = formatBalance(state.value)
|
||||
return (
|
||||
|
||||
h('.ether-balance', {
|
||||
style: style,
|
||||
}, [
|
||||
h('.ether-balance-amount', {
|
||||
style: {
|
||||
display: 'inline',
|
||||
width: '55px',
|
||||
overflow: 'hidden',
|
||||
},
|
||||
}, this.renderBalance(value)),
|
||||
])
|
||||
|
||||
)
|
||||
}
|
||||
EthBalanceComponent.prototype.renderBalance = function (value) {
|
||||
if (value === 'None') return value
|
||||
var balanceObj = generateBalanceObject(value)
|
||||
|
||||
var balance = balanceObj.balance
|
||||
var label = balanceObj.label
|
||||
|
||||
return (
|
||||
h(Tooltip, {
|
||||
position: 'bottom',
|
||||
title: value.split(' ')[0],
|
||||
}, [
|
||||
h('.flex-column', {
|
||||
style: {
|
||||
alignItems: 'flex-end',
|
||||
lineHeight: '13px',
|
||||
fontFamily: 'Montserrat Light',
|
||||
textRendering: 'geometricPrecision',
|
||||
},
|
||||
}, [
|
||||
h('div', {
|
||||
style: {
|
||||
width: '100%',
|
||||
overflow: 'hidden',
|
||||
textOverflow: 'ellipsis',
|
||||
},
|
||||
}, balance),
|
||||
h('div', {
|
||||
style: {
|
||||
color: ' #AEAEAE',
|
||||
fontSize: '12px',
|
||||
},
|
||||
}, label),
|
||||
]),
|
||||
])
|
||||
)
|
||||
}
|
@ -2,7 +2,7 @@ const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
|
||||
const EtherBalance = require('./eth-balance')
|
||||
const EtherBalance = require('./eth-balance-tx-history')
|
||||
const addressSummary = require('../util').addressSummary
|
||||
const explorerLink = require('../../lib/explorer-link')
|
||||
const CopyButton = require('./copyButton')
|
||||
|
Loading…
Reference in New Issue
Block a user