diff --git a/src/components/Tooltip/index.js b/src/components/Tooltip/index.js index f140a12d..b89f12cf 100644 --- a/src/components/Tooltip/index.js +++ b/src/components/Tooltip/index.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import RcTooltip from 'rc-tooltip'; import colors from 'config/colors'; +import Link from 'components/Link'; import styled from 'styled-components'; import PropTypes from 'prop-types'; @@ -165,6 +166,19 @@ const Wrapper = styled.div` } `; +const Content = styled.div` + padding-bottom: 10px; +`; + +const ContentWrapper = styled.div``; +const ReadMore = styled.div` + padding: 10px 0; + text-align: center; + width: 100%; + color: ${colors.WHITE}; + border-top: 1px solid ${colors.TEXT_SECONDARY}; +`; + class Tooltip extends Component { render() { const { @@ -172,6 +186,7 @@ class Tooltip extends Component { placement, content, children, + readMoreLink, maxWidth, } = this.props; return ( @@ -184,7 +199,16 @@ class Tooltip extends Component { getTooltipContainer={() => this.tooltipContainerRef} arrowContent={
} placement={placement} - overlay={content} + overlay={() => ( + + {content} + {readMoreLink && ( + + Read more + + ) + } + )} > {children} @@ -205,6 +229,7 @@ Tooltip.propTypes = { PropTypes.element, PropTypes.string, ]), + readMoreLink: PropTypes.string, }; export default Tooltip; diff --git a/src/views/Wallet/views/AccountSend/components/AdvancedForm/index.js b/src/views/Wallet/views/AccountSend/components/AdvancedForm/index.js index 1311c605..01898e9c 100644 --- a/src/views/Wallet/views/AccountSend/components/AdvancedForm/index.js +++ b/src/views/Wallet/views/AccountSend/components/AdvancedForm/index.js @@ -190,12 +190,13 @@ const AdvancedForm = (props: Props) => { - Gas Price is the amount you pay per unit of gas.
- TX fee = gas price * gas limit & is paid to miners for including your TX in a block.
- Higher the gas price = faster transaction, but more expensive. Recommended is {recommendedGasPrice} GWEI.
- Read more + Gas price refers to the amount of ether you are willing to pay for every + unit of gas, and is usually measured in “Gwei”. Transaction fee = gas limit * gas price Increasing the gas price will get the transaction confirmed sooner but + makes it more expensive. The recommended gas price is {recommendedGasPrice} GWEI. )} + maxWidth={400} + readMoreLink="https://wiki.trezor.io/Ethereum_Wallet#Gas_price_.28GWEI.29" placement="top" >