aboutsummaryrefslogtreecommitdiffstats
path: root/src/views/ChoreEdit
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--src/views/ChoreEdit/ChoreView.jsx62
1 files changed, 48 insertions, 14 deletions
diff --git a/src/views/ChoreEdit/ChoreView.jsx b/src/views/ChoreEdit/ChoreView.jsx
index 172ad9b..b77b511 100644
--- a/src/views/ChoreEdit/ChoreView.jsx
+++ b/src/views/ChoreEdit/ChoreView.jsx
@@ -3,6 +3,7 @@ import {
CancelScheduleSend,
Check,
Checklist,
+ Edit,
History,
PeopleAlt,
Person,
@@ -258,7 +259,7 @@ const ChoreView = () => {
>
<Grid container spacing={1}>
{infoCards.map((detail, index) => (
- <Grid item xs={4} key={index}>
+ <Grid item xs={6} key={index}>
{/* divider between the list items: */}
<ListItem key={index}>
@@ -411,7 +412,15 @@ const ChoreView = () => {
}}
/>
)}
-
+ <Box
+ sx={{
+ display: 'flex',
+ flexDirection: 'row',
+ gap: 1,
+ alignContent: 'center',
+ justifyContent: 'center',
+ }}
+ >
<Button
fullWidth
size='lg'
@@ -419,20 +428,15 @@ const ChoreView = () => {
disabled={isPendingCompletion}
color={isPendingCompletion ? 'danger' : 'success'}
startDecorator={<Check />}
+ sx={
+ {
+ flex: 4,
+ }
+ }
>
<Box>Mark as done</Box>
</Button>
- <Divider sx={{ my: 0.5 }}>or</Divider>
-
- <Box
- sx={{
- display: 'flex',
- flexDirection: 'row',
- gap: 1,
- alignContent: 'center',
- justifyContent: 'center',
- }}
- >
+
<Button
fullWidth
size='lg'
@@ -454,9 +458,26 @@ const ChoreView = () => {
})
}}
startDecorator={<SwitchAccessShortcut />}
+ sx={
+ {
+ flex: 1,
+ }
+ }
>
<Box>Skip</Box>
</Button>
+ </Box>
+ <Divider sx={{ my: 0.5 }}>More</Divider>
+
+ <Box
+ sx={{
+ display: 'flex',
+ flexDirection: 'row',
+ gap: 1,
+ alignContent: 'center',
+ justifyContent: 'center',
+ }}
+ >
<Button
startDecorator={<History />}
size='lg'
@@ -469,8 +490,21 @@ const ChoreView = () => {
>
History
</Button>
- </Box>
+ <Button
+ startDecorator={<Edit />}
+ size='lg'
+ color='primary'
+ variant='outlined'
+ fullWidth
+ onClick={() => {
+ navigate(`/chores/${choreId}/edit`)
+ }}
+ >
+ Edit
+ </Button>
+
+</Box>
<Snackbar
open={isPendingCompletion}
endDecorator={