#2142 remove page blocks misc page

Author: walker-sean

src/frontend/src/pages/AdminToolsPage/AdminToolsAttendeeDesignReviewInfo.tsx

@@ -1,6 +1,16 @@
 import React, { useState } from 'react';
-import PageBlock from '../../layouts/PageBlock';
-import { TextField, FormControl, FormLabel, Select, MenuItem, SelectChangeEvent, TableCell, TableRow } from '@mui/material';
+import {
+  TextField,
+  FormControl,
+  FormLabel,
+  Select,
+  MenuItem,
+  SelectChangeEvent,
+  TableCell,
+  TableRow,
+  Grid,
+  Typography
+} from '@mui/material';
 import AdminToolTable from './AdminToolTable';
 
 const AdminToolsAttendeeDesignReviewInfo: React.FC = () => {
@@ -37,7 +47,10 @@ const AdminToolsAttendeeDesignReviewInfo: React.FC = () => {
   ));
 
   return (
-    <PageBlock title="Attendee Design Review Information">
+    <Grid>
+      <Typography variant="h5" gutterBottom>
+        Design Review Attendee Info
+      </Typography>
       <FormControl fullWidth sx={{ marginBottom: 2 }}>
         <FormLabel htmlFor="search-by-name">Search by team member name</FormLabel>
         <TextField id="search-by-name" variant="outlined" value={searchQuery} onChange={handleSearchChange} fullWidth />
@@ -68,7 +81,7 @@ const AdminToolsAttendeeDesignReviewInfo: React.FC = () => {
         ]}
         rows={attendeeRows}
       />
-    </PageBlock>
+    </Grid>
   );
 };
 

src/frontend/src/pages/AdminToolsPage/AdminToolsPage.tsx

@@ -16,6 +16,7 @@ import AdminToolsProjectsConfig from './AdminToolsProjectsConfig';
 import { useState } from 'react';
 import NERTabs from '../../components/Tabs';
 import { routes } from '../../utils/routes';
+import { Box } from '@mui/system';
 
 const AdminToolsPage: React.FC = () => {
   const currentUser = useCurrentUser();
@@ -82,10 +83,12 @@ const AdminToolsPage: React.FC = () => {
       ) : tabIndex === 2 ? (
         <AdminToolsFinanceConfig />
       ) : (
-        <>
-          <AdminToolsSlackUpcomingDeadlines />
+        <Box>
+          <Box pb={2}>
+            <AdminToolsSlackUpcomingDeadlines />
+          </Box>
           <AdminToolsAttendeeDesignReviewInfo />
-        </>
+        </Box>
       )}
     </PageLayout>
   );

src/frontend/src/pages/AdminToolsPage/AdminToolsSlackUpcomingDeadlines.tsx

@@ -3,9 +3,8 @@
  * See the LICENSE file in the repository root folder for details.
  */
 
-import PageBlock from '../../layouts/PageBlock';
 import { NERButton } from '../../components/NERButton';
-import { Grid, TextField, Tooltip, Typography } from '@mui/material';
+import { Box, Grid, TextField, Tooltip, Typography } from '@mui/material';
 import { useState } from 'react';
 import { useSlackUpcomingDeadlines } from '../../hooks/work-packages.hooks';
 import { DatePicker } from '@mui/x-date-pickers';
@@ -44,9 +43,12 @@ const AdminToolsSlackUpcomingDeadlines: React.FC = () => {
   );
 
   return (
-    <PageBlock title="Slack Upcoming Deadlines">
+    <Box>
+      <Typography variant="h5" gutterBottom>
+        Slack Upcoming Deadlines
+      </Typography>
       <Grid container spacing={2} alignItems="center">
-        <Grid item display="flex" xs={12} sm>
+        <Grid item display="flex" xs={12} sm="auto">
           <Tooltip title={tooltipMessage} placement="right" arrow sx={{ fontSize: 24 }}>
             <HelpIcon sx={{ mr: 2, height: 50 }} />
           </Tooltip>
@@ -67,7 +69,7 @@ const AdminToolsSlackUpcomingDeadlines: React.FC = () => {
           </NERButton>
         </Grid>
       </Grid>
-    </PageBlock>
+    </Box>
   );
 };