arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-09 15:40:55 +00:00
Code Issues Releases Wiki Activity

height of the overlay without js calc

Browse Source
This commit is contained in:
slowbackspace 2019-03-23 19:52:23 +01:00
parent 5f883bfeb8
commit 7f0b1373e3
2 changed files with 4 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js
View File

@ -14,15 +14,10 @@ import l10nCommonMessages from 'views/common.messages';
import MenuItems from './components/MenuItems';
import DeviceList from './components/DeviceList';
import type { Props as BaseProps } from '../common';
import type { Props } from '../common';
import Divider from '../Divider';
type OwnProps = {
overlayHeight: number,
};
type Props = BaseProps & OwnProps;
const Wrapper = styled.div`
position: absolute;
z-index: 1;
@ -37,7 +32,7 @@ const Wrapper = styled.div`
const Overlay = styled.div`
position: absolute;
width: 100%;
height: ${props => `${props.height}px`};
height: 100%;
background: rgba(0, 0, 0, 0.2);
animation: ${FADE_IN} 0.25s;
`;
@ -156,7 +151,6 @@ class DeviceMenu extends PureComponent<Props> {
onClick={() => {
toggleDeviceDropdown(!dropdownOpened);
}}
height={this.props.overlayHeight}
/>
</>
);

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

@ -163,21 +163,18 @@ type State = {
animationType: ?string,
clicked: boolean,
bodyMinHeight: number,
bodyHeight: number,
};
class LeftNavigation extends React.PureComponent<Props, State> {
constructor(props: Props) {
super(props);
this.deviceMenuRef = React.createRef();
this.leftMenuBodyRef = React.createRef();
const { location } = this.props.router;
const hasNetwork = location && location.state && location.state.network;
this.state = {
animationType: hasNetwork ? 'slide-left' : null,
clicked: false,
bodyMinHeight: 0,
bodyHeight: 0,
};
}
@ -234,17 +231,10 @@ class LeftNavigation extends React.PureComponent<Props, State> {
bodyMinHeight: this.deviceMenuRef.current.getMenuHeight(),
});
}
if (this.leftMenuBodyRef.current) {
this.setState({
bodyHeight: this.leftMenuBodyRef.current.getBoundingClientRect().height,
});
}
}
deviceMenuRef: { current: any };
leftMenuBodyRef: { current: any };
render() {
const { props } = this;
let menu;
@ -376,14 +366,8 @@ class LeftNavigation extends React.PureComponent<Props, State> {
}
{...this.props}
/>
<Body ref={this.leftMenuBodyRef} minHeight={this.state.bodyMinHeight}>
{dropdownOpened && (
<DeviceMenu
ref={this.deviceMenuRef}
overlayHeight={this.state.bodyHeight}
{...this.props}
/>
)}
<Body minHeight={this.state.bodyMinHeight}>
{dropdownOpened && <DeviceMenu ref={this.deviceMenuRef} {...this.props} />}
{isDeviceAccessible && menu}
</Body>
<Footer data-test="Main__page__footer" key="sticky-footer">