fix continue button positioning

Signed-off-by: shmck <shawn.j.mckay@gmail.com>

Author: ShMcK

web-app/src/containers/Tutorial/components/Continue.tsx

@@ -7,8 +7,9 @@ import ProgressPie from './ProgressPie'
 const styles = {
   content: {
     display: 'flex' as 'flex',
-    flexDirection: 'column',
-    justifyContent: 'center',
+    flexDirection: 'column' as 'column',
+    justifyContent: 'center' as 'center',
+    alignItems: 'center' as 'center',
   },
   message: {
     textAlign: 'center' as 'center',

web-app/src/containers/Tutorial/index.tsx

@@ -155,14 +155,16 @@ const TutorialPage = (props: PageProps) => {
         {/* Right */}
         <div css={{ flex: 1, display: 'flex', justifyContent: 'flex-end' }}>
           {level.status === 'COMPLETE' || !level.steps.length ? (
-            <Continue
-              onContinue={onContinue}
-              current={levelIndex + 1}
-              max={level.steps.length}
-              title={tutorial.summary.title}
-            />
+            <div css={{ marginRight: '0.5rem' }}>
+              <Continue
+                onContinue={onContinue}
+                current={levelIndex + 1}
+                max={levels.length}
+                title={tutorial.summary.title}
+              />
+            </div>
           ) : level.steps.length > 1 ? (
-            <StepProgress current={stepIndex} max={level.steps.length} />
+            <StepProgress current={stepIndex + 1} max={level.steps.length} />
           ) : null}
         </div>
       </div>