arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-06-20 15:08:49 +00:00
Code Issues Releases Wiki Activity

fix backdrop

Browse Source
This commit is contained in:
slowbackspace 2019-03-22 10:10:23 +01:00
parent e3efe41128
commit 5ac900d30f
1 changed files with 98 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

188
src/views/Wallet/components/LeftNavigation/index.js
View File

@ -269,73 +269,76 @@ class LeftNavigation extends React.PureComponent<Props, State> {
selectedDevice && selectedDevice.connected && selectedDevice.available; selectedDevice && selectedDevice.connected && selectedDevice.available;
return ( return (
<Sidebar isOpen={props.wallet.showSidebar}> <>
<StyledBackdrop <StyledBackdrop
show={props.wallet.showSidebar} show={props.wallet.showSidebar}
onClick={props.toggleSidebar} onClick={props.toggleSidebar}
animated animated
/> />
<Header <Sidebar isOpen={props.wallet.showSidebar}>
isSelected <Header
testId="Main__page__device__header" isSelected
isHoverable={false} testId="Main__page__device__header"
onClickWrapper={() => { isHoverable={false}
if (isDeviceAccessible || this.props.devices.length > 1) { onClickWrapper={() => {
this.handleOpen(); if (isDeviceAccessible || this.props.devices.length > 1) {
} this.handleOpen();
}} }
device={selectedDevice} }}
disabled={!isDeviceAccessible && this.props.devices.length === 1} device={selectedDevice}
isOpen={this.props.wallet.dropdownOpened} disabled={!isDeviceAccessible && this.props.devices.length === 1}
icon={ isOpen={this.props.wallet.dropdownOpened}
<React.Fragment> icon={
{showWalletType && ( <React.Fragment>
<Tooltip {showWalletType && (
content={ <Tooltip
<WalletTooltipMsg content={
walletType={walletType} <WalletTooltipMsg
isDeviceReady={isDeviceReady} walletType={walletType}
/> isDeviceReady={isDeviceReady}
} />
maxWidth={200} }
placement="bottom" maxWidth={200}
mouseEnterDelay={0.5} placement="bottom"
> mouseEnterDelay={0.5}
<DeviceIconWrapper> >
<WalletTypeIcon <DeviceIconWrapper>
onClick={e => { <WalletTypeIcon
if (selectedDevice && isDeviceReady) { onClick={e => {
this.props.duplicateDevice(selectedDevice); if (selectedDevice && isDeviceReady) {
e.stopPropagation(); this.props.duplicateDevice(selectedDevice);
e.stopPropagation();
}
}}
hoverColor={
isDeviceReady
? colors.TEXT_PRIMARY
: colors.TEXT_SECONDARY
} }
}} type={walletType}
hoverColor={ size={16}
isDeviceReady color={colors.TEXT_SECONDARY}
? colors.TEXT_PRIMARY />
: colors.TEXT_SECONDARY </DeviceIconWrapper>
} </Tooltip>
type={walletType} )}
size={16} {this.props.devices.length > 1 && (
color={colors.TEXT_SECONDARY} <Tooltip
/> content={
</DeviceIconWrapper> <FormattedMessage
</Tooltip> {...l10nMessages.TR_NUMBER_OF_DEVICES}
)} />
{this.props.devices.length > 1 && ( }
<Tooltip maxWidth={200}
content={ placement="bottom"
<FormattedMessage {...l10nMessages.TR_NUMBER_OF_DEVICES} /> mouseEnterDelay={0.5}
} >
maxWidth={200} <DeviceIconWrapper>
placement="bottom" <Counter>{this.props.devices.length}</Counter>
mouseEnterDelay={0.5} </DeviceIconWrapper>
> </Tooltip>
<DeviceIconWrapper> )}
<Counter>{this.props.devices.length}</Counter> {/* <Tooltip
</DeviceIconWrapper>
</Tooltip>
)}
{/* <Tooltip
content={ content={
<FormattedMessage <FormattedMessage
{...l10nCommonMessages.TR_APPLICATION_SETTINGS} {...l10nCommonMessages.TR_APPLICATION_SETTINGS}
@ -356,35 +359,40 @@ class LeftNavigation extends React.PureComponent<Props, State> {
</Link> </Link>
</WalletTypeIconWrapper> </WalletTypeIconWrapper>
</Tooltip> */} </Tooltip> */}
<IconDivider /> <IconDivider />
<Icon <Icon
canAnimate={this.state.clicked === true} canAnimate={this.state.clicked === true}
isActive={this.props.wallet.dropdownOpened} isActive={this.props.wallet.dropdownOpened}
size={16} size={16}
color={colors.TEXT_SECONDARY} color={colors.TEXT_SECONDARY}
icon={icons.ARROW_DOWN} icon={icons.ARROW_DOWN}
/> />
</React.Fragment> </React.Fragment>
} }
{...this.props} {...this.props}
/> />
<Body minHeight={this.state.bodyMinHeight}> <Body minHeight={this.state.bodyMinHeight}>
{dropdownOpened && <DeviceMenu ref={this.deviceMenuRef} {...this.props} />} {dropdownOpened && <DeviceMenu ref={this.deviceMenuRef} {...this.props} />}
{isDeviceAccessible && menu} {isDeviceAccessible && menu}
</Body> </Body>
<Footer data-test="Main__page__footer" key="sticky-footer"> <Footer data-test="Main__page__footer" key="sticky-footer">
<Help> <Help>
<A <A
href="https://trezor.io/support/" href="https://trezor.io/support/"
target="_blank" target="_blank"
rel="noreferrer noopener" rel="noreferrer noopener"
> >
<StyledIcon size={14} icon={icons.CHAT} color={colors.TEXT_SECONDARY} /> <StyledIcon
<FormattedMessage {...l10nMessages.TR_NEED_HELP} /> size={14}
</A> icon={icons.CHAT}
</Help> color={colors.TEXT_SECONDARY}
</Footer> />
</Sidebar> <FormattedMessage {...l10nMessages.TR_NEED_HELP} />
</A>
</Help>
</Footer>
</Sidebar>
</>
); );
} }
} }