Merge pull request #711 from 0xProject/website/feature/prettier-onboarding-components

Made onboarding look like the mocks

1 files changed, 7 insertions, 5 deletions

diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index 9879cd387..34aeace82 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -10,9 +10,10 @@ export interface Step {
     title?: string;
     content: React.ReactNode;
     placement?: Placement;
-    hideBackButton?: boolean;
-    hideNextButton?: boolean;
+    shouldHideBackButton?: boolean;
+    shouldHideNextButton?: boolean;
     continueButtonDisplay?: ContinueButtonDisplay;
+    continueButtonText?: string;
 }
 
 export interface OnboardingFlowProps {
@@ -54,17 +55,18 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
         const step = steps[stepIndex];
         const isLastStep = steps.length - 1 === stepIndex;
         return (
-            <Container marginLeft="15px">
+            <Container marginLeft="30px">
                 <OnboardingTooltip
                     title={step.title}
                     content={step.content}
                     isLastStep={isLastStep}
-                    hideBackButton={step.hideBackButton}
-                    hideNextButton={step.hideNextButton}
+                    shouldHideBackButton={step.shouldHideBackButton}
+                    shouldHideNextButton={step.shouldHideNextButton}
                     onClose={this.props.onClose}
                     onClickNext={this._goToNextStep.bind(this)}
                     onClickBack={this._goToPrevStep.bind(this)}
                     continueButtonDisplay={step.continueButtonDisplay}
+                    continueButtonText={step.continueButtonText}
                 />
             </Container>
         );