GREG-157: Updates to buttons to make them more like Figma design

frontend/src/routes/sponsor/register/stepRegistration.tsx

@@ -198,6 +198,7 @@ export default function StepRegistration() {
         {activeStep === Steps.RegisterStep && (
           <Button
             data-testid="button-next"
+            variant="contained"
             color="secondary"
             sx={{ mr: 1 }}
             onClick={handleNext}
@@ -210,6 +211,7 @@ export default function StepRegistration() {
           <>
             <Button
               onClick={handleBack}
+              variant="contained"
               color="secondary"
               disabled={submitState === SubmitState.SubmitSuccess}
               sx={{ mr: 1 }}
@@ -219,6 +221,7 @@ export default function StepRegistration() {
 
             <Button
               onClick={registerGuest}
+              variant="contained"
               color="secondary"
               disabled={submitState === SubmitState.SubmitSuccess}
               sx={{ mr: 1 }}
@@ -230,6 +233,9 @@ export default function StepRegistration() {
 
         {activeStep !== Steps.SuccessStep && (
           <Button
+            sx={{
+              color: (theme) => theme.greg.wizardButtonColor,
+            }}
             onClick={handleCancel}
             color="secondary"
             disabled={submitState === SubmitState.SubmitSuccess}

frontend/src/routes/sponsor/register/stepSubmitSuccess.tsx

@@ -26,6 +26,7 @@ const StepSubmitSuccess = () => {
       </Box>
 
       <Button
+        variant="contained"
         color="secondary"
         sx={{
           marginTop: '2rem',

frontend/src/themes/index.ts

@@ -15,6 +15,7 @@ declare module '@mui/material/styles' {
       deactivatedColor: string
       textWhite: string
       footerLinkBgColor: string
+      wizardButtonColor: string
     }
   }
 
@@ -26,6 +27,7 @@ declare module '@mui/material/styles' {
       deactivatedColor?: string
       textWhite?: string
       footerLinkBgColor?: string
+      wizardButtonColor?: string
     }
   }
 }

frontend/src/themes/uib.ts

@@ -6,6 +6,7 @@ import { ThemeOptions } from '@mui/material'
 const uibTheme: ThemeOptions = {
   greg: {
     footerLinkBgColor: '#383838',
+    wizardButtonColor: 'black',
   },
   typography: {
     fontFamily: ['Open Sans', 'Roboto'].join(','),
@@ -16,9 +17,7 @@ const uibTheme: ThemeOptions = {
       light: '#ff6c6a',
     },
     secondary: {
-      main: '#63b5cc',
-      dark: '#4ea0b7',
-      light: '#7ed0e7',
+      main: '#4ea0b7',
     },
   },
 }

frontend/src/themes/uio.ts

@@ -3,6 +3,7 @@ import { ThemeOptions } from '@mui/material'
 const uioTheme: ThemeOptions = {
   greg: {
     footerLinkBgColor: '#202020',
+    wizardButtonColor: 'black',
   },
   palette: {
     primary: {