diff options
author | Eugene <eug-vs@keemail.me> | 2020-01-28 19:56:24 +0000 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-01-28 19:56:24 +0000 |
commit | 547a6101f3ec0d01680cd14bf74c9a8386b9a835 (patch) | |
tree | 2ffa01673377d33af49ea8dbc317cde6f2bf0a42 /src/components/Header | |
parent | 4486c9f47ab4f9ba76ac09fab6bd8dd41e08cf7a (diff) | |
parent | 1ea6ae2f80e5e3f60ad89b4d6d02281c817cee43 (diff) | |
download | chrono-cube-ui-547a6101f3ec0d01680cd14bf74c9a8386b9a835.tar.gz |
Merge pull request #47 from Eug-VS/benzin
Migrate to BENZIN
Diffstat (limited to 'src/components/Header')
-rw-r--r-- | src/components/Header/Header.js | 72 |
1 files changed, 0 insertions, 72 deletions
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js deleted file mode 100644 index 1595141..0000000 --- a/src/components/Header/Header.js +++ /dev/null @@ -1,72 +0,0 @@ -import React from 'react'; - -import { - AppBar, - Tabs, - Tab, - Typography, - Toolbar, -} from '@material-ui/core'; - -import { makeStyles } from '@material-ui/core/styles'; -import TimerIcon from '@material-ui/icons/Timer'; -import AccountCircleIcon from '@material-ui/icons/AccountCircle'; -import AssignmentIcon from '@material-ui/icons/Assignment'; -import GitHubIcon from '@material-ui/icons/GitHub'; - - -const useStyles = makeStyles(theme => ({ - logo: { - color: theme.palette.secondary.main, - margin: theme.spacing(0, 3, 0, 3), - }, - tab: { - '& .MuiTab-wrapper': { - padding: theme.spacing(2), - flexDirection: 'row', - '& svg': { - marginRight: theme.spacing(1), - marginBottom: '0 !important', - } - } - } -})); - - -const Header = ({ page, setPage }) => { - const classes = useStyles(); - - const handleChange = (event, newPage) => { - setPage(newPage); - }; - - const icons = { - app: (<TimerIcon />), - profile: (<AccountCircleIcon />), - scoreboard: (<AssignmentIcon />), - contribute: (<GitHubIcon />), - }; - - return ( - <AppBar position="sticky"> - <Toolbar> - <Typography variant="h4" className={classes.logo}> - ChronoCube - </Typography> - <Tabs onChange={handleChange} value={page}> - { Object.keys(icons).map(item => ( - <Tab - label={item} - icon={icons[item]} - value={item} - className={classes.tab} - key={item} - /> - ))} - </Tabs> - </Toolbar> - </AppBar> - ); -}; - -export default Header; |