From 8e8ca99bd5f72de60f6e0e1b334f33312cab5388 Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Wed, 3 Mar 2021 17:49:53 +0100
Subject: Use colors from theme palette

- Use theme colors for title input.
- Remove inputTitle classes as they are not applied to the TextField.
  This will lead to double borders and artifacts at the field corners.
---
 .../components/BugTitleForm/.BugTitleForm.tsx.swp  | Bin 0 -> 20480 bytes
 webui/src/components/BugTitleForm/BugTitleForm.tsx |  24 +++------------------
 2 files changed, 3 insertions(+), 21 deletions(-)
 create mode 100644 webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp

(limited to 'webui/src/components/BugTitleForm')

diff --git a/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp b/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp
new file mode 100644
index 00000000..125bed11
Binary files /dev/null and b/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp differ
diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index c47eab31..97025302 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -45,26 +45,9 @@ const useStyles = makeStyles((theme) => ({
     marginLeft: theme.spacing(2),
   },
   greenButton: {
-    marginLeft: '8px',
-    backgroundColor: '#2ea44fd9',
-    color: '#fff',
-    '&:hover': {
-      backgroundColor: '#2ea44f',
-    },
-  },
-  titleInput: {
-    borderRadius: theme.shape.borderRadius,
-    borderColor: fade(theme.palette.primary.main, 0.2),
-    borderStyle: 'solid',
-    borderWidth: '1px',
-    backgroundColor: fade(theme.palette.primary.main, 0.05),
-    padding: theme.spacing(0, 0),
-    minWidth: 336,
-    transition: theme.transitions.create([
-      'width',
-      'borderColor',
-      'backgroundColor',
-    ]),
+    marginLeft: theme.spacing(1),
+    backgroundColor: theme.palette.success.main,
+    color: theme.palette.success.contrastText,
   },
 }));
 
