aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/App.js
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/App.js')
-rw-r--r--webui/src/App.js32
1 files changed, 28 insertions, 4 deletions
diff --git a/webui/src/App.js b/webui/src/App.js
index 4a52eca1..b9c57327 100644
--- a/webui/src/App.js
+++ b/webui/src/App.js
@@ -1,5 +1,6 @@
import AppBar from '@material-ui/core/AppBar';
import CssBaseline from '@material-ui/core/CssBaseline';
+import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
import { makeStyles } from '@material-ui/styles';
import Toolbar from '@material-ui/core/Toolbar';
import React from 'react';
@@ -8,12 +9,31 @@ import { Link } from 'react-router-dom';
import BugQuery from './bug/BugQuery';
import ListQuery from './list/ListQuery';
+import CurrentIdentity from './CurrentIdentity';
+
+const theme = createMuiTheme({
+ palette: {
+ primary: {
+ main: '#263238',
+ },
+ },
+});
const useStyles = makeStyles(theme => ({
+ offset: theme.mixins.toolbar,
+ filler: {
+ flexGrow: 1,
+ },
appTitle: {
...theme.typography.h6,
color: 'white',
textDecoration: 'none',
+ display: 'flex',
+ alignItems: 'center',
+ },
+ logo: {
+ height: '42px',
+ marginRight: theme.spacing(2),
},
}));
@@ -21,19 +41,23 @@ export default function App() {
const classes = useStyles();
return (
- <>
+ <ThemeProvider theme={theme}>
<CssBaseline />
- <AppBar position="static" color="primary">
+ <AppBar position="fixed" color="primary">
<Toolbar>
<Link to="/" className={classes.appTitle}>
- git-bug webui
+ <img src="logo.svg" className={classes.logo} alt="git-bug" />
+ git-bug
</Link>
+ <div className={classes.filler}></div>
+ <CurrentIdentity />
</Toolbar>
</AppBar>
+ <div className={classes.offset} />
<Switch>
<Route path="/" exact component={ListQuery} />
<Route path="/bug/:id" exact component={BugQuery} />
</Switch>
- </>
+ </ThemeProvider>
);
}