arno
/
trezor-wallet
mirror of https://github.com/trezor/trezor-wallet
1
0
Fork 0
Code Issues Releases Wiki Activity

centering tooltip pos

Browse Source
pull/460/head
slowbackspace 5 years ago
parent c3a7fbec25
commit 668c25c4b4
3 changed files with 112 additions and 81 deletions
Show Stats Download Patch File Download Diff File

164
src/views/Wallet/views/Account/Send/ethereum/components/AdvancedForm/index.js
Unescape View File

@ -132,6 +132,10 @@ const StyledLink = styled(Link)`
const StyledIcon = styled(Icon)`
cursor: pointer;
padding-right: 1px;
`;
const TooltipContainer = styled.div`
margin-left: 6px;
`;
@ -183,38 +187,44 @@ const AdvancedForm = (props: Props) => {
<InputLabelWrapper>
<Left>
<FormattedMessage {...l10nMessages.TR_GAS_LIMIT} />
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_GAS_LIMIT_REFERS_TO}
values={{
TR_GAS_QUOTATION: (
<GreenSpan>
<FormattedMessage
{...l10nMessages.TR_GAS_QUOTATION}
/>
</GreenSpan>
),
gasLimitTooltipValue: (
<GreenSpan>{gasLimitTooltipValue}</GreenSpan>
),
gasLimitTooltipCurrency,
}}
<TooltipContainer>
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_GAS_LIMIT_REFERS_TO}
values={{
TR_GAS_QUOTATION: (
<GreenSpan>
<FormattedMessage
{...l10nMessages.TR_GAS_QUOTATION}
/>
</GreenSpan>
),
gasLimitTooltipValue: (
<GreenSpan>
{gasLimitTooltipValue}
</GreenSpan>
),
gasLimitTooltipCurrency,
}}
/>
}
maxWidth={410}
ctaLink="https://wiki.trezor.io/Ethereum_Wallet#Gas_limit"
ctaText={
<FormattedMessage
{...l10nCommonMessages.TR_LEARN_MORE}
/>
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
}
maxWidth={410}
ctaLink="https://wiki.trezor.io/Ethereum_Wallet#Gas_limit"
ctaText={
<FormattedMessage {...l10nCommonMessages.TR_LEARN_MORE} />
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Tooltip>
</TooltipContainer>
</Left>
{showDefaultGasLimitButton && (
<Right>
@ -245,37 +255,41 @@ const AdvancedForm = (props: Props) => {
<InputLabelWrapper>
<Left>
<FormattedMessage {...l10nMessages.TR_GAS_PRICE} />
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_GAS_PRICE_REFERS_TO}
values={{
TR_GAS_PRICE_QUOTATION: (
<GreenSpan>
<FormattedMessage
{...l10nMessages.TR_GAS_PRICE_QUOTATION}
/>
</GreenSpan>
),
recommendedGasPrice: (
<GreenSpan>{recommendedGasPrice}</GreenSpan>
),
}}
<TooltipContainer>
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_GAS_PRICE_REFERS_TO}
values={{
TR_GAS_PRICE_QUOTATION: (
<GreenSpan>
<FormattedMessage
{...l10nMessages.TR_GAS_PRICE_QUOTATION}
/>
</GreenSpan>
),
recommendedGasPrice: (
<GreenSpan>{recommendedGasPrice}</GreenSpan>
),
}}
/>
}
maxWidth={400}
ctaLink="https://wiki.trezor.io/Ethereum_Wallet#Gas_price"
ctaText={
<FormattedMessage
{...l10nCommonMessages.TR_LEARN_MORE}
/>
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
}
maxWidth={400}
ctaLink="https://wiki.trezor.io/Ethereum_Wallet#Gas_price"
ctaText={
<FormattedMessage {...l10nCommonMessages.TR_LEARN_MORE} />
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</Tooltip>
</TooltipContainer>
</Left>
</InputLabelWrapper>
}
@ -290,18 +304,22 @@ const AdvancedForm = (props: Props) => {
<InputLabelWrapper>
<Left>
<FormattedMessage {...l10nMessages.TR_DATA} />
<Tooltip
content={
<FormattedMessage {...l10nMessages.TR_DATA_IS_USUALLY_USED} />
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
<TooltipContainer>
<Tooltip
content={
<FormattedMessage
{...l10nMessages.TR_DATA_IS_USUALLY_USED}
/>
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</TooltipContainer>
</Left>
</InputLabelWrapper>
}

8
src/views/Wallet/views/Account/Send/ripple/components/AdvancedForm/index.js
Unescape View File

@ -66,6 +66,10 @@ const AdvancedSettingsSendButtonWrapper = styled.div`
const StyledIcon = styled(Icon)`
cursor: pointer;
padding-right: 1px;
`;
const TooltipContainer = styled.div`
margin-left: 6px;
`;
@ -116,6 +120,7 @@ const AdvancedForm = (props: Props) => {
<InputLabelWrapper>
<Left>
<FormattedMessage {...l10nSendMessages.TR_FEE} />
<TooltipContainer>
<Tooltip
content={
<FormattedMessage {...l10nMessages.TR_XRP_TRANSFER_COST} />
@ -133,6 +138,7 @@ const AdvancedForm = (props: Props) => {
size={12}
/>
</Tooltip>
</TooltipContainer>
</Left>
</InputLabelWrapper>
}
@ -156,6 +162,7 @@ const AdvancedForm = (props: Props) => {
<InputLabelWrapper>
<Left>
<FormattedMessage {...l10nMessages.TR_XRP_DESTINATION_TAG} />
<TooltipContainer>
<Tooltip
content={
<FormattedMessage
@ -175,6 +182,7 @@ const AdvancedForm = (props: Props) => {
size={12}
/>
</Tooltip>
</TooltipContainer>
</Left>
</InputLabelWrapper>
}

21
src/views/Wallet/views/Account/Summary/ethereum/index.js
Unescape View File

@ -50,10 +50,13 @@ const AccountTitle = styled.div`
`;
const StyledIcon = styled(Icon)`
margin-left: 6px;
cursor: pointer;
`;
const TooltipContainer = styled.div`
margin-left: 6px;
`;
const StyledLink = styled(Link)`
font-size: ${FONT_SIZE.SMALL};
`;
@ -111,13 +114,15 @@ const AccountSummary = (props: Props) => {
<H5>
<FormattedMessage {...l10nSummaryMessages.TR_TOKENS} />
</H5>
<Tooltip
maxWidth={200}
placement="top"
content={props.intl.formatMessage(l10nSummaryMessages.TR_INSERT_TOKEN_NAME)}
>
<StyledIcon icon={ICONS.HELP} color={colors.TEXT_SECONDARY} size={12} />
</Tooltip>
<TooltipContainer>
<Tooltip
maxWidth={200}
placement="top"
content={props.intl.formatMessage(l10nSummaryMessages.TR_INSERT_TOKEN_NAME)}
>
<StyledIcon icon={ICONS.HELP} color={colors.TEXT_SECONDARY} size={12} />
</Tooltip>
</TooltipContainer>
</TokensHeadingWrapper>
<AsyncSelectWrapper>
<AsyncSelect

Write Preview
Loading…
Cancel
Save