Add back-to-list-button #10

Lena created 4 years ago

Change summary

webui/src/components/Header/Header.tsx |  7 +++++++
webui/src/pages/bug/CommentForm.tsx    | 11 +++++++++++
2 files changed, 18 insertions(+)

Detailed changes

webui/src/components/Header/Header.tsx

@@ -29,6 +29,13 @@ const useStyles = makeStyles((theme) => ({
     height: '42px',
     marginRight: theme.spacing(2),
   },
+  greenButton: {
+    backgroundColor: '#2ea44fd9',
+    color: '#fff',
+    '&:hover': {
+      backgroundColor: '#2ea44f',
+    },
+  },
 }));
 
 function Header() {

webui/src/pages/bug/CommentForm.tsx

@@ -28,6 +28,7 @@ const useStyles = makeStyles<Theme, StyleProps>((theme) => ({
   },
   actions: {
     display: 'flex',
+    gap: '1em',
     justifyContent: 'flex-end',
   },
   greenButton: {
@@ -38,6 +39,13 @@ const useStyles = makeStyles<Theme, StyleProps>((theme) => ({
       backgroundColor: '#2ea44f',
     },
   },
+  backButton: {
+    backgroundColor: '#574142',
+    color: '#fff',
+    '&:hover': {
+      backgroundColor: '#610B0B',
+    },
+  },
 }));
 
 type Props = {
@@ -101,6 +109,9 @@ function CommentForm({ bug }: Props) {
           onChange={(comment: string) => setIssueComment(comment)}
         />
         <div className={classes.actions}>
+          <Button className={classes.backButton} variant="contained" href="/">
+            Back to List
+          </Button>
           {bug.status === 'OPEN' ? getCloseButton() : getReopenButton()}
           <Button
             className={classes.greenButton}