diff --git a/js/src/ui/Balance/balance.css b/js/src/ui/Balance/balance.css index 6f9b7bb21b5..6fe1b2a5151 100644 --- a/js/src/ui/Balance/balance.css +++ b/js/src/ui/Balance/balance.css @@ -32,19 +32,25 @@ border-radius: 16px; margin: 0.75em 0.5em 0 0; max-height: 24px; + max-width: 100%; + display: flex; + align-items: center; } .balance img { - display: inline-block; height: 32px; margin: -4px 1em 0 0; width: 32px; } -.balance div { - display: inline-block; - /*font-family: 'Roboto Mono', monospace;*/ - line-height: 24px; +.balanceValue { margin: 0 1em 0 0; - vertical-align: top; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; +} + +.balanceTag { + font-size: 0.85em; + padding-right: 0.75rem; } diff --git a/js/src/ui/Balance/balance.js b/js/src/ui/Balance/balance.js index b9df3e9fb76..b6f78664806 100644 --- a/js/src/ui/Balance/balance.js +++ b/js/src/ui/Balance/balance.js @@ -56,7 +56,10 @@ class Balance extends Component { { -
{ value } { token.tag }
+
+ { value } +
+
{ token.tag }
); }); diff --git a/js/src/ui/Container/Title/title.css b/js/src/ui/Container/Title/title.css index c3bf7a3b10e..ee5cc58cd83 100644 --- a/js/src/ui/Container/Title/title.css +++ b/js/src/ui/Container/Title/title.css @@ -16,6 +16,9 @@ */ .byline { color: #aaa; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; } .title { diff --git a/js/src/ui/Container/Title/title.js b/js/src/ui/Container/Title/title.js index 2acfc30bb1b..0c0d0e6b36c 100644 --- a/js/src/ui/Container/Title/title.js +++ b/js/src/ui/Container/Title/title.js @@ -40,7 +40,7 @@ export default class Title extends Component { { this.props.title }
- { this.props.byline } + { this.props.byline }
);