-
Notifications
You must be signed in to change notification settings - Fork 1
/
header.js
46 lines (44 loc) · 1.08 KB
/
header.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import { Link } from 'gatsby'
import React from 'react'
import logo from '../images/logo.png'
function Header({ title }) {
return (
<header>
<div className="nav">
<input type="checkbox" id="nav-check" />
<div className="nav-header">
<img className="logo-badge" src={logo} alt="Logo" />
<div className="nav-title">{title}</div>
</div>
<div className="nav-btn">
<label htmlFor="nav-check">
<span></span>
<span></span>
<span></span>
</label>
</div>
<div className="nav-links">
{[
{
route: `#home`,
title: `Home`,
},
{
route: `#about`,
title: `About us`,
},
{
route: `#contact`,
title: `Contact`,
},
].map(link => (
<Link key={link.title} to={link.route}>
{link.title}
</Link>
))}
</div>
</div>
</header>
)
}
export default Header