1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 19:26:13 +02:00

Wrap smaller custom block explorer url text (#6714)

This commit is contained in:
Thomas Huang 2019-06-17 04:02:12 -07:00 committed by Dan J Miller
parent 9a1a207ffa
commit 6fb0d4af27
4 changed files with 16 additions and 3 deletions

View File

@ -1742,6 +1742,9 @@
"viewAccount": {
"message": "View Account"
},
"viewinExplorer": {
"message": "View in Explorer"
},
"viewOnCustomBlockExplorer": {
"message": "View at $1"
},

View File

@ -119,8 +119,11 @@ AccountDetailsDropdown.prototype.render = function () {
this.props.onClose()
},
text: (rpcPrefs.blockExplorerUrl
? this.context.t('blockExplorerView', [rpcPrefs.blockExplorerUrl.match(/^https?:\/\/(.+)/)[1]])
? this.context.t('viewinExplorer')
: this.context.t('viewOnEtherscan')),
subText: (rpcPrefs.blockExplorerUrl
? rpcPrefs.blockExplorerUrl.match(/^https?:\/\/(.+)/)[1]
: null),
icon: h(`img`, { src: 'images/open-etherscan.svg', style: { height: '15px' } }),
}),
isRemovable ? h(Item, {

View File

@ -20,16 +20,18 @@ Item.prototype.render = function () {
icon,
children,
text,
subText,
className = '',
onClick,
} = this.props
const itemClassName = `menu__item ${className} ${onClick ? 'menu__item--clickable' : ''}`
const iconComponent = icon ? h('div.menu__item__icon', [icon]) : null
const textComponent = text ? h('div.menu__item__text', text) : null
const subTextComponent = subText ? h('div.menu__item__subtext', subText) : null
return children
? h('div', { className: itemClassName, onClick }, children)
: h('div.menu__item', { className: itemClassName, onClick }, [ iconComponent, textComponent ]
: h('div.menu__item', { className: itemClassName, onClick }, [ iconComponent, textComponent, subTextComponent ]
.filter(d => Boolean(d))
)
}

View File

@ -8,7 +8,7 @@
&__item {
padding: 18px;
display: flex;
flex-flow: row nowrap;
flex-flow: row wrap;
align-items: center;
position: relative;
z-index: 201;
@ -39,6 +39,11 @@
font-size: 16px;
line-height: 21px;
}
&__subtext {
font-size: 12px;
padding: 5px 0px 0px 30px;
}
}
&__divider {