fixed sizing on recruitment page

ui/src/pages/ManageApplications.vue

@@ -69,13 +69,14 @@ onMounted(async () => {
 })
 </script>
 <template>
-    <Table class="mx-auto max-w-3xl">
+    <div class="mx-auto max-w-5xl">
+        <h1 class="my-4">Manage Applications</h1>
+        <Table>
             <!-- <TableCaption>A list of your recent invoices.</TableCaption> -->
             <TableHeader>
                 <TableRow>
-                <TableHead class="w-[100px]">User</TableHead>
+                    <TableHead>User</TableHead>
                     <TableHead>Date Submitted</TableHead>
-                <TableHead class="text-right"></TableHead>
                     <TableHead class="text-right">Status</TableHead>
                 </TableRow>
             </TableHeader>
@@ -87,10 +88,13 @@ onMounted(async () => {
                         {{ formatAgo(app.submitted_at) }}
                     </TableCell>
                     <TableCell v-if="app.app_status === Status.Pending" class="inline-flex items-end gap-2">
-                    <Button variant="success" @click.stop="() => { handleApprove(app.id) }"><CheckIcon></CheckIcon></Button>
-                    <Button variant="destructive" @click.stop="() => { handleDeny(app.id) }"><XIcon></XIcon></Button>
+                        <Button variant="success" @click.stop="() => { handleApprove(app.id) }">
+                            <CheckIcon></CheckIcon>
+                        </Button>
+                        <Button variant="destructive" @click.stop="() => { handleDeny(app.id) }">
+                            <XIcon></XIcon>
+                        </Button>
                     </TableCell>
-
                     <TableCell class="text-right font-semibold" :class="[
                         ,
                         app.app_status === Status.Pending && 'text-yellow-500',
@@ -100,4 +104,5 @@ onMounted(async () => {
                 </TableRow>
             </TableBody>
         </Table>
+    </div>
 </template>