2019-08-11 21:47:22 +02:00
|
|
|
import React from 'react'
|
|
|
|
import shortid from 'shortid'
|
|
|
|
import SEO from '../../components/atoms/SEO'
|
2019-11-13 14:08:57 +01:00
|
|
|
import Icon from '../../components/atoms/Icon'
|
2019-08-11 21:47:22 +02:00
|
|
|
import { useResume } from '../../hooks/use-resume'
|
|
|
|
import styles from './index.module.scss'
|
|
|
|
import ResumeItem from './ResumeItem'
|
|
|
|
|
|
|
|
export default function Resume() {
|
2019-11-08 23:00:47 +01:00
|
|
|
const { basics, education, languages, work, awards } = useResume()
|
|
|
|
const { name, label, email, website, location } = basics
|
2019-08-11 21:47:22 +02:00
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<SEO />
|
|
|
|
|
|
|
|
<div className={styles.resume}>
|
|
|
|
<header>
|
|
|
|
<p>Résumé</p>
|
2019-11-08 23:00:47 +01:00
|
|
|
<h1 className={styles.title}>{name}</h1>
|
|
|
|
<h2 className={styles.label}>{label}</h2>
|
2019-08-11 21:47:22 +02:00
|
|
|
</header>
|
|
|
|
|
|
|
|
<div>
|
|
|
|
<ul className={styles.contact}>
|
|
|
|
<li>
|
2019-11-08 23:00:47 +01:00
|
|
|
<a href={website}>
|
2019-11-13 14:08:57 +01:00
|
|
|
<Icon name="Compass" />
|
2019-11-08 23:00:47 +01:00
|
|
|
Portfolio
|
2019-08-11 21:47:22 +02:00
|
|
|
</a>
|
|
|
|
</li>
|
|
|
|
<li>
|
2019-11-13 14:08:57 +01:00
|
|
|
<Icon name="Mail" />
|
2019-11-08 23:00:47 +01:00
|
|
|
<a href={`mailto:${email}`}>Email</a>
|
2019-08-11 21:47:22 +02:00
|
|
|
</li>
|
|
|
|
<li>
|
2019-11-13 14:08:57 +01:00
|
|
|
<Icon name="MapPin" />
|
2019-11-08 23:00:47 +01:00
|
|
|
{location.city}, {location.countryCode}
|
2019-08-11 21:47:22 +02:00
|
|
|
</li>
|
|
|
|
<li>
|
2019-11-13 14:08:57 +01:00
|
|
|
<Icon name="Mic" />
|
2019-08-11 21:47:22 +02:00
|
|
|
{languages.map(item => (
|
|
|
|
<span
|
|
|
|
key={item.language}
|
|
|
|
>{`${item.language} (${item.fluency})`}</span>
|
|
|
|
))}
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div>
|
2019-11-13 14:08:57 +01:00
|
|
|
<h3 className={styles.subTitle}>
|
|
|
|
<Icon name="Briefcase" />
|
|
|
|
Work
|
|
|
|
</h3>
|
2019-08-11 21:47:22 +02:00
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
{work.map(workPlace => (
|
|
|
|
<ResumeItem key={shortid.generate()} workPlace={workPlace} />
|
|
|
|
))}
|
|
|
|
</div>
|
|
|
|
|
2019-11-08 23:00:47 +01:00
|
|
|
<div>
|
2019-11-13 14:08:57 +01:00
|
|
|
<h3 className={styles.subTitle}>
|
|
|
|
<Icon name="Award" />
|
|
|
|
Awards
|
|
|
|
</h3>
|
2019-11-08 23:00:47 +01:00
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
{awards.map(award => (
|
|
|
|
<ResumeItem key={shortid.generate()} award={award} />
|
|
|
|
))}
|
|
|
|
</div>
|
|
|
|
|
2019-08-11 21:47:22 +02:00
|
|
|
<div>
|
2019-11-13 14:08:57 +01:00
|
|
|
<h3 className={styles.subTitle}>
|
|
|
|
<Icon name="BookOpen" />
|
|
|
|
Education
|
|
|
|
</h3>
|
2019-08-11 21:47:22 +02:00
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
{education.map(eduPlace => (
|
|
|
|
<ResumeItem key={shortid.generate()} eduPlace={eduPlace} />
|
|
|
|
))}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|