aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/@next/components
diff options
context:
space:
mode:
authorEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-18 01:30:00 +0800
committerEzekiel Aquino <ezekiel@bakkenbaeck.no>2018-12-18 01:30:00 +0800
commit072c80f475605f104fe6bfea6a225dec4c84cb25 (patch)
treeba2207bc101face15c87452c371f2b3053a408bf /packages/website/ts/@next/components
parentfb623cf63b3c7474f4bfb4bc37dd4afa9ec51e89 (diff)
downloaddexon-sol-tools-072c80f475605f104fe6bfea6a225dec4c84cb25.tar.gz
dexon-sol-tools-072c80f475605f104fe6bfea6a225dec4c84cb25.tar.zst
dexon-sol-tools-072c80f475605f104fe6bfea6a225dec4c84cb25.zip
Removes content transform on mobile nav toggle
Diffstat (limited to 'packages/website/ts/@next/components')
-rw-r--r--packages/website/ts/@next/components/mobileNav.tsx3
-rw-r--r--packages/website/ts/@next/components/siteWrap.tsx1
2 files changed, 2 insertions, 2 deletions
diff --git a/packages/website/ts/@next/components/mobileNav.tsx b/packages/website/ts/@next/components/mobileNav.tsx
index ec1e76366..8b5ffd7e8 100644
--- a/packages/website/ts/@next/components/mobileNav.tsx
+++ b/packages/website/ts/@next/components/mobileNav.tsx
@@ -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;
diff --git a/packages/website/ts/@next/components/siteWrap.tsx b/packages/website/ts/@next/components/siteWrap.tsx
index dae15110b..ad7691885 100644
--- a/packages/website/ts/@next/components/siteWrap.tsx
+++ b/packages/website/ts/@next/components/siteWrap.tsx
@@ -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'};
`;