ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hover text nit

Browse Source
This commit is contained in:
Moody Salem 2021-05-12 17:12:16 -05:00
parent e08e597655
commit 0e9f23ed56
No known key found for this signature in database
GPG Key ID: 8CB5CD10385138DB
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/CurrencyInputPanel/FiatValue.tsx
View File

@ -25,7 +25,7 @@ export function FiatValue({
return ( return (
<TYPE.body fontSize={14} color={fiatValue ? theme.text2 : theme.text4}> <TYPE.body fontSize={14} color={fiatValue ? theme.text2 : theme.text4}>
{fiatValue ? '~' : ''}$ {fiatValue ? '~' : ''}$
<HoverInlineText text={fiatValue ? Number(fiatValue?.toSignificant(6)).toLocaleString('en') : '-'} />{' '} <HoverInlineText text={fiatValue ? fiatValue?.toSignificant(6, { groupSeparator: ',' }) : '-'} />{' '}
{priceImpact ? ( {priceImpact ? (
<span style={{ color: priceImpactColor }}> ({priceImpact.multiply(-1).toSignificant(3)}%)</span> <span style={{ color: priceImpactColor }}> ({priceImpact.multiply(-1).toSignificant(3)}%)</span>
) : null} ) : null}

10
src/components/HoverInlineText/index.tsx
View File

@ -2,8 +2,8 @@ import Tooltip from 'components/Tooltip'
import React, { useState } from 'react' import React, { useState } from 'react'
import styled from 'styled-components' import styled from 'styled-components'
const TextWrapper = styled.span<{ margin: boolean; link: boolean; fontSize?: string; adjustSize?: boolean }>` const TextWrapper = styled.span<{ margin: boolean; link?: boolean; fontSize?: string; adjustSize?: boolean }>`
position: relative; cursor: auto;
margin-left: ${({ margin }) => margin && '4px'}; margin-left: ${({ margin }) => margin && '4px'};
color: ${({ theme, link }) => (link ? theme.blue1 : theme.text1)}; color: ${({ theme, link }) => (link ? theme.blue1 : theme.text1)};
font-size: ${({ fontSize }) => fontSize ?? 'inherit'}; font-size: ${({ fontSize }) => fontSize ?? 'inherit'};
@ -32,7 +32,7 @@ const HoverInlineText = ({
const [showHover, setShowHover] = useState(false) const [showHover, setShowHover] = useState(false)
if (!text) { if (!text) {
return <span></span> return <span />
} }
if (text.length > maxCharacters) { if (text.length > maxCharacters) {
@ -43,7 +43,7 @@ const HoverInlineText = ({
onMouseLeave={() => setShowHover(false)} onMouseLeave={() => setShowHover(false)}
margin={margin} margin={margin}
adjustSize={adjustSize} adjustSize={adjustSize}
link={!!link} link={link}
fontSize={fontSize} fontSize={fontSize}
{...rest} {...rest}
> >
@ -54,7 +54,7 @@ const HoverInlineText = ({
} }
return ( return (
<TextWrapper margin={margin} adjustSize={adjustSize} link={!!link} fontSize={fontSize} {...rest}> <TextWrapper margin={margin} adjustSize={adjustSize} link={link} fontSize={fontSize} {...rest}>
{text} {text}
</TextWrapper> </TextWrapper>
) )