Reduced ratio of panes on md+ screens, added spacing on CDS Hooks car…

…ds buttons, moved Grid component out of dropdown component
mcode · Sep 5, 2023 · f1749c9 · f1749c9
1 parent 0d0e5db
commit f1749c9
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 18 deletions.
diff --git a/src/views/Patient/MedReqDropDown/MedReqDropDown.tsx b/src/views/Patient/MedReqDropDown/MedReqDropDown.tsx
@@ -245,7 +245,7 @@ function MedReqDropDown(props: MedReqDropDownProps) {
 
   const label = 'Select Medication Request';
   return (
-    <Grid item xs={12} md={6}>
+    <>
       <Card sx={{ bgcolor: 'white' }}>
         <CardContent>
           <Grid item container spacing={2}>
@@ -350,7 +350,7 @@ function MedReqDropDown(props: MedReqDropDownProps) {
           />
         </Box>
       </Modal>
-    </Grid>
+    </>
   );
 }
 

diff --git a/src/views/Patient/MedReqDropDown/cdsHooksCards/cdsHooksCard.tsx b/src/views/Patient/MedReqDropDown/cdsHooksCards/cdsHooksCard.tsx
@@ -174,7 +174,7 @@ const CdsHooksCard = (props: CdsHooksCardProps) => {
           </Typography>
         </CardContent>
         <CardActions>
-          <Grid container>
+          <Grid container spacing={1}>
             {links.map((link: Link) => {
               if (link.type === 'smart') {
                 return (

diff --git a/src/views/Patient/PatientView.tsx b/src/views/Patient/PatientView.tsx
@@ -49,17 +49,12 @@ function PatientView(props: PatientViewProps) {
   return (
     <Box flexGrow={1}>
       <Grid container spacing={2}>
-        <Grid item xs={12}>
-          <Typography variant="h4" component="h1" textAlign="center">
-            Launched with patient context:
-          </Typography>
-        </Grid>
-        <Grid item xs={12} md={6}>
+        <Grid item xs={12} md={4}>
           {patient ? (
             <Card sx={{ bgcolor: 'white' }}>
               <CardContent>
-                <Typography component="h2" variant="h5" gutterBottom>
-                  Patient Info
+                <Typography component="h1" variant="h5">
+                  Patient information loaded from patient context
                 </Typography>
                 <TableContainer>
                   <Table>
@@ -78,18 +73,18 @@ function PatientView(props: PatientViewProps) {
               </CardContent>
             </Card>
           ) : (
-            <Typography component="h2" variant="h5">
+            <Typography component="h1" variant="h5">
               Loading patient info...
             </Typography>
           )}
         </Grid>
-        {client ? (
-          <MedReqDropDown client={client} tabCallback={props.tabCallback} />
-        ) : (
-          <Grid item xs={12} md={6}>
+        <Grid item xs={12} md={8}>
+          {client ? (
+            <MedReqDropDown client={client} tabCallback={props.tabCallback} />
+          ) : (
             <p>Loading medication request...</p>
-          </Grid>
-        )}
+          )}
+        </Grid>
       </Grid>
     </Box>
   );