Merge pull request #94 from the-collab-lab/km-add-style-search-form-a…

…nd-legend added style to search form and legend
the-collab-lab · Apr 7, 2024 · 4c62972 · 4c62972
2 parents ad69b4c + 7b26fc5
commit 4c62972
Showing 1 changed file with 24 additions and 6 deletions.
diff --git a/src/views/List.jsx b/src/views/List.jsx
@@ -227,7 +227,6 @@ export function List({ data, listPath }) {
  </Grid>
  <Grid item>
  <Button
-
  type="submit"
  variant="outlined"
  sx={{
@@ -242,7 +241,6 @@ export function List({ data, listPath }) {
  fontSize: '1.5rem',
  margin: '10px',
  }}
-
  >
  Submit
  </Button>
@@ -389,7 +387,19 @@ export function List({ data, listPath }) {
  >
  {listName} List
  </Typography>
- <Box sx={{ display: 'flex', alignItems: 'center' }}>
+ <Box
+ sx={{
+ display: 'flex',
+ alignItems: 'center',
+ borderColor: (theme) =>
+ theme.palette.mode === 'dark' ? '#f8f9fa' : '#003780',
+ borderStyle: 'solid',
+ borderWidth: '1px',
+ padding: '20px',
+ backgroundColor: (theme) =>
+ theme.palette.mode === 'dark' ? '#003780' : '#f8f9fa',
+ }}
+ >
  <FormControl variant="standard" sx={{ width: '250px' }}>
  <InputLabel
  htmlFor="itemSearch"
@@ -454,7 +464,17 @@ export function List({ data, listPath }) {
  justifyContent="center"
  spacing={{ xs: 0, md: 2 }}
  mt={1}
- sx={{ mt: { xs: 1 }, mb: { xs: 0 } }}
+ sx={{
+ mt: { xs: 1 },
+ mb: { xs: 0 },
+ borderColor: (theme) =>
+ theme.palette.mode === 'dark' ? '#f8f9fa' : '#003780',
+ borderStyle: 'solid',
+ borderWidth: '1px',
+ padding: '10px',
+ backgroundColor: (theme) =>
+ theme.palette.mode === 'dark' ? '#003780' : '#ffffff',
+ }}
  >
  <Grid item sx={{ ml: 4, mr: 4 }}>
  <Grid container>
@@ -502,10 +522,8 @@ export function List({ data, listPath }) {
  <Grid container spacing={2}>
  {filteredData.map((item) => {
  return (
-
  <Grid item xs={12} md={6} key={item.id}>
  <ListItem
-
  daysUntilNextPurchase={item.daysUntilNextPurchase}
  dateLastPurchased={item.dateLastPurchased}
  itemId={item.id}