Header.tsx · setoelkahfi/personal-website

testing

tsx 44 lines 1.48 KB

Raw

1	import React from 'react';
2	import { Link } from 'react-router-dom';
3	import { FormattedMessage } from 'react-intl';
4
5	const linkStyle = {
6	color: '#fff',
7	font: '11pt "Helvetica Neue", "Helvetica", Arial, sans-serif',
8	}
9
10	const listStyle = {
11	display: 'inline',
12	margin: 4
13	}
14
15	const Header = () => (
16	<header>
17	<nav>
18	<ul>
19	<li style={listStyle}><Link to='/' style={linkStyle}>
20	<FormattedMessage id="header.home"
21	defaultMessage="Home"
22	description="Home link"/>
23	</Link></li>
24	<li style={listStyle}><Link to='/about' style={linkStyle}>
25	<FormattedMessage id="header.about"
26	defaultMessage="About"
27	description="About link"/>
28	</Link></li>
29	<li style={listStyle}><Link to='/cv' style={linkStyle}>
30	<FormattedMessage id="header.cv"
31	defaultMessage="CV"
32	description="CV link"/>
33	</Link></li>
34	<li style={listStyle}><Link to='/contact' style={linkStyle}>
35	<FormattedMessage id="header.contact"
36	defaultMessage="Contact"
37	description="Contact link"/>
38	</Link></li>
39	</ul>
40	</nav>
41	</header>
42	);
43
44	export default Header;