@@ -126,7 +109,6 @@ function BugTitleForm({ bug }: Props) {
           inputRef={(node) => {
             issueTitleInput = node;
           }}
-          className={classes.titleInput}
           variant="outlined"
           fullWidth
           margin="dense"
-- 
cgit 


From 50484fb97efd62aceafdbb78ed575e94ff7bb1fd Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Wed, 3 Mar 2021 18:14:37 +0100
Subject: Fix spacing between cancle and save button

---
 webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp | Bin 20480 -> 0 bytes
 webui/src/components/BugTitleForm/BugTitleForm.tsx      |   4 ++++
 2 files changed, 4 insertions(+)
 delete mode 100644 webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp

(limited to 'webui/src/components/BugTitleForm')

diff --git a/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp b/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp
deleted file mode 100644
index 125bed11..00000000
Binary files a/webui/src/components/BugTitleForm/.BugTitleForm.tsx.swp and /dev/null differ
diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index 97025302..08a1ac90 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -49,6 +49,9 @@ const useStyles = makeStyles((theme) => ({
     backgroundColor: theme.palette.success.main,
     color: theme.palette.success.contrastText,
   },
+  saveButton: {
+    marginRight: theme.spacing(1),
+  },
 }));
 
 interface Props {
@@ -117,6 +120,7 @@ function BugTitleForm({ bug }: Props) {
         />
         <div className={classes.editButtonContainer}>
           <Button
+            className={classes.saveButton}
             size="small"
             variant="contained"
             type="submit"
-- 
cgit 


From e040fc807e840fcde03a588884d195c44db254a2 Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Wed, 3 Mar 2021 21:09:44 +0100
Subject: Implement title inputfield as custom component

---
 webui/src/components/BugTitleForm/BugTitleForm.tsx | 12 +++----
 .../src/components/BugTitleForm/BugTitleInput.tsx  | 40 ++++++++++++++++++++++
 2 files changed, 44 insertions(+), 8 deletions(-)
 create mode 100644 webui/src/components/BugTitleForm/BugTitleInput.tsx

(limited to 'webui/src/components/BugTitleForm')

diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index 08a1ac90..c31f8ef7 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -1,12 +1,6 @@
 import React, { useState } from 'react';
 
-import {
-  Button,
-  fade,
-  makeStyles,
-  TextField,
-  Typography,
-} from '@material-ui/core';
+import { Button, makeStyles, Typography } from '@material-ui/core';
 
 import { TimelineDocument } from '../../pages/bug/TimelineQuery.generated';
 import IfLoggedIn from '../IfLoggedIn/IfLoggedIn';
@@ -14,6 +8,7 @@ import Author from 'src/components/Author';
 import Date from 'src/components/Date';
 import { BugFragment } from 'src/pages/bug/Bug.generated';
 
+import BugTitleInput from './BugTitleInput';
 import { useSetTitleMutation } from './SetTitle.generated';
 
 /**
@@ -108,10 +103,11 @@ function BugTitleForm({ bug }: Props) {
   function editableBugTitle() {
     return (
       <form className={classes.headerTitle} onSubmit={submitNewTitle}>
-        <TextField
+        <BugTitleInput
           inputRef={(node) => {
             issueTitleInput = node;
           }}
+          label="Title"
           variant="outlined"
           fullWidth
           margin="dense"
diff --git a/webui/src/components/BugTitleForm/BugTitleInput.tsx b/webui/src/components/BugTitleForm/BugTitleInput.tsx
new file mode 100644
index 00000000..d2b060a2
--- /dev/null
+++ b/webui/src/components/BugTitleForm/BugTitleInput.tsx
@@ -0,0 +1,40 @@
+import { createStyles, fade, withStyles, TextField } from '@material-ui/core';
+import { Theme } from '@material-ui/core/styles';
+
+const BugTitleInput = withStyles((theme: Theme) =>
+  createStyles({
+    root: {
+      '& .MuiInputLabel-outlined': {
+        color: theme.palette.text.primary,
+      },
+      '& input:valid + fieldset': {
+        color: theme.palette.text.primary,
+        borderColor: theme.palette.divider,
+        borderWidth: 2,
+      },
+      '& input:valid:hover + fieldset': {
+        color: theme.palette.text.primary,
+        borderColor: fade(theme.palette.divider, 0.3),
+        borderWidth: 2,
+      },
+      '& input:valid:focus + fieldset': {
+        color: theme.palette.text.primary,
+        borderColor: theme.palette.divider,
+      },
+      '& input:invalid + fieldset': {
+        borderColor: theme.palette.error.main,
+        borderWidth: 2,
+      },
+      '& input:invalid:hover + fieldset': {
+        borderColor: theme.palette.error.main,
+        borderWidth: 2,
+      },
+      '& input:invalid:focus + fieldset': {
+        borderColor: theme.palette.error.main,
+        borderWidth: 2,
+      },
+    },
+  })
+)(TextField);
+
+export default BugTitleInput;
-- 
cgit 


From 72eb505308e9e36fda4c82e70fd613deeebdccfe Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Thu, 4 Mar 2021 14:15:25 +0100
Subject: Rename "bug" to "issue"

---
 webui/src/components/BugTitleForm/BugTitleForm.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'webui/src/components/BugTitleForm')

diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index c31f8ef7..fe3080b1 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -173,7 +173,7 @@ function BugTitleForm({ bug }: Props) {
       <div className="classes.headerSubtitle">
         <Typography color={'textSecondary'}>
           <Author author={bug.author} />
-          {' opened this bug '}
+          {' opened this issue '}
           <Date date={bug.createdAt} />
         </Typography>
       </div>
-- 
cgit 


From 56d50e98cf208b4966f62bd72e6f43f57e260833 Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Fri, 5 Mar 2021 10:42:56 +0100
Subject: Revert rename

---
 webui/src/components/BugTitleForm/BugTitleForm.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'webui/src/components/BugTitleForm')

diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx
index fe3080b1..c31f8ef7 100644
--- a/webui/src/components/BugTitleForm/BugTitleForm.tsx
+++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx
@@ -173,7 +173,7 @@ function BugTitleForm({ bug }: Props) {
       <div className="classes.headerSubtitle">
         <Typography color={'textSecondary'}>
           <Author author={bug.author} />
-          {' opened this issue '}
+          {' opened this bug '}
           <Date date={bug.createdAt} />
         </Typography>
       </div>
-- 
cgit