GREG-60: Updates to summary page

frontend/public/locales/en/common.json

@@ -71,6 +71,9 @@
     "registerPeriodText": "Enter role and duration.",
     "summaryContactInformation": "Summary contact information",
     "summaryPeriod": "Summary period",
-    "contactInformation": "Contact information"
+    "contactInformation": "Contact information",
+    "guestRole": "Guest role",
+    "guestPeriod":"Period",
+    "guestDepartment": "Department"
   }
 }

frontend/public/locales/nb/common.json

@@ -71,6 +71,9 @@
     "registerPeriodText": "Fyll inn rolle og periode.",
     "summaryContactInformation": "Summary contact information",
     "summaryPeriod": "Summary period",
-    "contactInformation": "Kontaktinformasjon"
+    "contactInformation": "Kontaktinformasjon",
+    "guestRole": "Gjesterolle",
+    "guestPeriod": "Periode",
+    "guestDepartment": "Avdeling"
   }
 }

frontend/public/locales/nn/common.json

@@ -72,6 +72,9 @@
     "registerPeriodText": "Fyll inn rolle og periode.",
     "summaryContactInformation": "Summary contact information",
     "summaryPeriod": "Summary period",
-    "contactInformation": "Kontaktinformasjon"
+    "contactInformation": "Kontaktinformasjon",
+    "guestRole": "Gjesterolle",
+    "guestPeriod": "Periode",
+    "guestDepartment": "Avdeling"
   }
 }

frontend/src/routes/frontpage/index.tsx

@@ -28,9 +28,6 @@ export default function FrontPage() {
             <li key="register">
               <Link to="/register/">Registration</Link>
             </li>
-            <li key="registerwizard">
-              <Link to="/registerwizard/">Registration wizard</Link>
-            </li>
           </ul>
         </p>
         <Debug />

frontend/src/routes/register/stepSummary.tsx

@@ -9,7 +9,6 @@ import {
   TableCell,
   TableHead,
   TableRow,
-  Typography,
 } from '@mui/material'
 
 import format from 'date-fns/format'
@@ -88,17 +87,25 @@ const StepSummary = forwardRef((props: StepSummaryProperties, ref: Ref<PersonFor
 
     return (
       <>
-        <Typography variant='h5' sx={{
+        <Box sx={{
           paddingTop: '1rem',
           paddingBottom: '1rem',
-        }}>{t('registerWizardText.summaryContactInformation')}</Typography>
-        <Box sx={{ typography: 'subtitle2' }}>
-          {t('registerWizardText.summaryPage')}
+        }}>
+          {t('registerWizardText.summaryContactInformation')}
         </Box>
-        <Box sx={{ maxWidth: '30rem' }}>
-          <Box sx={{ padding: '1rem', bgcolor: 'primary.dark' }}>{t('registerWizardText.contactInformation')}</Box>
 
-          <Grid container>
+        <Box sx={{ typography: 'body2' }}>
+          {t('registerWizardText.summaryPage')}
+        </Box>
+        <Box sx={{ marginTop: '1rem', maxWidth: '50rem' }}>
+          <Box sx={{
+            typography: 'subtitle2',
+            marginBottom: '0.5rem',
+            paddingLeft: '0.5rem',
+            bgcolor: 'primary.dark',
+          }}>{t('registerWizardText.contactInformation')}</Box>
+
+          <Grid sx={{ typography: 'body2', paddingLeft: '0.5rem' }} container>
             <Grid item xs={4}>
               {t('input.fullName')}
             </Grid>
@@ -113,28 +120,30 @@ const StepSummary = forwardRef((props: StepSummaryProperties, ref: Ref<PersonFor
             </Grid>
           </Grid>
 
-          <Typography variant='h5' sx={{
+          <Box sx={{
             paddingTop: '1rem',
             paddingBottom: '1rem',
-          }}>{t('registerWizardText.summaryPeriod')}</Typography>
+          }}>
+            {t('registerWizardText.summaryPeriod')}
+          </Box>
 
           <Table>
             <TableHead sx={{
-              padding: '1rem',
+              paddingLeft: '0.5rem',
               bgcolor: 'primary.dark',
             }}>
 
               <TableRow>
-                <TableCell>Guest role</TableCell>
-                <TableCell>Period</TableCell>
-                <TableCell>Department</TableCell>
-                <TableCell>Comment</TableCell>
+                <TableCell>{t('registerWizardText.guestRole')}</TableCell>
+                <TableCell>{t('registerWizardText.guestPeriod')}</TableCell>
+                <TableCell>{t('registerWizardText.guestDepartment')}</TableCell>
+                <TableCell>{t('input.comment')}</TableCell>
               </TableRow>
             </TableHead>
             <TableBody>
               <TableRow>
                 <TableCell>{roleTypeName}</TableCell>
-                <TableCell>{formData.role_start === null ? null : format(formData.role_start as Date, 'yyyy-MM-dd')}-{formData.role_end === null ? null : format(formData.role_end as Date, 'yyyy-MM-dd')}</TableCell>
+                <TableCell>{formData.role_start === null ? null : format(formData.role_start as Date, 'yyyy-MM-dd')} - {formData.role_end === null ? null : format(formData.role_end as Date, 'yyyy-MM-dd')}</TableCell>
                 <TableCell>{ousName}</TableCell>
                 <TableCell>{formData.comment}</TableCell>
               </TableRow>