Bunch of look n feel standardization in wizard

packages/web/components/Setup/SetupPersonalityType.tsx

@@ -107,7 +107,7 @@ export const SetupPersonalityType: React.FC<SetupPersonalityTypeProps> = ({
   };
 
   return (
-    <FlexContainer maxW="100%">
+    <FlexContainer>
       <Flex direction="column">
         {isWizard && (
           <MetaHeading mb={5} textAlign="center">
@@ -155,9 +155,11 @@ export const SetupPersonalityType: React.FC<SetupPersonalityTypeProps> = ({
                   key={mask}
                   display="flex"
                   direction="row"
+                  justifyContent="start"
                   p={6}
                   m={2}
                   h="auto"
+                  w={{ base: '100%', md: 'auto' }}
                   spacing={4}
                   borderRadius={8}
                   cursor="pointer"
@@ -195,6 +197,7 @@ export const SetupPersonalityType: React.FC<SetupPersonalityTypeProps> = ({
                     w="100%"
                     maxW={16}
                     h={16}
+                    mr={2}
                     src={image}
                     alt={option.name}
                     filter="drop-shadow(0px 0px 3px black)"
@@ -217,7 +220,7 @@ export const SetupPersonalityType: React.FC<SetupPersonalityTypeProps> = ({
             })}
       </FlexContainer>
 
-      <ColorBar mask={colorMask} mt={8} w="min(100vw, 30rem)" />
+      <ColorBar mask={colorMask} mt={8} w="min(90vw, 30rem)" />
 
       {isEdit && onClose && (
         <ModalFooter mt={6}>

packages/web/components/Setup/SetupRoles.tsx

@@ -113,11 +113,7 @@ export const SetupRoles: React.FC<SetupRolesProps> = ({
 
   return (
     <FlexContainer align="center" mx={{ base: 0, md: 8, lg: 16 }}>
-      <MetaHeading
-        mb={{ base: 6, sm: 16 }}
-        alignSelf="center"
-        fontSize={{ base: 'md', md: 'lg' }}
-      >
+      <MetaHeading mb={{ base: 6, sm: 16 }} alignSelf="center">
         Select your role(s)
       </MetaHeading>
       {fetchingExistingRoles && <LoadingState />}

packages/web/pages/profile/setup/personalityType.tsx

@@ -1,9 +1,18 @@
 import { SetupPersonalityType } from 'components/Setup/SetupPersonalityType';
 import { SetupProfile } from 'components/Setup/SetupProfile';
 import { SetupContextProvider } from 'contexts/SetupContext';
+import { InferGetStaticPropsType } from 'next';
 import React from 'react';
 
-const PersonalityTypeSetup: React.FC = () => (
+export const getStaticProps = async () => ({
+  props: {
+    hideTopMenu: true,
+  },
+});
+
+export type DefaultSetupProps = InferGetStaticPropsType<typeof getStaticProps>;
+
+const PersonalityTypeSetup: React.FC<DefaultSetupProps> = () => (
   <SetupContextProvider>
     <SetupProfile>
       <SetupPersonalityType />

packages/web/pages/profile/setup/playerType.tsx

@@ -1,9 +1,18 @@
 import { SetupPlayerType } from 'components/Setup/SetupPlayerType';
 import { SetupProfile } from 'components/Setup/SetupProfile';
 import { SetupContextProvider } from 'contexts/SetupContext';
+import { InferGetStaticPropsType } from 'next';
 import React from 'react';
 
-const PlayerTypeSetup: React.FC = () => (
+export const getStaticProps = async () => ({
+  props: {
+    hideTopMenu: true,
+  },
+});
+
+export type DefaultSetupProps = InferGetStaticPropsType<typeof getStaticProps>;
+
+const PlayerTypeSetup: React.FC<DefaultSetupProps> = () => (
   <SetupContextProvider>
     <SetupProfile>
       <SetupPlayerType />

packages/web/pages/profile/setup/pronouns.tsx

@@ -7,7 +7,7 @@ import React, { useState } from 'react';
 
 export const getStaticProps = async () => ({
   props: {
-    hideAppDrawer: true,
+    hideTopMenu: true,
   },
 });
 

packages/web/pages/profile/setup/skills.tsx

@@ -1,9 +1,18 @@
 import { SetupProfile } from 'components/Setup/SetupProfile';
 import { SetupSkills } from 'components/Setup/SetupSkills';
 import { SetupContextProvider } from 'contexts/SetupContext';
+import { InferGetStaticPropsType } from 'next';
 import React from 'react';
 
-const SkillsSetup: React.FC = () => (
+export const getStaticProps = async () => ({
+  props: {
+    hideTopMenu: true,
+  },
+});
+
+export type DefaultSetupProps = InferGetStaticPropsType<typeof getStaticProps>;
+
+const SkillsSetup: React.FC<DefaultSetupProps> = () => (
   <SetupContextProvider>
     <SetupProfile>
       <SetupSkills />