Making table responsive (#124)

DaveBathnes · web-flow · commit 18b95ce46c3b · 2025-02-24T23:19:03.000Z
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/Stops.jsx b/src/Stops.jsx
@@ -136,7 +136,7 @@ const Stops = () => {
         Stops
       </ListSubheader>
       <div style={{ display: 'flex', height: '100%' }}>
-        <div style={{ flexGrow: 1 }}>
+        <div style={{ flexGrow: 1, width: '100%' }}>
           <DataGrid
             sx={{
               backgroundColor: 'white',
diff --git a/src/theme.js b/src/theme.js
@@ -30,6 +30,11 @@ const theme = createTheme({
         }
       }
     }
+  },
+  mixins: {
+    MuiDataGrid: {
+      containerBackground: blueGrey[50]
+    }
   }
 })
 

Original file line number	Diff line number	Diff line change
`@@ -30,6 +30,11 @@ const theme = createTheme({`
`30`	`30`	`}`
`31`	`31`	`}`
`32`	`32`	`}`
	`33`	`+ },`
	`34`	`+ mixins: {`
	`35`	`+ MuiDataGrid: {`
	`36`	`+ containerBackground: blueGrey[50]`
	`37`	`+ }`
`33`	`38`	`}`
`34`	`39`	`})`
`35`	`40`