aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app
diff options
context:
space:
mode:
authorDan <danjm.com@gmail.com>2018-05-31 23:50:15 +0800
committerDan <danjm.com@gmail.com>2018-06-01 00:02:18 +0800
commitd454b5de2b03111a05c4e8a8b0a91e612b8f0266 (patch)
treeab9547e1a201d1d4dad053677eb68a11f856971a /ui/app
parent39d22a4ddb4ba0f4ad456009c86486a433c6724e (diff)
downloadtangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar.gz
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar.bz2
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar.lz
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar.xz
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.tar.zst
tangerine-wallet-browser-d454b5de2b03111a05c4e8a8b0a91e612b8f0266.zip
Token name is not hidden in wallet if balance is exceptionally long.
Diffstat (limited to 'ui/app')
-rw-r--r--ui/app/components/token-cell.js4
-rw-r--r--ui/app/css/itcss/components/token-list.scss10
2 files changed, 11 insertions, 3 deletions
diff --git a/ui/app/components/token-cell.js b/ui/app/components/token-cell.js
index c84117d84..4100d76a5 100644
--- a/ui/app/components/token-cell.js
+++ b/ui/app/components/token-cell.js
@@ -101,8 +101,8 @@ TokenCell.prototype.render = function () {
h('div.token-list-item__balance-ellipsis', null, [
h('div.token-list-item__balance-wrapper', null, [
- h('h3.token-list-item__token-balance', `${string || 0} ${symbol}`),
-
+ h('div.token-list-item__token-balance', `${string || 0}`),
+ h('div.token-list-item__token-symbol', symbol),
showFiat && h('div.token-list-item__fiat-amount', {
style: {},
}, formattedFiat),
diff --git a/ui/app/css/itcss/components/token-list.scss b/ui/app/css/itcss/components/token-list.scss
index e8de317e3..214bbc774 100644
--- a/ui/app/css/itcss/components/token-list.scss
+++ b/ui/app/css/itcss/components/token-list.scss
@@ -14,10 +14,16 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and (
min-width: 0;
&__token-balance {
- font-size: 1.5rem;
+ margin-right: 4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
+ flex: 1;
+ }
+
+ &__token-balance, &__token-symbol {
+ font-size: 1.5rem;
+ display: inline-flex;
@media #{$wallet-balance-breakpoint-range} {
font-size: 95%;
@@ -68,6 +74,8 @@ $wallet-balance-breakpoint-range: "screen and (min-width: #{$break-large}) and (
&__balance-wrapper {
flex: 1 1 auto;
min-width: 0;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
}