arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-28 03:08:30 +00:00
Code Issues Releases Wiki Activity

Summary token add tooltip

Browse Source
This commit is contained in:
Szymon Lesisz 2018-05-11 13:46:18 +02:00
parent 424339442e
commit 859b5da127
2 changed files with 35 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/js/components/wallet/summary/Summary.js
View File

@ -4,6 +4,8 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import BigNumber from 'bignumber.js'; import BigNumber from 'bignumber.js';
import { Async } from 'react-select'; import { Async } from 'react-select';
import Tooltip from 'rc-tooltip';
import { resolveAfter } from '../../../utils/promiseUtils'; import { resolveAfter } from '../../../utils/promiseUtils';
import AbstractAccount from '../account/AbstractAccount'; import AbstractAccount from '../account/AbstractAccount';
import { Notification } from '../../common/Notification'; import { Notification } from '../../common/Notification';
@ -41,6 +43,12 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
const tokens = findAccountTokens(props.tokens, account); const tokens = findAccountTokens(props.tokens, account);
const explorerLink: string = `${abstractAccount.coin.explorer.address}${account.address}`; const explorerLink: string = `${abstractAccount.coin.explorer.address}${account.address}`;
const tokensTooltip = (
<div className="tooltip-wrapper">
Insert token name, symbol or address to be able to send it.
</div>
);
return ( return (
<section className="summary"> <section className="summary">
@ -60,7 +68,15 @@ const _render = (props: Props, state: AccountState): React$Element<string> => {
localStorage={ props.localStorage } localStorage={ props.localStorage }
onToggle={ props.onDetailsToggle } /> onToggle={ props.onDetailsToggle } />
<h2>Tokens</h2> <h2>
Tokens
<Tooltip
arrowContent={<div className="rc-tooltip-arrow-inner"></div>}
overlay={ tokensTooltip }
placement="top">
<span className="what-is-it"></span>
</Tooltip>
</h2>
{/* 0x58cda554935e4a1f2acbe15f8757400af275e084 Lahod */} {/* 0x58cda554935e4a1f2acbe15f8757400af275e084 Lahod */}
{/* 0x58cda554935e4a1f2acbe15f8757400af275e084 T01 */} {/* 0x58cda554935e4a1f2acbe15f8757400af275e084 T01 */}
<div className="filter"> <div className="filter">

18
src/styles/summary.less
View File

@ -127,6 +127,24 @@
} }
} }
.what-is-it {
&:before {
.icomoon-help;
.hover();
transform-origin: 50% 50%;
font-size: 24px;
position: relative;
top: 5px;
cursor: pointer;
color: @color_text_secondary;
}
&:hover {
&:before {
color: @color_text_primary;
}
}
}
.filter { .filter {
//background: @color_main; //background: @color_main;
padding: 0px 48px 32px 48px; padding: 0px 48px 32px 48px;