aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/pages
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/pages')
-rw-r--r--webui/src/pages/bug/Message.tsx10
-rw-r--r--webui/src/pages/list/Filter.tsx4
-rw-r--r--webui/src/pages/list/FilterToolbar.tsx4
-rw-r--r--webui/src/pages/list/ListQuery.tsx30
-rw-r--r--webui/src/pages/new/NewBugPage.tsx27
5 files changed, 30 insertions, 45 deletions
diff --git a/webui/src/pages/bug/Message.tsx b/webui/src/pages/bug/Message.tsx
index 91549483..faff5356 100644
--- a/webui/src/pages/bug/Message.tsx
+++ b/webui/src/pages/bug/Message.tsx
@@ -27,11 +27,13 @@ const useStyles = makeStyles((theme) => ({
},
header: {
...theme.typography.body1,
- color: '#444',
padding: '0.5rem 1rem',
- borderBottom: '1px solid #ddd',
+ borderBottom: `1px solid ${theme.palette.divider}`,
display: 'flex',
- backgroundColor: '#e2f1ff',
+ borderTopRightRadius: theme.shape.borderRadius,
+ borderTopLeftRadius: theme.shape.borderRadius,
+ backgroundColor: theme.palette.info.main,
+ color: theme.palette.info.contrastText,
},
title: {
flex: 1,
@@ -47,7 +49,7 @@ const useStyles = makeStyles((theme) => ({
},
body: {
...theme.typography.body2,
- padding: '0 1rem',
+ padding: '0.5rem',
},
}));
diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx
index 5c4a3d17..66702078 100644
--- a/webui/src/pages/list/Filter.tsx
+++ b/webui/src/pages/list/Filter.tsx
@@ -65,7 +65,7 @@ function stringify(params: Query): string {
const useStyles = makeStyles((theme) => ({
element: {
...theme.typography.body2,
- color: '#444',
+ color: theme.palette.text.secondary,
padding: theme.spacing(0, 1),
fontWeight: 400,
textDecoration: 'none',
@@ -75,7 +75,7 @@ const useStyles = makeStyles((theme) => ({
},
itemActive: {
fontWeight: 600,
- color: '#333',
+ color: theme.palette.text.primary,
},
icon: {
paddingRight: theme.spacing(0.5),
diff --git a/webui/src/pages/list/FilterToolbar.tsx b/webui/src/pages/list/FilterToolbar.tsx
index 21626416..e4cd8e6a 100644
--- a/webui/src/pages/list/FilterToolbar.tsx
+++ b/webui/src/pages/list/FilterToolbar.tsx
@@ -19,8 +19,8 @@ import { useBugCountQuery } from './FilterToolbar.generated';
const useStyles = makeStyles((theme) => ({
toolbar: {
- backgroundColor: theme.palette.grey['100'],
- borderColor: theme.palette.grey['300'],
+ backgroundColor: theme.palette.primary.light,
+ borderColor: theme.palette.divider,
borderWidth: '1px 0',
borderStyle: 'solid',
margin: theme.spacing(0, -1),
diff --git a/webui/src/pages/list/ListQuery.tsx b/webui/src/pages/list/ListQuery.tsx
index 87c21e3c..fec7c33b 100644
--- a/webui/src/pages/list/ListQuery.tsx
+++ b/webui/src/pages/list/ListQuery.tsx
@@ -6,7 +6,7 @@ import { Button } from '@material-ui/core';
import IconButton from '@material-ui/core/IconButton';
import InputBase from '@material-ui/core/InputBase';
import Paper from '@material-ui/core/Paper';
-import { fade, makeStyles, Theme } from '@material-ui/core/styles';
+import { makeStyles, Theme } from '@material-ui/core/styles';
import ErrorOutline from '@material-ui/icons/ErrorOutline';
import KeyboardArrowLeft from '@material-ui/icons/KeyboardArrowLeft';
import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight';
@@ -56,10 +56,11 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({
},
search: {
borderRadius: theme.shape.borderRadius,
- borderColor: fade(theme.palette.primary.main, 0.2),
+ color: theme.palette.text.secondary,
+ borderColor: theme.palette.divider,
borderStyle: 'solid',
borderWidth: '1px',
- backgroundColor: fade(theme.palette.primary.main, 0.05),
+ backgroundColor: theme.palette.primary.light,
padding: theme.spacing(0, 1),
width: ({ searching }) => (searching ? '20rem' : '15rem'),
transition: theme.transitions.create([
@@ -69,13 +70,11 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({
]),
},
searchFocused: {
- borderColor: fade(theme.palette.primary.main, 0.4),
backgroundColor: theme.palette.background.paper,
- width: '20rem!important',
},
placeholderRow: {
padding: theme.spacing(1),
- borderBottomColor: theme.palette.grey['300'],
+ borderBottomColor: theme.palette.divider,
borderBottomWidth: '1px',
borderBottomStyle: 'solid',
display: 'flex',
@@ -91,7 +90,8 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({
...theme.typography.h5,
padding: theme.spacing(8),
textAlign: 'center',
- borderBottomColor: theme.palette.grey['300'],
+ color: theme.palette.text.hint,
+ borderBottomColor: theme.palette.divider,
borderBottomWidth: '1px',
borderBottomStyle: 'solid',
'& > p': {
@@ -99,22 +99,22 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({
},
},
errorBox: {
- color: theme.palette.error.main,
+ color: theme.palette.error.dark,
'& > pre': {
fontSize: '1rem',
textAlign: 'left',
- backgroundColor: theme.palette.grey['900'],
- color: theme.palette.common.white,
+ borderColor: theme.palette.divider,
+ borderWidth: '1px',
+ borderRadius: theme.shape.borderRadius,
+ borderStyle: 'solid',
+ color: theme.palette.text.primary,
marginTop: theme.spacing(4),
padding: theme.spacing(2, 3),
},
},
greenButton: {
- backgroundColor: '#2ea44fd9',
- color: '#fff',
- '&:hover': {
- backgroundColor: '#2ea44f',
- },
+ backgroundColor: theme.palette.success.main,
+ color: theme.palette.success.contrastText,
},
}));
diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx
index c9e268b6..a46226ad 100644
--- a/webui/src/pages/new/NewBugPage.tsx
+++ b/webui/src/pages/new/NewBugPage.tsx
@@ -2,9 +2,9 @@ import React, { FormEvent, useState } from 'react';
import { Button } from '@material-ui/core';
import Paper from '@material-ui/core/Paper';
-import TextField from '@material-ui/core/TextField/TextField';
-import { fade, makeStyles, Theme } from '@material-ui/core/styles';
+import { makeStyles, Theme } from '@material-ui/core/styles';
+import BugTitleInput from '../../components/BugTitleForm/BugTitleInput';
import CommentInput from '../../components/CommentInput/CommentInput';
import { useNewBugMutation } from './NewBug.generated';
@@ -21,19 +21,6 @@ const useStyles = makeStyles((theme: Theme) => ({
padding: theme.spacing(2),
overflow: 'hidden',
},
- 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),
- transition: theme.transitions.create([
- 'width',
- 'borderColor',
- 'backgroundColor',
- ]),
- },
form: {
display: 'flex',
flexDirection: 'column',
@@ -43,11 +30,8 @@ const useStyles = makeStyles((theme: Theme) => ({
justifyContent: 'flex-end',
},
greenButton: {
- backgroundColor: '#2ea44fd9',
- color: '#fff',
- '&:hover': {
- backgroundColor: '#2ea44f',
- },
+ backgroundColor: theme.palette.success.main,
+ color: theme.palette.success.contrastText,
},
}));
@@ -85,12 +69,11 @@ function NewBugPage() {
return (
<Paper className={classes.main}>
<form className={classes.form} onSubmit={submitNewIssue}>
- <TextField
+ <BugTitleInput
inputRef={(node) => {
issueTitleInput = node;
}}
label="Title"
- className={classes.titleInput}
variant="outlined"
fullWidth
margin="dense"
generated by cgit (git 2.34.1) at 2024-11-06 13:34:28 +0000