arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-11 16:41:06 +00:00
Code Issues Releases Wiki Activity

tooltip position fixed

Browse Source
This commit is contained in:
Vladimir Volek 2018-10-08 10:48:32 +02:00 committed by Szymon Lesisz
parent 2d9f02a4e6
commit f32c2d351d
2 changed files with 65 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -60,8 +60,8 @@
"redux-logger": "^3.0.6",
"redux-raven-middleware": "^1.2.0",
"redux-thunk": "^2.2.0",
"styled-components": "^3.4.9",
"rimraf": "^2.6.2",
"styled-components": "^3.4.9",
"styled-media-query": "^2.0.2",
"styled-normalize": "^8.0.0",
"trezor-connect": "^5.0.32",

136
src/views/Wallet/views/Account/Receive/index.js
View File

@ -80,7 +80,7 @@ const ValueWrapper = styled.div`
const ArrowUp = styled.div`
position: absolute;
top: 30px;
top: 35px;
left: 70px;
width: 0;
height: 0;
@ -97,7 +97,7 @@ const AddressInfoText = styled.div`
margin: 0px 2px;
padding: 0 14px 0 5px;
position: absolute;
top: 39px;
top: 45px;
background: black;
color: ${colors.WHITE};
border-radius: 5px;
@ -127,10 +127,10 @@ const ShowAddressIcon = styled(Icon)`
const EyeButton = styled(Button)`
z-index: 10001;
padding: 0;
width: 30px;
top: 5px;
position: absolute;
left: auto;
right: 10px;
top: 6px;
`;
const AccountReceive = (props: Props) => {
@ -159,81 +159,73 @@ const AccountReceive = (props: Props) => {
return (
<Content>
<React.Fragment>
<H2>Receive Ethereum or tokens</H2>
<AddressWrapper
isShowingQrCode={addressVerified || addressUnverified}
>
{isAddressVerifying && (
<AddressInfoText>Confirm address on TREZOR</AddressInfoText>
)}
{((addressVerified || addressUnverified) && !isAddressVerifying) && (
<H2>Receive Ethereum or tokens</H2>
<AddressWrapper
isShowingQrCode={addressVerified || addressUnverified}
>
{isAddressVerifying && (
<AddressInfoText>Confirm address on TREZOR</AddressInfoText>
)}
{((addressVerified || addressUnverified) && !isAddressVerifying) && (
<Tooltip
placement="left"
content={(
<VerifyAddressTooltip
isConnected={device.connected}
isAvailable={device.available}
addressUnverified={addressUnverified}
/>
)}
>
<EyeButton
isTransparent
onClick={() => props.showAddress(account.addressPath)}
>
<Tooltip
placement="bottomRight"
content={(
<VerifyAddressTooltip
isConnected={device.connected}
isAvailable={device.available}
addressUnverified={addressUnverified}
/>
)}
>
<Icon
icon={addressUnverified ? ICONS.EYE_CROSSED : ICONS.EYE}
color={addressUnverified ? colors.ERROR_PRIMARY : colors.TEXT_PRIMARY}
/>
</Tooltip>
</EyeButton>
)}
<ValueWrapper
isHidden={isAddressHidden}
isVerifying={isAddressVerifying}
>
{address}
</ValueWrapper>
{isAddressVerifying && (
<React.Fragment>
<ArrowUp />
<AddressInfoText>
<Icon
icon={ICONS.T1}
color={colors.WHITE}
/>
Check address on your Trezor
</AddressInfoText>
</React.Fragment>
)}
{(addressVerified || addressUnverified) && (
<React.Fragment>
<Label>QR code</Label>
<StyledQRCode
bgColor="#FFFFFF"
fgColor="#000000"
level="Q"
style={{ width: 150 }}
value={account.address}
<Icon
icon={addressUnverified ? ICONS.EYE_CROSSED : ICONS.EYE}
color={addressUnverified ? colors.ERROR_PRIMARY : colors.TEXT_PRIMARY}
/>
</React.Fragment>
)}
{!(addressVerified || addressUnverified) && (
<ShowAddressButton
onClick={() => props.showAddress(account.addressPath)}
isDisabled={device.connected && !discovery.completed}
>
<ShowAddressIcon
icon={ICONS.EYE}
</EyeButton>
</Tooltip>
)}
<ValueWrapper
isHidden={isAddressHidden}
isVerifying={isAddressVerifying}
>
{address}
</ValueWrapper>
{isAddressVerifying && (
<React.Fragment>
<ArrowUp />
<AddressInfoText>
<Icon
icon={ICONS.T1}
color={colors.WHITE}
/>
Show full address
</ShowAddressButton>
)}
</AddressWrapper>
</React.Fragment>
Check address on your Trezor
</AddressInfoText>
</React.Fragment>
)}
{(addressVerified || addressUnverified) && (
<React.Fragment>
<Label>QR code</Label>
<StyledQRCode
bgColor="#FFFFFF"
fgColor="#000000"
level="Q"
style={{ width: 150 }}
value={account.address}
/>
</React.Fragment>
)}
{!(addressVerified || addressUnverified) && (
<ShowAddressButton onClick={() => props.showAddress(account.addressPath)} isDisabled={device.connected && !discovery.completed}>
<ShowAddressIcon icon={ICONS.EYE} color={colors.WHITE} />Show full address
</ShowAddressButton>
)}
</AddressWrapper>
</Content>
);
};