diff options
author | Brandon Millman <brandon.millman@gmail.com> | 2018-11-29 05:46:41 +0800 |
---|---|---|
committer | Brandon Millman <brandon.millman@gmail.com> | 2018-11-29 05:46:41 +0800 |
commit | 63cb312c7fc5d53934473bade954157027f0f230 (patch) | |
tree | 9813b5d47035c6312ea786c808b9f04b7a4bafca /packages/website/ts/pages/instant/instant.tsx | |
parent | e1c237a8e42c337cb329a4e2822d714bea4c7756 (diff) | |
download | dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar.gz dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar.bz2 dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar.lz dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar.xz dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.tar.zst dexon-sol-tools-63cb312c7fc5d53934473bade954157027f0f230.zip |
feat(website): implement link directly to configure
Diffstat (limited to 'packages/website/ts/pages/instant/instant.tsx')
-rw-r--r-- | packages/website/ts/pages/instant/instant.tsx | 22 |
1 files changed, 19 insertions, 3 deletions
diff --git a/packages/website/ts/pages/instant/instant.tsx b/packages/website/ts/pages/instant/instant.tsx index c747f3d10..b758ef162 100644 --- a/packages/website/ts/pages/instant/instant.tsx +++ b/packages/website/ts/pages/instant/instant.tsx @@ -1,3 +1,4 @@ +import { utils as sharedUtils } from '@0x/react-shared'; import * as _ from 'lodash'; import * as React from 'react'; import * as DocumentTitle from 'react-document-title'; @@ -26,6 +27,7 @@ export interface InstantProps { export interface InstantState {} +const CONFIGURATOR_HASH = 'configure'; const THROTTLE_TIMEOUT = 100; const DOCUMENT_TITLE = '0x Instant'; const DOCUMENT_DESCRIPTION = '0x Instant'; @@ -42,7 +44,6 @@ export class Instant extends React.Component<InstantProps, InstantState> { window.scrollTo(0, 0); } public render(): React.ReactNode { - const isSmallScreen = this.props.screenWidth === ScreenWidths.Sm; return ( <Container overflowX="hidden"> <MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} /> @@ -55,15 +56,30 @@ export class Instant extends React.Component<InstantProps, InstantState> { isNightVersion={true} /> <Container backgroundColor={colors.instantPrimaryBackground} /> - <Introducing0xInstant screenWidth={this.props.screenWidth} /> + <Introducing0xInstant screenWidth={this.props.screenWidth} onCTAClick={this._onHeaderCTAClick} /> <Screenshots screenWidth={this.props.screenWidth} /> <Features screenWidth={this.props.screenWidth} /> - {!isSmallScreen && <Configurator />} + {!this._isSmallScreen() && <Configurator hash={CONFIGURATOR_HASH} />} <NeedMore screenWidth={this.props.screenWidth} /> <Footer translate={this.props.translate} dispatcher={this.props.dispatcher} /> </Container> ); } + private readonly _onHeaderCTAClick = () => { + if (this._isSmallScreen()) { + utils.openUrl(`${utils.getCurrentBaseUrl()}/wiki#About`); + } else { + this._scrollToConfigurator(); + } + }; + private _isSmallScreen(): boolean { + const isSmallScreen = this.props.screenWidth === ScreenWidths.Sm; + return isSmallScreen; + } + private _scrollToConfigurator(): void { + sharedUtils.setUrlHash(CONFIGURATOR_HASH); + sharedUtils.scrollToHash(CONFIGURATOR_HASH, ''); + } private _updateScreenWidth(): void { const newScreenWidth = utils.getScreenWidth(); this.props.dispatcher.updateScreenWidth(newScreenWidth); |