Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit e1efe051 authored by Martin Déclert's avatar Martin Déclert
Browse files

Intégration de la page cv

parent e3c92ed7
No related branches found
No related tags found
No related merge requests found
......@@ -9,8 +9,16 @@ class Router {
})
}
resume () {
this.router.get('/resume', async (req, res) => {
return res.render('views/base', {template: 'resume'})
})
}
listen () {
this.home()
this.resume()
return this.router
}
}
......
www/assets/backgrounds/professional-path-bg.jpg

64.9 KiB

www/assets/backgrounds/resume-bg.jpg

301 KiB

......@@ -39,67 +39,77 @@ header {
height: 686px;
}
.home-page header .flex-wrapper {
footer {
margin-top: 4rem;
background: #202020;
text-align: center;
padding: 2rem;
}
header .flex-wrapper {
display: grid;
grid-template-columns: 101px 9fr;
column-gap: 1rem;
height: 100%;
}
.home-page header .flex-wrapper .content {
header .flex-wrapper .content {
width: calc(100% - (111px));
height: calc(100% - 3rem);
background: url("/assets/backgrounds/primary-bg.jpg");
}
.home-page header .flex-wrapper .content .links {
header .flex-wrapper .content .links {
display: flex;
justify-content: center;
margin-top: 8%;
}
.home-page header .flex-wrapper .content .links img {
header .flex-wrapper .content .links img {
width: 2rem;
}
.home-page header .flex-wrapper .content .links .separator {
header .flex-wrapper .content .links .separator {
width: 7rem;
height: 1px;
background: #EBEBEB;
margin: 0 2rem;
align-self: center;
}
.home-page header h1 {
header h1 {
margin-bottom: 1rem;
letter-spacing: 10px;
font-size: 2.5rem;
}
.home-page header h2 {
header h2 {
padding-top: 15%;
}
.home-page header h2 span {
header h2 span {
display: block;
text-align: center;
}
.home-page header > img {
header > img {
position: absolute;
bottom: -7rem;
right: 0;
}
.home-page header nav {
header nav {
position: absolute;
right: calc(111px);
bottom: -3rem;
}
.home-page header nav a {
header nav a {
text-decoration: none;
transition: all 0.3s ease;
transition: color 0.3s ease;
}
.home-page header nav a:not(:last-child) {
header nav a:not(:last-child) {
margin-right: 2rem;
}
.home-page header nav a.current {
text-decoration: underline;
}
.home-page header nav a:hover {
header nav a:hover {
color: #0A5797;
}
.home-page header .content {
background: url("/assets/backgrounds/primary-bg.jpg");
}
.home-page header nav .home-link {
text-decoration: underline;
}
.home-page .hello-section {
background-image: url("/assets/backgrounds/hello-world-bg.jpg");
background-repeat: no-repeat;
......@@ -147,11 +157,36 @@ header {
text-align: center;
margin-top: 1rem;
}
.home-page footer {
margin-top: 4rem;
background: #202020;
text-align: center;
padding: 2rem;
.resume-page header .content {
background: url("/assets/backgrounds/resume-bg.jpg");
background-size: cover;
}
.resume-page header nav .resume-link {
text-decoration: underline;
}
.resume-page .pro-section .content {
margin-top: 1rem;
background-image: url("/assets/backgrounds/professional-path-bg.jpg");
background-repeat: no-repeat;
background-position: right;
}
.resume-page .pro-section .content .experience {
margin-bottom: 2rem;
max-width: 700px;
}
.resume-page .pro-section .content .experience .period {
font-family: "Hammersmith One";
}
.resume-page .school-section .content {
margin-top: 1rem;
}
.resume-page .school-section .content .school {
margin-bottom: 1.5rem;
max-width: 700px;
}
.resume-page .school-section .content .school .period {
font-family: "Hammersmith One";
}
/*# sourceMappingURL=main.css.map */
{"version":3,"sourceRoot":"","sources":["../scss/main.scss","../scss/atoms/home.scss"],"names":[],"mappings":"AAAQ;AAER;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;;AAIR;EACI;EACA;EACA;EACA;;;ACtCI;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAMhB;EACI;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAMhB;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAMhB;EACI;EACA;EACA;EACA","file":"main.css"}
\ No newline at end of file
{"version":3,"sourceRoot":"","sources":["../scss/main.scss","../scss/atoms/header.scss","../scss/atoms/home.scss","../scss/atoms/resume.scss"],"names":[],"mappings":"AAAQ;AAER;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AC9CA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAMhB;EACI;EACA;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;;;AChER;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;;;AC5DZ;EACI;EACA;;AAGJ;EACI;;AAKJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;AAOZ;EACI;;AAEA;EACI;EACA;;AAEA;EACI","file":"main.css"}
\ No newline at end of file
header {
.flex-wrapper {
display: grid;
grid-template-columns: 101px 9fr;
column-gap: 1rem;
height: 100%;
.content {
width: calc(100% - (111px));
height: calc(100% - 3rem);
.links {
display: flex;
justify-content: center;
margin-top: 8%;
img {
width: 2rem;
}
.separator {
width: 7rem;
height: 1px;
background: #EBEBEB;
margin: 0 2rem;
align-self: center;
}
}
}
}
h1 {
margin-bottom: 1rem;
letter-spacing: 10px;
font-size: 2.5rem;
}
h2 {
padding-top: 15%;
span {
display: block;
text-align: center;
}
}
& > img {
position: absolute;
bottom: -7rem;
right: 0;
}
nav {
position: absolute;
right: calc(111px);
bottom: -3rem;
a {
text-decoration: none;
transition: color .3s ease;
&:not(:last-child) {
margin-right: 2rem;
}
&:hover {
color: #0A5797;
}
}
}
}
\ No newline at end of file
.home-page {
header {
.flex-wrapper {
display: grid;
grid-template-columns: 101px 9fr;
column-gap: 1rem;
height: 100%;
.content {
width: calc(100% - (111px));
height: calc(100% - 3rem);
background: url('/assets/backgrounds/primary-bg.jpg');
.links {
display: flex;
justify-content: center;
margin-top: 8%;
img {
width: 2rem;
}
.separator {
width: 7rem;
height: 1px;
background: #EBEBEB;
margin: 0 2rem;
align-self: center;
}
}
}
}
h1 {
margin-bottom: 1rem;
letter-spacing: 10px;
font-size: 2.5rem;
}
h2 {
padding-top: 15%;
span {
display: block;
text-align: center;
}
}
& > img {
position: absolute;
bottom: -7rem;
right: 0;
.content {
background: url('/assets/backgrounds/primary-bg.jpg');
}
nav {
position: absolute;
right: calc(111px);
bottom: -3rem;
a {
text-decoration: none;
transition: all .3s ease;
&:not(:last-child) {
margin-right: 2rem;
}
&.current {
text-decoration: underline;
}
&:hover {
color: #0A5797;
}
}
nav .home-link {
text-decoration: underline;
}
}
......@@ -132,11 +65,4 @@
}
}
}
footer {
margin-top: 4rem;
background: #202020;
text-align: center;
padding: 2rem;
}
}
\ No newline at end of file
.resume-page {
header {
.content {
background: url('/assets/backgrounds/resume-bg.jpg');
background-size: cover;
}
nav .resume-link {
text-decoration: underline;
}
}
.pro-section {
.content {
margin-top: 1rem;
background-image: url('/assets/backgrounds/professional-path-bg.jpg');
background-repeat: no-repeat;
background-position: right;
.experience {
margin-bottom: 2rem;
max-width: 700px;
.period {
font-family: 'Hammersmith One';
}
}
}
}
.school-section {
.content {
margin-top: 1rem;
.school {
margin-bottom: 1.5rem;
max-width: 700px;
.period {
font-family: 'Hammersmith One';
}
}
}
}
}
\ No newline at end of file
......@@ -41,4 +41,13 @@ header {
height: 686px;
}
@import 'atoms/home';
\ No newline at end of file
footer {
margin-top: 4rem;
background: #202020;
text-align: center;
padding: 2rem;
}
@import 'atoms/header';
@import 'atoms/home';
@import 'atoms/resume';
\ No newline at end of file
......@@ -10,6 +10,7 @@
<body class="<%- template %>-page">
<%- include('pages/' + template) -%>
<%- include('pages/parts/footer') -%>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Martin Déclert - Développeur web Back-end</title>
<link rel="stylesheet" href="style/style.css">
</head>
<body>
<header>
<div class="flex-wrapper">
<div class="left">
<img src="assets/icons/logo.svg" alt="DEC logo">
</div>
<div class="right">
<h1>Martin Déclert</h1>
<div class="content">
<h2>
<span class="white">Développement Web Back-end</span>
<span class="white">PHP - Node.js</span>
</h2>
<div class="links">
<a href="#gitlab">
<img src="assets/icons/gitlab.svg" alt="gitlab">
</a>
<span class="separator"></span>
<a href="#linkedin">
<img src="assets/icons/linkedin.svg" alt="linkedin">
</a>
</div>
</div>
</div>
</div>
<img src="assets/icons/secondary-logo.svg" alt="">
<nav>
<a href="#home" class="selected current">home</a>
<a href="#projects">projects</a>
<a href="#resume">resume</a>
<a href="#contact">contact</a>
</nav>
</header>
<section class="hello-section">
<h3>Hello World!</h3>
<div class="content">
<div class="paragraph">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean volutpat porta justo, in aliquam justo
viverra vel.
In hac habitasse platea dictumst. Etiam et purus libero. Curabitur eget metus ex. Orci varius natoque
penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Sed porta, nisl tincidunt lacinia egestas, massa
nunc tincidunt
libero, et dignissim neque neque ac metus.
</div>
<div class="paragraph">
Suspendisse potenti. Curabitur at elit sit amet augue suscipit vehicula.
Mauris vitae vulputate neque. Aenean nec venenatis lacus. Aliquam tempus augue non augue aliquam tempus.
Etiam fermentum
felis sit amet nulla scelerisque, ut fermentum nulla semper.
</div>
</div>
</section>
<section class="skills-section">
<h3>Skills</h3>
<div class="content">
<div class="skill">
<div class="title">
<img src="assets/icons/html.svg" alt="HTML">
<h4>HTML/CSS</h4>
</div>
<ul class="description">
<li>Intégration web</li>
<li>SEO</li>
</ul>
</div>
<div class="skill">
<div class="title">
<img src="assets/icons/javascript.svg" alt="JavaScript">
<h4>JavaScript</h4>
</div>
<ul class="description">
<li>développement front-end</li>
<li>Vanilla - jQuery</li>
</ul>
</div>
<div class="skill">
<div class="title">
<img src="assets/icons/backend.svg" alt="Back-end">
<h4>Back-end</h4>
</div>
<ul class="description">
<li>
<span>PHP</span><br>
<span>Magento 1.9 / Laravel</span>
</li>
<li>
<span>Node.js</span><br>
<span>Express / Adonis</span>
</li>
</ul>
</div>
<div class="skill">
<div class="title">
<img src="assets/icons/administration.svg" alt="Administration">
<h4>Administration</h4>
</div>
<ul class="description">
<li>Linux Git Docker</li>
<li>Apache2 NGINX</li>
</ul>
</div>
</div>
</section>
<footer>
<span>Copyright - Martin Déclert - 2020</span>
</footer>
</body>
</html>
\ No newline at end of file
<header>
<div class="flex-wrapper">
<div class="left">
<img src="assets/icons/logo.svg" alt="DEC logo">
</div>
<div class="right">
<h1>Martin Déclert</h1>
<div class="content">
<h2>
<span class="white">Développement Web Back-end</span>
<span class="white">PHP - Node.js</span>
</h2>
<div class="links">
<a href="#gitlab">
<img src="assets/icons/gitlab.svg" alt="gitlab">
</a>
<span class="separator"></span>
<a href="#linkedin">
<img src="assets/icons/linkedin.svg" alt="linkedin">
</a>
</div>
</div>
</div>
</div>
<img src="assets/icons/secondary-logo.svg" alt="">
<nav>
<a href="#home" class="selected current">home</a>
<a href="#projects">projects</a>
<a href="#resume">resume</a>
<a href="#contact">contact</a>
</nav>
<%- include('parts/header', {
upperTitle: 'Développement Web Back-end',
downTitle: 'PHP - Node.js'
}) -%>
</header>
<section class="hello-section">
<h3>Hello World!</h3>
......@@ -48,7 +22,6 @@
Etiam fermentum
felis sit amet nulla scelerisque, ut fermentum nulla semper.
</div>
<a href="#projects">voir mes projets</a>
</div>
</section>
<section class="skills-section">
......@@ -101,7 +74,4 @@
</ul>
</div>
</div>
</section>
<footer>
<span class="white">Copyright - Martin Déclert - 2020</span>
</footer>
\ No newline at end of file
</section>
\ No newline at end of file
<footer>
<span class="white">Copyright - Martin Déclert - 2020</span>
</footer>
\ No newline at end of file
<div class="flex-wrapper">
<div class="left">
<img src="assets/icons/logo.svg" alt="DEC logo">
</div>
<div class="right">
<h1>Martin Déclert</h1>
<div class="content">
<h2>
<span class="white"><%= upperTitle %></span>
<span class="white"><%= downTitle %></span>
</h2>
<div class="links">
<a href="#gitlab">
<img src="assets/icons/gitlab.svg" alt="gitlab">
</a>
<span class="separator"></span>
<a href="#linkedin">
<img src="assets/icons/linkedin.svg" alt="linkedin">
</a>
</div>
</div>
</div>
</div>
<img src="assets/icons/secondary-logo.svg" alt="">
<nav>
<a href="/" class="home-link">home</a>
<a href="/resume" class="resume-link">resume</a>
<a href="#contact" class="conatct-link">contact</a>
</nav>
\ No newline at end of file
<header>
<%- include('parts/header', {
upperTitle: 'Curriculum Vitae',
downTitle: 'Parcours scolaire et professionel'
}) -%>
</header>
<section class="pro-section">
<h3>Parcours professionel</h3>
<div class="content">
<div class="experience">
<div class="title">
<div class="period">Janvier 2019 - Aujourd’hui :</div>
<div class="entreprise">Alternant développeur Back-end à Horace</div>
</div>
<div class="description">
<p>
Ma mission consiste principalement à implémenter de nouvelles fonctionnalités au site e-commerce, avec le framework de Magento.<br>
Je m’occupe aussi de mettre en place des environnements de test à l’aide de Docker et Gitlab-ci.<br>
Il m’arrive aussi d’améliorer une application interne avec Vue.js et PHP (développement Front-end et Back-end).
</p>
</div>
</div>
<div class="experience">
<div class="title">
<div class="period">Septembre 2018 - Novembre 2018 :</div>
<div class="entreprise">Alternant développeur Full stack à Azerrisk Advantage</div>
</div>
<div class="description">
<p>
Mon but était de développer les différentes applications de la société à l’aide Node.js pour le back-end et Angular 1 pour le Front-end.
J’ai malheureusement du arréter mon contrat car je n’avais pas de tuteur.
</p>
</div>
</div>
<div class="experience">
<div class="title">
<div class="period">Avril 2018 - Août 2018 :</div>
<div class="entreprise">Stagiaire développeur Wordpress à BeeMedias</div>
</div>
<div class="description">
<p>
Je m’occupais d’implémenter de nouveaux modules aux différents site de l’entreprise, ainsi que d’intégrer les maquettes graphiques en HTML5 et CSS3.
</p>
</div>
</div>
</div>
</section>
<section class="school-section">
<h3>Parcours scolaire</h3>
<div class="content">
<div class="school">
<div class="period">Septembre 2019 - Juillet 2021 :</div>
<div class="description">Master Développement web à l’ECV Digital</div>
</div>
<div class="school">
<div class="period">Septembre 2018 - Septembre 2019 :</div>
<div class="description">3eme année Bachelor Concepteur et développeur de solutions digitales</div>
</div>
<div class="school">
<div class="period">Septembre 2016 - Juillet 2018 :</div>
<div class="description">DUT Métiers du Multimédia et de l’Internet à l’IUT de Champs sur Marne</div>
</div>
</div>
</section>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment