aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/components/onboarding/onboarding_flow.tsx23
-rw-r--r--packages/website/ts/components/onboarding/onboarding_tooltip.tsx1
2 files changed, 13 insertions, 11 deletions
diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index 8af1a3a3f..d53f63400 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
import { Placement, Popper, PopperChildrenProps } from 'react-popper';
import { OnboardingTooltip } from 'ts/components/onboarding/onboarding_tooltip';
+import { Container } from 'ts/components/ui/container';
import { Overlay } from 'ts/components/ui/overlay';
import { zIndex } from 'ts/utils/style';
@@ -36,7 +37,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
return null;
}
return (
- <Overlay onClick={this.props.onClose}>
+ <Overlay>
<Popper referenceElement={this._getElementForStep()} placement={this._getCurrentStep().placement}>
{this._renderPopperChildren.bind(this)}
</Popper>
@@ -94,11 +95,9 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
}
private _renderPopperChildren(props: PopperChildrenProps): React.ReactNode {
- const { arrowProps } = props;
return (
<div ref={props.ref} style={props.style} data-placement={props.placement}>
{this._renderToolTip()}
- <div ref={arrowProps.ref} style={arrowProps.style} />
</div>
);
}
@@ -108,14 +107,16 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
const step = steps[stepIndex];
const isLastStep = steps.length - 1 === stepIndex;
return (
- <OnboardingTooltip
- title={step.title}
- content={step.content}
- isLastStep={isLastStep}
- onClose={this.props.onClose}
- onClickNext={this._goToNextStep.bind(this)}
- onClickBack={this._goToPrevStep.bind(this)}
- />
+ <Container marginLeft="15px">
+ <OnboardingTooltip
+ title={step.title}
+ content={step.content}
+ isLastStep={isLastStep}
+ onClose={this.props.onClose}
+ onClickNext={this._goToNextStep.bind(this)}
+ onClickBack={this._goToPrevStep.bind(this)}
+ />
+ </Container>
);
}
diff --git a/packages/website/ts/components/onboarding/onboarding_tooltip.tsx b/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
index 2d316b6b7..5e8102af0 100644
--- a/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
@@ -1,5 +1,6 @@
import * as React from 'react';
+import { colors } from '@0xproject/react-shared';
import { Container } from 'ts/components/ui/container';
import { Island } from 'ts/components/ui/island';