crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Removes content transform on mobile nav toggle

Browse Source
This commit is contained in:
Ezekiel Aquino
2018-12-17 18:30:00 +01:00
parent fb623cf63b
commit 072c80f475
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/website/ts/@next/components/mobileNav.tsx
View File

@@ -70,8 +70,9 @@ const Wrap = styled.nav<{ isToggled: boolean }>`
height: 357px;
background-color: ${props => props.theme.mobileNavBgUpper};
color: ${props => props.theme.mobileNavColor};
transition: transform 0.5s;
transition: ${props => props.isToggled ? 'visibility 0s, transform 0.5s' : 'visibility 0s 0.5s, transform 0.5s'};
transform: translate3d(0, ${props => props.isToggled ? 0 : '-100%'}, 0);
visibility: ${props => !props.isToggled && 'hidden'};
position: fixed;
display: flex;
flex-direction: column;

1
packages/website/ts/@next/components/siteWrap.tsx
View File

@@ -145,6 +145,5 @@ export class SiteWrap extends React.Component<Props, State> {
const Main = styled.main<MainProps>`
transition: transform 0.5s, opacity 0.5s;
transform: translate3d(0, ${props => props.isNavToggled ? '357px' : 0}, 0);
opacity: ${props => props.isNavToggled && '0.5'};
`;