fix tooltip icons

pull/460/head
slowbackspace 5 years ago
parent 8c7d7056e7
commit d0bc970076

@ -132,7 +132,7 @@ const StyledLink = styled(Link)`
const StyledIcon = styled(Icon)` const StyledIcon = styled(Icon)`
cursor: pointer; cursor: pointer;
padding-right: 1px; margin-right: 1px;
`; `;
const TooltipContainer = styled.div` const TooltipContainer = styled.div`

@ -66,7 +66,7 @@ const AdvancedSettingsSendButtonWrapper = styled.div`
const StyledIcon = styled(Icon)` const StyledIcon = styled(Icon)`
cursor: pointer; cursor: pointer;
padding-right: 1px; margin-right: 1px;
`; `;
const TooltipContainer = styled.div` const TooltipContainer = styled.div`
@ -121,23 +121,27 @@ const AdvancedForm = (props: Props) => {
<Left> <Left>
<FormattedMessage {...l10nSendMessages.TR_FEE} /> <FormattedMessage {...l10nSendMessages.TR_FEE} />
<TooltipContainer> <TooltipContainer>
<Tooltip <Tooltip
content={ content={
<FormattedMessage {...l10nMessages.TR_XRP_TRANSFER_COST} /> <FormattedMessage
} {...l10nMessages.TR_XRP_TRANSFER_COST}
maxWidth={100} />
ctaLink="https://developers.ripple.com/transaction-cost.html" }
ctaText={ maxWidth={100}
<FormattedMessage {...l10nCommonMessages.TR_LEARN_MORE} /> ctaLink="https://developers.ripple.com/transaction-cost.html"
} ctaText={
placement="top" <FormattedMessage
> {...l10nCommonMessages.TR_LEARN_MORE}
<StyledIcon />
icon={ICONS.HELP} }
color={colors.TEXT_SECONDARY} placement="top"
size={12} >
/> <StyledIcon
</Tooltip> icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</TooltipContainer> </TooltipContainer>
</Left> </Left>
</InputLabelWrapper> </InputLabelWrapper>
@ -163,25 +167,27 @@ const AdvancedForm = (props: Props) => {
<Left> <Left>
<FormattedMessage {...l10nMessages.TR_XRP_DESTINATION_TAG} /> <FormattedMessage {...l10nMessages.TR_XRP_DESTINATION_TAG} />
<TooltipContainer> <TooltipContainer>
<Tooltip <Tooltip
content={ content={
<FormattedMessage <FormattedMessage
{...l10nMessages.TR_XRP_DESTINATION_TAG_EXPLAINED} {...l10nMessages.TR_XRP_DESTINATION_TAG_EXPLAINED}
/>
}
maxWidth={200}
ctaLink="https://wiki.trezor.io/Ripple_(XRP)"
ctaText={
<FormattedMessage
{...l10nCommonMessages.TR_LEARN_MORE}
/>
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/> />
} </Tooltip>
maxWidth={200}
ctaLink="https://wiki.trezor.io/Ripple_(XRP)"
ctaText={
<FormattedMessage {...l10nCommonMessages.TR_LEARN_MORE} />
}
placement="top"
>
<StyledIcon
icon={ICONS.HELP}
color={colors.TEXT_SECONDARY}
size={12}
/>
</Tooltip>
</TooltipContainer> </TooltipContainer>
</Left> </Left>
</InputLabelWrapper> </InputLabelWrapper>

@ -51,6 +51,7 @@ const AccountTitle = styled.div`
const StyledIcon = styled(Icon)` const StyledIcon = styled(Icon)`
cursor: pointer; cursor: pointer;
margin-right: 1px;
`; `;
const TooltipContainer = styled.div` const TooltipContainer = styled.div`
@ -118,7 +119,9 @@ const AccountSummary = (props: Props) => {
<Tooltip <Tooltip
maxWidth={200} maxWidth={200}
placement="top" placement="top"
content={props.intl.formatMessage(l10nSummaryMessages.TR_INSERT_TOKEN_NAME)} content={props.intl.formatMessage(
l10nSummaryMessages.TR_INSERT_TOKEN_NAME
)}
> >
<StyledIcon icon={ICONS.HELP} color={colors.TEXT_SECONDARY} size={12} /> <StyledIcon icon={ICONS.HELP} color={colors.TEXT_SECONDARY} size={12} />
</Tooltip> </Tooltip>

Loading…
Cancel
Save