You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
47 lines
1.3 KiB
47 lines
1.3 KiB
3 years ago
|
import AppBar from '@mui/material/AppBar'
|
||
|
|
import Container from '@mui/material/Container'
|
||
|
|
import Toolbar from '@mui/material/Toolbar'
|
||
|
|
import IconButton from '@mui/material/IconButton'
|
||
|
|
import Home from '@mui/icons-material/Home'
|
||
|
|
import { styled } from '@mui/system'
|
||
|
|
import MuiNextLink from '@components/MuiNextLink'
|
||
|
|
import Navbar from '@components/Navbar'
|
||
|
|
import SideDrawer from '@components/SideDrawer'
|
||
|
|
|
||
|
|
const Offset = styled("div")(({ theme }) => theme.mixins.toolbar)
|
||
|
|
|
||
|
|
const navLinks = [
|
||
|
|
{ title: `home`, path: '/' },
|
||
|
|
{ title: `about`, path: '/about' },
|
||
|
|
]
|
||
|
|
|
||
|
|
const Header = () => {
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<AppBar position="fixed">
|
||
|
|
<Toolbar>
|
||
|
|
<Container
|
||
|
|
maxWidth="lg"
|
||
|
|
sx={{ display: "flex", justifyContent: "space-between" }}
|
||
|
|
>
|
||
|
|
<IconButton edge="start" aria-label="home">
|
||
|
|
<MuiNextLink activeClassName="active" href="/">
|
||
|
|
<Home
|
||
|
|
sx={{
|
||
|
|
color: (theme) => theme.palette.common.white,
|
||
|
|
}}
|
||
|
|
fontSize="large"
|
||
|
|
/>
|
||
|
|
</MuiNextLink>
|
||
|
|
</IconButton>
|
||
|
|
<Navbar navLinks={navLinks} />
|
||
|
|
<SideDrawer navLinks={navLinks} />
|
||
|
|
</Container>
|
||
|
|
</Toolbar>
|
||
|
|
</AppBar>
|
||
|
|
<Offset />
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Header
|