1
0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-03 21:00:55 +00:00

dont show menu toggler on landing page, fix padding

This commit is contained in:
slowbackspace 2019-01-24 22:46:23 +01:00
parent d80e108754
commit cac5b73072
3 changed files with 21 additions and 6 deletions

View File

@ -34,9 +34,17 @@ const LayoutWrapper = styled.div`
}
`;
const MenuToggler = styled.div`
const Left = styled.div`
display: none;
flex: 0 0 33%;
@media screen and (max-width: ${SCREEN_SIZE.SM}) {
display: initial;
}
`;
const MenuToggler = styled.div`
display: none;
white-space: nowrap;
color: ${colors.WHITE};
align-self: center;
@ -97,15 +105,18 @@ const A = styled.a`
`;
type Props = {
sidebarEnabled?: boolean,
sidebarOpened?: boolean,
toggleSidebar?: toggleSidebarType,
};
const Header = ({ sidebarOpened, toggleSidebar }: Props) => (
const Header = ({ sidebarEnabled, sidebarOpened, toggleSidebar }: Props) => (
<Wrapper>
<LayoutWrapper>
<MenuToggler onClick={toggleSidebar}>{sidebarOpened ? '✕ Close' : '☰ Menu'}</MenuToggler>
<Left>
{ sidebarEnabled && <MenuToggler onClick={toggleSidebar}>{sidebarOpened ? '✕ Close' : '☰ Menu'}</MenuToggler>}
</Left>
<Logo>
<NavLink to="/">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 163.7 41.9" width="100%" height="100%" preserveAspectRatio="xMinYMin meet">

View File

@ -18,6 +18,10 @@ type Props = {
showDisconnect: boolean,
};
const StyledConnectDevice = styled.div`
padding: 0px 48px;
`;
const Title = styled.div`
margin-top: 60px;
`;
@ -105,7 +109,7 @@ class ConnectDevice extends PureComponent<Props> {
render() {
return (
<div>
<StyledConnectDevice>
<Title>
<H2 claim>The private bank in your hands.</H2>
<P>Trezor Wallet is an easy-to-use interface for your Trezor.</P>
@ -156,7 +160,7 @@ class ConnectDevice extends PureComponent<Props> {
</StyledLink>
</P>
</Footer>
</div>
</StyledConnectDevice>
);
}
}

View File

@ -106,7 +106,7 @@ const StyledBackdrop = styled(Backdrop)`
const Wallet = (props: Props) => (
<AppWrapper>
<Header sidebarOpened={props.wallet.showSidebar} toggleSidebar={props.toggleSidebar} />
<Header sidebarEnabled={!!props.wallet.selectedDevice} sidebarOpened={props.wallet.showSidebar} toggleSidebar={props.toggleSidebar} />
<AppNotifications />
<WalletWrapper>
<StyledBackdrop show={props.wallet.showSidebar} onClick={props.toggleSidebar} animated />