mirror of
https://github.com/trezor/trezor-wallet
synced 2025-01-05 22:00:59 +00:00
dont show menu toggler on landing page, fix padding
This commit is contained in:
parent
d80e108754
commit
cac5b73072
@ -34,9 +34,17 @@ const LayoutWrapper = styled.div`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const MenuToggler = styled.div`
|
const Left = styled.div`
|
||||||
display: none;
|
display: none;
|
||||||
flex: 0 0 33%;
|
flex: 0 0 33%;
|
||||||
|
|
||||||
|
@media screen and (max-width: ${SCREEN_SIZE.SM}) {
|
||||||
|
display: initial;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
|
const MenuToggler = styled.div`
|
||||||
|
display: none;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
color: ${colors.WHITE};
|
color: ${colors.WHITE};
|
||||||
align-self: center;
|
align-self: center;
|
||||||
@ -97,15 +105,18 @@ const A = styled.a`
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
|
sidebarEnabled?: boolean,
|
||||||
sidebarOpened?: boolean,
|
sidebarOpened?: boolean,
|
||||||
toggleSidebar?: toggleSidebarType,
|
toggleSidebar?: toggleSidebarType,
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const Header = ({ sidebarOpened, toggleSidebar }: Props) => (
|
const Header = ({ sidebarEnabled, sidebarOpened, toggleSidebar }: Props) => (
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
<LayoutWrapper>
|
<LayoutWrapper>
|
||||||
<MenuToggler onClick={toggleSidebar}>{sidebarOpened ? '✕ Close' : '☰ Menu'}</MenuToggler>
|
<Left>
|
||||||
|
{ sidebarEnabled && <MenuToggler onClick={toggleSidebar}>{sidebarOpened ? '✕ Close' : '☰ Menu'}</MenuToggler>}
|
||||||
|
</Left>
|
||||||
<Logo>
|
<Logo>
|
||||||
<NavLink to="/">
|
<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">
|
<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">
|
||||||
|
@ -18,6 +18,10 @@ type Props = {
|
|||||||
showDisconnect: boolean,
|
showDisconnect: boolean,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const StyledConnectDevice = styled.div`
|
||||||
|
padding: 0px 48px;
|
||||||
|
`;
|
||||||
|
|
||||||
const Title = styled.div`
|
const Title = styled.div`
|
||||||
margin-top: 60px;
|
margin-top: 60px;
|
||||||
`;
|
`;
|
||||||
@ -105,7 +109,7 @@ class ConnectDevice extends PureComponent<Props> {
|
|||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<StyledConnectDevice>
|
||||||
<Title>
|
<Title>
|
||||||
<H2 claim>The private bank in your hands.</H2>
|
<H2 claim>The private bank in your hands.</H2>
|
||||||
<P>Trezor Wallet is an easy-to-use interface for your Trezor.</P>
|
<P>Trezor Wallet is an easy-to-use interface for your Trezor.</P>
|
||||||
@ -156,7 +160,7 @@ class ConnectDevice extends PureComponent<Props> {
|
|||||||
</StyledLink>
|
</StyledLink>
|
||||||
</P>
|
</P>
|
||||||
</Footer>
|
</Footer>
|
||||||
</div>
|
</StyledConnectDevice>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -106,7 +106,7 @@ const StyledBackdrop = styled(Backdrop)`
|
|||||||
|
|
||||||
const Wallet = (props: Props) => (
|
const Wallet = (props: Props) => (
|
||||||
<AppWrapper>
|
<AppWrapper>
|
||||||
<Header sidebarOpened={props.wallet.showSidebar} toggleSidebar={props.toggleSidebar} />
|
<Header sidebarEnabled={!!props.wallet.selectedDevice} sidebarOpened={props.wallet.showSidebar} toggleSidebar={props.toggleSidebar} />
|
||||||
<AppNotifications />
|
<AppNotifications />
|
||||||
<WalletWrapper>
|
<WalletWrapper>
|
||||||
<StyledBackdrop show={props.wallet.showSidebar} onClick={props.toggleSidebar} animated />
|
<StyledBackdrop show={props.wallet.showSidebar} onClick={props.toggleSidebar} animated />
|
||||||
|
Loading…
Reference in New Issue
Block a user