diff options
author | fragosti <francesco.agosti93@gmail.com> | 2018-06-21 02:25:59 +0800 |
---|---|---|
committer | fragosti <francesco.agosti93@gmail.com> | 2018-06-21 02:25:59 +0800 |
commit | 39ccb2df0b43d3915337259789c393e4603b964c (patch) | |
tree | d3957561a13f0a13f73413f280a9090636c8985b /packages/website/ts/components | |
parent | e5fe6b915e760b38a22a8d314fb62364470160eb (diff) | |
download | dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar.gz dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar.bz2 dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar.lz dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar.xz dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.tar.zst dexon-0x-contracts-39ccb2df0b43d3915337259789c393e4603b964c.zip |
Scroll to wallet for mobile onboarding
Diffstat (limited to 'packages/website/ts/components')
-rw-r--r-- | packages/website/ts/components/portal/portal.tsx | 51 |
1 files changed, 28 insertions, 23 deletions
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx index 3d7bbfd0a..b1860954c 100644 --- a/packages/website/ts/components/portal/portal.tsx +++ b/packages/website/ts/components/portal/portal.tsx @@ -345,29 +345,30 @@ export class Portal extends React.Component<PortalProps, PortalState> { return ( <div> {isMobile && <Container marginBottom="15px">{startOnboarding}</Container>} - <Wallet - // style={this.props.isPortalOnboardingShowing ? { zIndex: zIndex.aboveOverlay } : undefined} - style={true ? { zIndex: zIndex.aboveOverlay } : undefined} - userAddress={this.props.userAddress} - networkId={this.props.networkId} - blockchain={this._blockchain} - blockchainIsLoaded={this.props.blockchainIsLoaded} - blockchainErr={this.props.blockchainErr} - dispatcher={this.props.dispatcher} - tokenByAddress={this.props.tokenByAddress} - trackedTokens={this._getCurrentTrackedTokens()} - userEtherBalanceInWei={this.props.userEtherBalanceInWei} - lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch} - injectedProviderName={this.props.injectedProviderName} - providerType={this.props.providerType} - screenWidth={this.props.screenWidth} - location={this.props.location} - trackedTokenStateByAddress={this.state.trackedTokenStateByAddress} - onToggleLedgerDialog={this._onToggleLedgerDialog.bind(this)} - onAddToken={this._onAddToken.bind(this)} - onRemoveToken={this._onRemoveToken.bind(this)} - refetchTokenStateAsync={this._refetchTokenStateAsync.bind(this)} - /> + <Container marginBottom="15px"> + <Wallet + style={this.props.isPortalOnboardingShowing ? { zIndex: zIndex.aboveOverlay } : undefined} + userAddress={this.props.userAddress} + networkId={this.props.networkId} + blockchain={this._blockchain} + blockchainIsLoaded={this.props.blockchainIsLoaded} + blockchainErr={this.props.blockchainErr} + dispatcher={this.props.dispatcher} + tokenByAddress={this.props.tokenByAddress} + trackedTokens={this._getCurrentTrackedTokens()} + userEtherBalanceInWei={this.props.userEtherBalanceInWei} + lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch} + injectedProviderName={this.props.injectedProviderName} + providerType={this.props.providerType} + screenWidth={this.props.screenWidth} + location={this.props.location} + trackedTokenStateByAddress={this.state.trackedTokenStateByAddress} + onToggleLedgerDialog={this._onToggleLedgerDialog.bind(this)} + onAddToken={this._onAddToken.bind(this)} + onRemoveToken={this._onRemoveToken.bind(this)} + refetchTokenStateAsync={this._refetchTokenStateAsync.bind(this)} + /> + </Container> {!isMobile && <Container marginTop="15px">{startOnboarding}</Container>} </div> ); @@ -400,6 +401,10 @@ export class Portal extends React.Component<PortalProps, PortalState> { const networkName = sharedConstants.NETWORK_NAME_BY_ID[this.props.networkId]; analytics.logEvent('Portal', 'Onboarding Started - Manual', networkName, this.props.portalOnboardingStep); this.props.dispatcher.updatePortalOnboardingShowing(true); + // On mobile, make sure the wallet is completely visible. + if (this.props.screenWidth === ScreenWidths.Sm) { + document.querySelector('.wallet').scrollIntoView(); + } } private _renderWalletSection(): React.ReactNode { return <Section header={<TextHeader labelText="Your Account" />} body={this._renderWallet()} />; |