diff options
author | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-14 01:44:18 +0800 |
---|---|---|
committer | Ezekiel Aquino <ezekiel@bakkenbaeck.no> | 2018-12-14 01:44:18 +0800 |
commit | ac1786585e24528e34f61a3edc63ad4605cf015a (patch) | |
tree | 5f1a4d01ef5621d0ad17ff71d29299d56a16d04e /packages/website/ts/@next/components/mobileNav.tsx | |
parent | f4a95c295c427c00a5cb2df83ad145886a9d1bf4 (diff) | |
download | dexon-0x-contracts-ac1786585e24528e34f61a3edc63ad4605cf015a.tar.gz dexon-0x-contracts-ac1786585e24528e34f61a3edc63ad4605cf015a.tar.zst dexon-0x-contracts-ac1786585e24528e34f61a3edc63ad4605cf015a.zip |
[WIP] cleanup, typing
Diffstat (limited to 'packages/website/ts/@next/components/mobileNav.tsx')
-rw-r--r-- | packages/website/ts/@next/components/mobileNav.tsx | 23 |
1 files changed, 11 insertions, 12 deletions
diff --git a/packages/website/ts/@next/components/mobileNav.tsx b/packages/website/ts/@next/components/mobileNav.tsx index 9e1231332..c19d4b587 100644 --- a/packages/website/ts/@next/components/mobileNav.tsx +++ b/packages/website/ts/@next/components/mobileNav.tsx @@ -5,8 +5,13 @@ import {Link} from 'react-router-dom'; import {WrapGrid} from 'ts/@next/components/newLayout'; -export class MobileNav extends React.PureComponent { - public render(): React.Node { +interface Props { + isToggled: boolean; + toggleMobileNav: () => void; +} + +export class MobileNav extends React.PureComponent<Props> { + public render(): React.ReactNode { const { isToggled, toggleMobileNav } = this.props; return ( @@ -14,7 +19,7 @@ export class MobileNav extends React.PureComponent { <Section> <h4>Products</h4> - <List> + <ul> <li> <Link to="#"> 0x instant @@ -25,7 +30,7 @@ export class MobileNav extends React.PureComponent { 0x Launch Kit </Link> </li> - </List> + </ul> </Section> <Section isDark={true}> @@ -61,7 +66,7 @@ export class MobileNav extends React.PureComponent { } } -const Wrap = styled.nav` +const Wrap = styled.nav<{ isToggled: boolean }>` width: 100%; height: 357px; background-color: ${props => props.theme.mobileNavBgUpper}; @@ -98,18 +103,12 @@ const Overlay = styled.div` cursor: pointer; `; -const Section = styled.div` +const Section = styled.div<{ isDark?: boolean }>` width: 100%; padding: 15px 30px; background-color: ${props => props.isDark && props.theme.mobileNavBgLower}; `; -const List = styled.ul` - li { - float: ${props => props.inline && 'left'}'' - } -`; - const Grid = styled(WrapGrid)` li { width: 50%; |