Browse Source

Fix SelectAccount icon and text-overflow

master
meriadec 7 years ago
parent
commit
d93e36bde5
No known key found for this signature in database GPG Key ID: 1D2FC2305E2CB399
  1. 11
      src/components/SelectAccount/index.js

11
src/components/SelectAccount/index.js

@ -22,8 +22,13 @@ const mapStateToProps = state => ({
})
const renderItem = a => {
const Icon = getCryptoCurrencyIcon(a)
const Icon = getCryptoCurrencyIcon(a.currency)
const { color } = a.currency
// FIXME: we need a non-hacky way to handle text ellipsis
const nameOuterStyle = { width: 0 }
const nameInnerStyle = { overflow: 'hidden', textOverflow: 'ellipsis' }
return (
<Box grow horizontal alignItems="center" flow={2}>
{Icon && (
@ -31,8 +36,8 @@ const renderItem = a => {
<Icon size={16} />
</Box>
)}
<Box grow>
<Text ff="Open Sans|SemiBold" color="dark" fontSize={4}>
<Box grow style={nameOuterStyle} ff="Open Sans|SemiBold" color="dark" fontSize={4}>
<Text style={nameInnerStyle} ff="Open Sans|SemiBold" color="dark" fontSize={4}>
{a.name}
</Text>
</Box>

Loading…
Cancel
Save