webui: minor styling of the timeline events

3 files changed, 14 insertions, 7 deletions

diff --git a/webui/src/pages/bug/LabelChange.tsx b/webui/src/pages/bug/LabelChange.tsx
index 764947ee..93fa8a32 100644
--- a/webui/src/pages/bug/LabelChange.tsx
+++ b/webui/src/pages/bug/LabelChange.tsx
@@ -10,7 +10,7 @@ import { LabelChangeFragment } from './LabelChangeFragment.generated';
 
 const useStyles = makeStyles(theme => ({
   main: {
-    ...theme.typography.body1,
+    ...theme.typography.body2,
     marginLeft: theme.spacing(1) + 40,
   },
   author: {
diff --git a/webui/src/pages/bug/SetStatus.tsx b/webui/src/pages/bug/SetStatus.tsx
index 251abf69..413f764d 100644
--- a/webui/src/pages/bug/SetStatus.tsx
+++ b/webui/src/pages/bug/SetStatus.tsx
@@ -9,7 +9,7 @@ import { SetStatusFragment } from './SetStatusFragment.generated';
 
 const useStyles = makeStyles(theme => ({
   main: {
-    ...theme.typography.body1,
+    ...theme.typography.body2,
     marginLeft: theme.spacing(1) + 40,
   },
 }));
diff --git a/webui/src/pages/bug/SetTitle.tsx b/webui/src/pages/bug/SetTitle.tsx
index 304fd2e2..64b97517 100644
--- a/webui/src/pages/bug/SetTitle.tsx
+++ b/webui/src/pages/bug/SetTitle.tsx
@@ -9,10 +9,17 @@ import { SetTitleFragment } from './SetTitleFragment.generated';
 
 const useStyles = makeStyles(theme => ({
   main: {
-    ...theme.typography.body1,
+    ...theme.typography.body2,
     marginLeft: theme.spacing(1) + 40,
   },
-  bold: {
+  author: {
+    fontWeight: 'bold',
+  },
+  before: {
+    fontWeight: 'bold',
+    textDecoration: 'line-through',
+  },
+  after: {
     fontWeight: 'bold',
   },
 }));
@@ -25,11 +32,11 @@ function SetTitle({ op }: Props) {
   const classes = useStyles();
   return (
     <div className={classes.main}>
-      <Author author={op.author} className={classes.bold} />
+      <Author author={op.author} className={classes.author} />
       <span> changed the title from </span>
-      <span className={classes.bold}>{op.was}</span>
+      <span className={classes.before}>{op.was}</span>
       <span> to </span>
-      <span className={classes.bold}>{op.title}</span>
+      <span className={classes.after}>{op.title}</span>&nbsp;
       <Date date={op.date} />
     </div>
   );