diff --git a/CV Armand.pdf b/CV Armand.pdf
new file mode 100644
index 0000000000000000000000000000000000000000..93b2c69f2a6deefa5429d750c20ea8924e8094eb
Binary files /dev/null and b/CV Armand.pdf differ
diff --git a/css/stylesheet.css b/css/stylesheet.css
new file mode 100644
index 0000000000000000000000000000000000000000..bb5670f5351a18cee245c721bf3e9dbfbc489497
--- /dev/null
+++ b/css/stylesheet.css
@@ -0,0 +1,526 @@
+:root {
+ --icon-size: 3vw;
+ --profile-pic-size: 6vw;
+ --color1: rgb(0, 8, 20);
+ --color2: rgb(0, 29, 61);
+ --color3: rgb(0, 53, 102);
+ --color4: rgb(255, 195, 0);
+ --color5: rgb(255, 214, 10);
+ --colorH1: #000814;
+ --colorH2: #001D3D;
+ --colorH3: #003566;
+ --colorH4: #FFC300;
+ --colorH5: #FFD60A;
+ --nbRow: 2;
+ --bg: #1a1e24;
+ --color: #eee;
+}
+
+/* ----------------------------------------------
+ * Generated by Animista on 2023-12-1 22:3:9
+ * Licensed under FreeBSD License.
+ * See http://animista.net/license for more info.
+ * w: http://animista.net, t: @cssanimista
+ * ---------------------------------------------- */
+
+/**
+ * ----------------------------------------
+ * animation scale-in-center
+ * ----------------------------------------
+ */
+ @-webkit-keyframes scale-in-center {
+ 0% {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ opacity: 1;
+ }
+ }
+ @keyframes scale-in-center {
+ 0% {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ opacity: 1;
+ }
+ 100% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ opacity: 1;
+ }
+ }
+
+
+ .scale-in-center {
+ -webkit-animation: scale-in-center 0.5s ease-in-out both;
+ animation: scale-in-center 0.5s ease-in-out both;
+ }
+
+ @import url('https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400&display=swap');
+ .design-section {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 100vh;
+}
+
+html body {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ text-align: center;
+}
+#count {
+ z-index: 9999;
+ position: fixed;
+ top: 0;
+ right: 5px;
+ display: none;
+}
+
+#icon {
+ width:var(--profile-pic-size);
+ border-radius: 10rem;
+ cursor: pointer;
+}
+#nav {
+ display: flex;
+ justify-content: space-evenly;
+ align-items: center;
+ position: fixed;
+ top: 0;
+ width: 100%;
+ image-rendering:optimizeSpeed;
+ background-size:cover;
+ background: rgba(0, 29, 61, 0.8);
+ z-index: 999;
+ padding: 3vw;
+ transition: padding 1s;
+ max-height: 10rem;
+ font-size: 1vw;
+}
+
+#nav-phone {
+ display: none;
+}
+
+nav > a {
+ color: black;
+ text-decoration: none;
+ text-transform: uppercase;
+}
+
+#pres > p {
+ color: black;
+}
+
+#home-section, #portfolio-section, #contact-section {
+ width: 100%;
+}
+.spacer {
+ height: 30vh;
+}
+
+.corps {
+ margin: 0 20vw;
+
+}
+
+.section {
+ padding-top: 20vh;
+ height: fit-content;
+}
+
+#pres {
+ text-align: center;
+}
+
+#cv-and-portfolio {
+ display: flex;
+ justify-content:center;
+ align-items: center;
+ width: 100%;
+ height: 10vh;
+ background: var(--color3);
+ background-size: cover;
+}
+
+#cv-and-portfolio > div {
+ cursor: pointer;
+ margin: 0 10vw;
+ width: 50%;
+ height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+#cv, #portfolio {
+ color: white;
+}
+
+#contact-section {
+ display: flex;
+ justify-content:space-around;
+ height: 10vh;
+}
+
+#contact-section > div {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 1vw;
+
+}
+
+#contact-section > div > img {
+ width: var(--icon-size);
+ height: var(--icon-size);
+ cursor: pointer;
+ margin-right: 1vh;
+ margin-bottom: 0;
+}
+
+.timeline-content > img {
+ width: calc(var(--icon-size)*3);
+ margin-bottom: 0;
+}
+
+.ag-courses-item_date-box > img {
+ width: calc(var(--icon-size)*0.5);
+ filter: invert();
+ margin-bottom: 0;
+}
+
+#linkedin {
+ cursor: pointer;
+}
+
+body {
+ background-color: rgba(50, 50, 50, 1);
+ background-size: cover;
+ background-position: 0 10%;
+ color: rgb(255, 255, 255);
+ letter-spacing: 0.06rem;
+ height: 100%;
+ width: 100%;
+}
+
+main {
+ background: var(--color1);
+ font-size: 1.2vmax;
+}
+
+#email-image, #tel-image, #linkedin-image {
+ filter: invert();
+}
+
+#projets {
+ display: flex;
+ flex-direction: column;
+ margin: 0 10%;
+}
+
+#portfolio-section {
+ height: calc(var(--nbRow)*3*10rem);
+}
+
+.projet {
+ display : inherit;
+ flex-direction: row;
+ margin-bottom: 2rem;
+ height:fit-content;
+ text-align: left;
+ align-items: center;
+ border-color: var(--color3);
+ border-radius: 28px;
+ border-style: solid;
+ justify-content: space-between;
+}
+
+.projet:nth-child(even) {
+ border-color: var(--color2);
+ height: calc(var(--nbRow)*15rem);
+ display: grid;
+ grid-gap: 10px;
+ grid-template-columns: repeat(3, 1fr);
+ grid-template-rows: repeat(var(--nbRow), 1fr);
+}
+
+.projet:nth-child(odd) {
+ padding: 1rem 0 1rem 10%;
+}
+#logo-crous, #logo-correspondance, #logo-jo {
+ filter: invert();
+ padding-right: 1rem;
+ height: var(--icon-size);
+ width: var(--icon-size);
+}
+.dropdown {
+ filter: invert();
+ width: var(--icon-size);
+ height: var(--icon-size);
+ padding: 1vh 3vw;
+}
+.dropdown:hover {
+ cursor: pointer;
+}
+
+.projet > div {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+}
+
+.content > div {
+ display: flex;
+ padding: 0 0 0 0;
+ justify-content: center;
+ align-items: center;
+}
+
+.content > * {
+ text-align: center;
+}
+
+.desc {
+ grid-column: 2;
+ grid-row: 1;
+ padding: 1rem;
+}
+
+
+.langue1 {
+ grid-column: 1;
+ grid-row: 2;
+}
+
+.langue2 {
+ display: flex;
+ justify-self: center;
+ grid-column: 2;
+ grid-row: 2;
+}
+
+.langue2 > p >img {
+ height: var(--icon-size);
+ width: var(--icon-size);
+}
+
+.langue3 {
+ grid-column: 3;
+ grid-row: 2;
+}
+
+i {
+ color: var(--color5);
+ font-style: normal;
+}
+
+
+* {
+ font-family: Arial, Helvetica, sans-serif;
+ scroll-behavior:smooth;
+}
+
+/*
+* STYLE COMPETENCES
+*/
+.ag-format-container {
+ width: 1142px;
+ margin: 0 auto;
+}
+.ag-courses_box {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-align: start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+
+ padding: 50px 0;
+ }
+ .ag-courses_item {
+ -ms-flex-preferred-size: calc(33.33333% - 30px);
+ flex-basis: calc(33.33333% - 30px);
+
+ margin: 0 15px 30px;
+
+ overflow: hidden;
+
+ border-radius: 28px;
+ }
+ .ag-courses-item_link {
+ display: block;
+ padding: 30px 20px;
+ border-color: var(--color2);
+ border-style: solid ;
+ border-radius: 28px;
+
+ overflow: hidden;
+
+ position: relative;
+ }
+ .ag-courses-item_link:hover,
+ .ag-courses-item_link:hover .ag-courses-item_date {
+ text-decoration: none;
+ color: #FFF;
+ }
+ .ag-courses-item_link:hover .ag-courses-item_bg {
+ -webkit-transform: scale(10);
+ -ms-transform: scale(10);
+ transform: scale(10);
+ }
+ .ag-courses-item_title {
+ min-height: 87px;
+
+ overflow: hidden;
+
+ font-weight: bold;
+ font-size: 30px;
+ color: #FFF;
+
+ z-index: 2;
+ position: relative;
+ }
+ .ag-courses-item_date-box {
+ font-size: 18px;
+ color: #FFF;
+
+ z-index: 2;
+ position: relative;
+ }
+ .ag-courses-item_date-box > span {
+ line-height: 3vh;
+ }
+ .ag-courses-item_date {
+ font-weight: bold;
+ color: var(--color5);
+
+ -webkit-transition: color .5s ease;
+ -o-transition: color .5s ease;
+ transition: color .5s ease
+ }
+ .ag-courses-item_bg {
+ height: 128px;
+ width: 128px;
+ background-color: var(--color2);
+ z-index: 1;
+ position: absolute;
+ top: -75px;
+ right: -75px;
+
+ border-radius: 50%;
+
+ -webkit-transition: all .5s ease;
+ -o-transition: all .5s ease;
+ transition: all .5s ease;
+ }
+
+
+
+ @media only screen and (max-width: 979px) {
+ .ag-courses_item {
+ -ms-flex-preferred-size: calc(50% - 30px);
+ flex-basis: calc(50% - 30px);
+ }
+ .ag-courses-item_title {
+ font-size: 24px;
+ }
+ }
+
+ @media only screen and (max-width: 767px) {
+ .ag-format-container {
+ width: 96%;
+ }
+
+ }
+ @media only screen and (max-width: 639px) {
+ .ag-courses_item {
+ -ms-flex-preferred-size: 100%;
+ flex-basis: 100%;
+ }
+ .ag-courses-item_title {
+ min-height: 72px;
+ line-height: 1;
+
+ font-size: 24px;
+ }
+ .ag-courses-item_link {
+ padding: 22px 40px;
+ text-decoration: none;
+ }
+ .ag-courses-item_date-box {
+ font-size: 16px;
+ }
+ }
+
+/*
+* STYLE FORMATION
+*/
+
+.design {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.timeline {
+ width: 80%;
+ height: auto;
+ max-width: 500vw;
+ margin: 0 auto;
+ display: flex;
+ flex-direction: column;
+}
+
+.timeline-content {
+ padding: 20px;
+ border-color: var(--color3);
+ border-style: solid;
+ color: white;
+ padding: 1.75rem;
+ transition: 0.4s ease;
+ overflow-wrap: break-word !important;
+ margin: 1rem;
+ margin-bottom: 20px;
+ border-radius: 6px;
+}
+
+.timeline-component {
+ margin: 0px 20px 20px 20px;
+ border-radius: 28px;
+}
+
+@media screen and (min-width: 768px) {
+ .timeline {
+ display: grid;
+ grid-template-columns: 1fr 3px 1fr;
+ }
+ .timeline-middle {
+ position: relative;
+ background-image: linear-gradient(145deg, #FFA500,var(--colorH5), var(--colorH4));
+ width: 3px;
+ height: 100%;
+ }
+ .main-middle {
+ opacity: 0;
+ }
+ .timeline-circle {
+ position: absolute;
+ top: 0;
+ left: 50%;
+ width: 15px;
+ height: 15px;
+ border-radius: 50%;
+ background-image: linear-gradient(10deg, #FFA500, var(--colorH5), var(--colorH4));
+ -webkit-transform: translateX(-50%);
+ transform: translateX(-50%);
+ }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b3d757d7ffabc1be58d2a3763c1e5284c790e814
--- /dev/null
+++ b/index.html
@@ -0,0 +1,313 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="css/stylesheet.css">
+ <script src="js/test.js"></script>
+ <title>Portfolio Armand SADY</title>
+</head>
+<main>
+ <div id="count">
+ <p> SCORE </p>
+ <p id="countValue">1</p>
+ </div>
+ <header>
+ <nav id="nav" onscroll="navshrink()">
+ <img id="icon" src="res/IMONTOME.jpg" alt="logo" onclick="zoom('icon')">
+ <a id="home" class="navLink" href="#home-section"> accueil </a>
+ <a id="formation" class="navLink" href="#formation-section"> Formations </a>
+ <a id="competences" class="navLink" href="#competences-section"> Compétences </a>
+ <a id="experiences" class="navLink" href="#experiences-section"> Expériences </a>
+ <a id="portfolios" class="navLink" href="#portfolio-section"> Portfolio </a>
+ <a id="contact" class="navLink" href="#contact-section"> Contact </a>
+ </nav>
+ <nav id="nav-phone">
+ <img src="https://cdn-icons-png.flaticon.com/512/3388/3388823.png" alt="" id="hamburger">
+ <div id="options" style="visibility: hidden;">
+ <a id="home" class="navLink" href="#home-section"> à propos </a>
+ <a id="portfolio" class="navLink" href="#portfolio-section"> Portfolio </a>
+ </div>
+ </nav>
+ </header>
+ <body>
+ <div class="spacer"></div>
+ <div id="home-section" class="section">
+ <h1> Accueil </h1>
+ <div class="intro" class="corps">
+ <p> Actuellement en <i>2eme année de BUT Informatique a l'université de Lille</i> ; <br> voici mon CV:</p>
+ </div>
+ <div id="cv-and-portfolio">
+ <div id="cv" onmouseenter="textFadeIn('cv', 0.5), underline('cv', true)" onmouseleave="textFadeOut('cv', 0.5), underline('cv', false)" onclick="window.location='CV Armand.pdf';">
+ <p>CV</p>
+ </div>
+ </div>
+ <div id="intro2" class="corps">
+ <p>
+ <i>Passioné d'informatique</i> et des jeux videos depuis l'enfance, je me suis enfin orienté vers l'informatique au lycée avec l'option SI en seconde, et plus profondément avec l'option NSI et ensuite la formation du BUT Informatique de Lille. <br>
+ Je compte m'<i>orienter vers le développement logiciel</i>, et je suis <i>a la recherche d'une alternance pour la rentrée 2023</i>. <br>
+ J'aimerais continuer ma formation après le BUT afin d'<i>obtenir un Master</i>. <br>
+ </p>
+ </div>
+ </div>
+ <div id="formation-section" class="section">
+ <h1> Formations </h1>
+ <section class="design-section">
+ <div class="timeline">
+ <div class="timeline-empty"></div>
+ <div class="timeline-middle">
+ <div class="timeline-circle"></div>
+ </div>
+ <div class="timeline-component timeline-content">
+ <img src="./res/univ-lille.png" alt="">
+ <p style="font-size: 3vh;">BUT Informatique</p>
+ <p style="font-size: 2vh;">2022 - Maintenant</p>
+ </div>
+ <div class="timeline-component timeline-content">
+ <img src="./res/queneau.png" alt="">
+ <p style="font-size: 3vh;">BAC Général <br> NSI - MATH</p>
+ <p style="font-size: 2vh;">2019 - 2022</p>
+ </div>
+ <div class="timeline-middle">
+ <div class="timeline-circle"></div>
+ </div>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div id="competences-section" class="section">
+ <h1> Competences </h1>
+ <div class="ag-format-container">
+ <div class="ag-courses_box">
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+ <div class="ag-courses-item_title">
+ <i>Languages de Programmation</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://cdn-icons-png.flaticon.com/512/2359/2359238.png" alt="">
+ <span> <br>Java<br>
+ C<br>
+ Python<br>
+ JavaScript (bases)</span>
+ </div>
+ </div>
+ </div>
+
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+
+ <div class="ag-courses-item_title">
+ <i>Base de Données</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://uxwing.com/wp-content/themes/uxwing/download/web-app-development/database-icon.png" alt="">
+ <span> <br> SQL<br>
+ PostgreSQL</span>
+ </div>
+ </div>
+ </div>
+
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+
+ <div class="ag-courses-item_title">
+ <i>Développement Web</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://cdn-icons-png.flaticon.com/512/2282/2282272.png" alt="">
+ <span> <br>HTML <br>
+ CSS <br>
+ JavaScript (bases)</span>
+ </div>
+ </div>
+ </div>
+
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+
+ <div class="ag-courses-item_title">
+ <i>Langues</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://cdn-icons-png.flaticon.com/512/3269/3269817.png" alt="">
+ <span> <br>Anglais C1<br>
+ Allemand A2</span>
+ </div>
+ </div>
+ </div>
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+
+ <div class="ag-courses-item_title">
+ <i>Logiciels</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://cdn-icons-png.flaticon.com/512/152/152529.png" alt="">
+ <span><br> Visual Studio Code<br>
+ IntelliJ IDEA<br>
+ Suite Microsoft Office </span>
+ </div>
+ </div>
+ </div>
+
+ <div class="ag-courses_item">
+ <div href="#" class="ag-courses-item_link">
+ <div class="ag-courses-item_bg"></div>
+
+ <div class="ag-courses-item_title">
+ <i>Outils</i>
+ </div>
+ <div class="ag-courses-item_date-box">
+ <img src="https://cdn-icons-png.flaticon.com/512/152/152529.png" alt="">
+ <span><br> Bash <br>
+ Git <br>
+ Markdown</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id="experiences-section" class="section">
+ <h1> Experiences </h1>
+ <section class="design-section">
+ <div class="timeline">
+ <div class="timeline-component timeline-content">
+ <img style="filter: brightness(100);" src="https://flatchr-production.imgix.net/GjqBwprQKy9ArDl4.png?w=1200&h=630&background=white" alt="">
+ <p style="font-size: 3vh;">Presence Groupe Topo</p>
+ <p style="font-size: 2vh;"> Correcteur d'enquêtes de satisfaction</p>
+ <p style="font-size: 2vh;"> <i>Été 2023 - Maintenant<br> Été 2022</i></p>
+ </div>
+
+ <div class="timeline-middle">
+
+ <div class="timeline-circle"></div>
+ </div>
+ <div class="timeline-empty"></div>
+ <div></div>
+ <div class="timeline-middle">
+ <div class="timeline-circle"></div>
+ </div>
+ <div class="timeline-component timeline-content">
+ <img src="https://www.afvt.org/wp-content/uploads/2017/05/logo-1.png" alt="">
+ <p style="font-size: 3vh;">Ministère de la Justice <br> Stage de Découverte <br></p>
+ <p style="font-size: 2vh;"> Découverte des Systèmes dInformation et de Communication</p>
+ <p style="font-size: 2vh;"> <i>Hiver 2019</i></p>
+ </div>
+ </div>
+ </div>
+ </section>
+ </div>
+ <div id="portfolio-section" class="section">
+ <h1>Portfolio</h1>
+ <div id="intro-portfolio">
+ <p>Au cours de ma formation, j'ai eu l'occasion de réaliser des projets, tels que:</p>
+ </div>
+ <div id="projets">
+ <div id="crous" class="projet">
+ <div>
+ <img src="https://static.thenounproject.com/png/900146-200.png" alt="AS" id="logo-crous">
+ <p><i>Les AS du CROUS</i></p>
+ </div>
+ <img src="https://static.thenounproject.com/png/1123247-200.png" alt="" id="dropdown-crous" class="dropdown" onclick="boopCrous()">
+ </div>
+ <div id="crous-wrapper" class="projet content scale-in-center" style="display: none;">
+ <div class="desc">
+ <p>Les AS du CROUS est un projet de <i> 3 jours </i> ayant comme but de nous faire apprendre la <i>méthodologie agile SCRUM</i> dans un contexte acceléré (sprints de 1h30) <br> Le jeu video est <i>entièrement jouable<br>depuis un terminal shell</i></p>
+ </div>
+ <div>
+ <p> Septembre 2023 </p>
+ </div>
+ <div>
+ <p> IUT Informatique - Villeneuve d'Ascq</p>
+ </div>
+ <div class="langue1">
+ <p> Compétences apprises: <br> <i>Méthodologie agile <br> SCRUM <br> Travail d'équipe</i>
+ </p>
+ </div>
+ <div class="langue2">
+ <p><img src="./res/JAVA.png" alt="JAVA"><br><a style="color: orange;" href="https://gitlab.univ-lille.fr/2023-projet-agile-de-rentree/groupe-19">Lien vers le dépôt</a></p>
+ </div>
+ <div class="langue3">
+ <p> Groupe de <i>5 étudiants</i> </p>
+ </div>
+ </div>
+ <div id="correspondance" class="projet">
+ <div>
+ <img src="https://cdn-icons-png.flaticon.com/512/826/826019.png" alt="VOYAGE" id="logo-correspondance">
+ <p><i>Affectation de binôme d'élève pour voyage scolaire international</i></p>
+ </div>
+ <img src="https://static.thenounproject.com/png/1123247-200.png" alt="" id="dropdown-correspondance" class="dropdown" onclick="boopCorrespondance()">
+ </div >
+ <div id="correspondance-wrapper" class="projet content scale-in-center" style="display: none;">
+ <div>
+ <p> Mai 2023 - Juillet 2023 </p>
+ </div>
+ <div>
+ <p> Application comportant une interface graphique <i>JavaFX</i>, faite dans le contexte du BUT Informatique, permet d'associer une liste d'élève de 2 pays différents celon leurs caractèristiques, affinités, allergies, etc...</p>
+ </div>
+ <div>
+ <p> IUT Informatique - Villeneuve d'Ascq</p>
+ </div>
+ <div class="langue1">
+ <p> Compétences apprises: <br> <i>JavaFX <br> Algo de Dijkstra <br> UML complexe <br> </i>
+ </p>
+ </div>
+ <div class="langue2">
+ <p><img src="./res/JAVA.png" alt="">& JavaFx<br><a style="color: orange;" href="https://gitlab.univ-lille.fr/sae2.01-2.02/2023/D2">Lien vers le dépôt</a></p>
+ </div>
+ <div class="langue3">
+ <p> Groupe de <i>3 étudiants</i> <br> </p>
+ </div>
+ </div>
+ <div id="jo" class="projet">
+ <div>
+ <img src="https://static.thenounproject.com/png/1870751-200.png" alt="JO" id="logo-jo">
+ <p><i>Jeux Olympiques Analyse statistique</i></p>
+ </div>
+ <img src="https://static.thenounproject.com/png/1123247-200.png" alt="" id="dropdown-jo" class="dropdown" onclick="boopJO()">
+ </div>
+ <div id="jo-wrapper" class="projet content scale-in-center" style="display: none;">
+ <div>
+ <p> Mars 2023 - Mai 2023 </p>
+ </div>
+ <div>
+ <p> Durant ce projet, nous avons eu une base de donnée sur les jeux olympiques, et nous avons analyser cette base de donnée a travers le SQL <br> Le rendu est un PDF d'<i>analyse statistique</i> trouvées via la base de donnée, et un rendu des commandes PSQL effectuées afin d'obtenir les informations</p>
+ </div>
+ <div>
+ <p> IUT Informatique - Villeneuve d'Ascq</p>
+ </div>
+ <div class="langue1">
+ <p> Compétences apprises: <br> <i>PostgreSQL <br> Statistiques <br> Markdown <br> </i>
+ </div>
+ <div class="langue2">
+ <p><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Postgresql_elephant.svg/640px-Postgresql_elephant.svg.png" alt=""><br><a style="color: orange;" href="https://gitlab.univ-lille.fr/raphael.kiecken.etu/s2.04">Lien vers le dépôt</a></p>
+ </div>
+ <div class="langue3">
+ <p> Groupe de <i>2 étudiants</i> <br> </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div id="contact-section" class="section">
+ <div id="tel" class="contact" onmouseenter="imageRotation('tel-image', true)" onmouseleave="imageRotation('tel-image', false)">
+ <img id="tel-image" src="https://cdn-icons-png.flaticon.com/512/725/725624.png" alt="icone tel">
+ <p> (+33) 7 82 92 60 87 </p>
+ </div>
+ <div id="email" class="contact" onmouseenter="imageRotation('email-image', true)" onmouseleave="imageRotation('email-image', false)">
+ <img id="email-image"src="https://cdn-icons-png.flaticon.com/512/3178/3178158.png" alt="icone email ">
+ <p> armand.sady.etu@univ-lille.fr</p>
+ </div>
+ <div id="linkedin" class="contact" onclick="window.location='https://www.linkedin.com/in/armand-sady-368992274/';" onmouseenter="underline('linkedin-text', true), imageRotation('linkedin-image', true)" onmouseleave="underline('linkedin-text', false), imageRotation('linkedin-image', false)">
+ <img id="linkedin-image" src="https://static-00.iconduck.com/assets.00/linkedin-with-circle-icon-512x512-cvyrro5n.png" alt="linkedinImage">
+ <p id="linkedin-text"> Linkedin </p>
+ </div>
+ </div>
+ </body>
+ </main>
+</html>
\ No newline at end of file
diff --git a/js/hamburger.js b/js/hamburger.js
new file mode 100644
index 0000000000000000000000000000000000000000..daa94c101ecccf7b9b1c30ee7658a0c023400c96
--- /dev/null
+++ b/js/hamburger.js
@@ -0,0 +1,10 @@
+let nav = document.getElementById("nav-phone");
+let icon = document.getElementById("hamburger");
+let options = document.getElementsByClassName("options");
+
+function showNavOptions() {
+ nav.style.maxHeight = "100vh";
+ nav.style.transition = "all 0.5s";
+ icon.style.display = "none";
+ return;
+}
\ No newline at end of file
diff --git a/js/test.js b/js/test.js
new file mode 100644
index 0000000000000000000000000000000000000000..7e26d0ef3dad5ac6b895c18bf395bb1a130e5024
--- /dev/null
+++ b/js/test.js
@@ -0,0 +1,231 @@
+window.onscroll = function() { scrollFunction() };
+window.onload = function() {
+ navTextFadeIn()
+};
+let count = 1;
+let transitionTimeNav = 0.5;
+let currentlyOppened = 0;
+
+function countDown() {
+ let currentVal = document.getElementById("cdb").textContent;
+ let newVal = currentVal - 1;
+ document.getElementById("cdb").textContent = newVal;
+ return;
+
+}
+
+function imageRotation(String, bool) {
+ let home = document.getElementById(String);
+ if (bool) {
+ home.style.transform = "rotate(360deg)";
+ home.style.transition = "transform 1s";
+
+ } else {
+ home.style.transform = "rotate(0deg)";
+ home.style.transition = "transform 1s";
+ return;
+ }
+}
+
+function scrollFunction() {
+ let nav = document.getElementById("nav");
+ if (document.body.scrollTop > 90 || document.documentElement.scrollTop > 90) { // Quand on n'est plus en haut de la page
+ nav.style.maxHeight = "3rem";
+ iconDezoom();
+ } else { // Quand on est en haut de la page
+ nav.style.maxHeight = "10rem";
+ iconZoom();
+ }
+ nav.style.transition = "all "+transitionTimeNav+"s";
+ return;
+}
+
+function iconDezoom() {
+ let icon = document.getElementById("icon");
+ icon.style.maxHeight = "4rem";
+ icon.style.maxWidth = "4rem";
+ icon.style.transition = "all "+transitionTimeNav+"s";
+}
+
+function iconZoom() {
+ let icon = document.getElementById("icon");
+ icon.style.maxHeight = "6rem";
+ icon.style.maxWidth = "6rem";
+ icon.style.transition = "all "+transitionTimeNav+"s";
+
+}
+
+function zoom(String) {
+ count++;
+ revealCount(true);
+ if (count == 2) {
+ setTimeout(function(){resetScore()}, 5000);
+ } if (count == 1) {
+ revealCount(false);
+ }
+ let image = document.getElementById(String);
+ image.style.transform = "scale("+count * count+")";
+ image.style.transition = "transform 0.2s ease";
+ countValue.textContent = count-1;
+ return;
+}
+
+function resetScore() {
+ count = 0;
+ let image = document.getElementById(String);
+ image.style.transform = "scale("+count * count+")";
+ image.style.transition = "transform 0.2s ease";
+ countValue.textContent = count;
+ return;
+}
+
+function revealCount(bool) {
+ let countDiv = document.getElementById("count");
+ if (bool) {
+ countDiv.style.display = 'block';
+ } else {
+ countDiv.style.display = 'none';
+ }
+ return;
+}
+
+function navTextFadeIn() {
+ let nav = document.getElementById("nav");
+ for (let i = 0; i < nav.children.length; i++) {
+ nav.children[i].style.color = "rgb(242, 233, 228)";
+ nav.children[i].style.transition = "color 2s";
+ if (nav.children[i].getAttribute("class") == "navLink") {
+ nav.children[i].setAttribute("onmouseenter", 'underline(\''+nav.children[i].getAttribute("id")+'\', true)');
+ nav.children[i].setAttribute("onmouseleave", 'underline(\''+nav.children[i].getAttribute("id")+'\', false)');
+ } else if (nav.children[i].getAttribute("class") == "navLinkContainer") {
+ for (let j = 0; j < nav.children[i].children.length; j++) {
+ nav.children[i].children[j].setAttribute("onmouseenter", 'underline(\''+nav.children[i].children[j].getAttribute("id")+'\', true)');
+ nav.children[i].children[j].setAttribute("onmouseleave", 'underline(\''+nav.children[i].children[j].getAttribute("id")+'\', false)');
+ }
+ }
+ }
+ return;
+}
+
+function textFadeIn(String, int) {
+ let text = document.getElementById(String);
+ text.style.color = "rgb(255, 195, 0)";
+ text.style.transition = "color "+int+"s";
+ return;
+}
+
+function textFadeOut(String, int) {
+ let text = document.getElementById(String);
+ text.style.color = "white";
+ text.style.transition = "color "+int+"s";
+ return;
+}
+
+function underline(String, bool) {
+ let text = document.getElementById(String);
+ if (bool) {
+ text.style.textDecorationLine = "underline";
+ } else {
+ text.style.textDecorationLine = "none";
+ }
+ return;
+}
+
+function boopCrous() {
+ currentlyOppened = 1;
+ manageOpened();
+ let element = document.getElementById("dropdown-crous");
+ let toShow = document.getElementById("crous-wrapper");
+ if (toShow.style.display != "none") {
+ toShow.style.display = "none";
+ toShow.style.transition = "all 0.5s";
+ } else {
+ toShow.style.display = "grid";
+ var position = toShow.getBoundingClientRect();
+ var absoluteElementTop = position.top + window.scrollY;
+ var middle = absoluteElementTop - (window.innerHeight / 2);
+ window.scrollTo(0, middle);
+ }
+ element.style.scale = "1.5";
+ element.style.transition = "scale 0.2s";
+ sleep(200).then(() => {
+ element.style.scale = "1";
+ element.style.transition = "scale 0.2s";
+ });
+ return;
+}
+
+function boopCorrespondance() {
+ currentlyOppened = 2;
+ manageOpened();
+ let element = document.getElementById("dropdown-correspondance");
+ let toShow = document.getElementById("correspondance-wrapper");
+ if (toShow.style.display != "none") {
+ toShow.style.display = "none";
+ toShow.style.transition = "all 0.5s";
+ } else {
+ toShow.style.display = "grid";
+ var position = toShow.getBoundingClientRect();
+ var absoluteElementTop = position.top + window.scrollY;
+ var middle = absoluteElementTop - (window.innerHeight / 2);
+ window.scrollTo(0, middle);
+ }
+ element.style.scale = "1.5";
+ element.style.transition = "scale 0.2s";
+ sleep(200).then(() => {
+ element.style.scale = "1";
+ element.style.transition = "scale 0.2s";
+ });
+ return;
+}
+
+function boopJO() {
+ currentlyOppened = 3;
+ manageOpened();
+ let element = document.getElementById("dropdown-jo");
+ let toShow = document.getElementById("jo-wrapper");
+ if (toShow.style.display != "none") {
+ toShow.style.display = "none";
+ toShow.style.transition = "all 0.5s";
+ } else {
+ toShow.style.display = "grid";
+ var position = toShow.getBoundingClientRect();
+ var absoluteElementTop = position.top + window.scrollY;
+ var middle = absoluteElementTop - (window.innerHeight / 2);
+ window.scrollTo(0, middle);
+ }
+ element.style.scale = "1.5";
+ element.style.transition = "scale 0.2s";
+ sleep(200).then(() => {
+ element.style.scale = "1";
+ element.style.transition = "scale 0.2s";
+ });
+ return;
+}
+
+function manageOpened() {
+ let crous = document.getElementById("crous-wrapper");
+ let correspondance = document.getElementById("correspondance-wrapper");
+ let jo = document.getElementById("jo-wrapper");
+ if (currentlyOppened == 1) {
+ correspondance.style.display = "none";
+ correspondance.style.transition = "all 0.5s";
+ jo.style.display = "none";
+ jo.style.transition = "all 0.5s";
+ } else if (currentlyOppened == 2) {
+ crous.style.display = "none";
+ crous.style.transition = "all 0.5s";
+ jo.style.display = "none";
+ jo.style.transition = "all 0.5s";
+ } else if (currentlyOppened == 3) {
+ crous.style.display = "none";
+ crous.style.transition = "all 0.5s";
+ correspondance.style.display = "none";
+ correspondance.style.transition = "all 0.5s";
+ }
+ return;
+}
+
+function sleep(ms) {
+ return new Promise(resolve => setTimeout(resolve, ms));
+}
\ No newline at end of file
diff --git a/res/IMONTOME.jpg b/res/IMONTOME.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..5314530df9c29fbae7ea434f773dc65c237adb3a
Binary files /dev/null and b/res/IMONTOME.jpg differ
diff --git a/res/JAVA.png b/res/JAVA.png
new file mode 100644
index 0000000000000000000000000000000000000000..b9425ad0f45127dc73c502ac326fb9b9b587fede
Binary files /dev/null and b/res/JAVA.png differ
diff --git a/res/JAVAFX.png b/res/JAVAFX.png
new file mode 100644
index 0000000000000000000000000000000000000000..cdee2f803dcfa21a4cc3a246817047defba775aa
Binary files /dev/null and b/res/JAVAFX.png differ
diff --git a/res/JetBrainMono/JetBrainsMono-Italic-VariableFont_wght.ttf b/res/JetBrainMono/JetBrainsMono-Italic-VariableFont_wght.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..914e323363b726d5d976f42e6c0dcec76e2bcfa0
Binary files /dev/null and b/res/JetBrainMono/JetBrainsMono-Italic-VariableFont_wght.ttf differ
diff --git a/res/JetBrainMono/JetBrainsMono-VariableFont_wght.ttf b/res/JetBrainMono/JetBrainsMono-VariableFont_wght.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..d73994ad49dfa5a2e528f47927a86afaeb1cf54e
Binary files /dev/null and b/res/JetBrainMono/JetBrainsMono-VariableFont_wght.ttf differ
diff --git a/res/JetBrainMono/OFL.txt b/res/JetBrainMono/OFL.txt
new file mode 100644
index 0000000000000000000000000000000000000000..0d0d19ae96c008a18102fa66f5c50d0134bb5b76
--- /dev/null
+++ b/res/JetBrainMono/OFL.txt
@@ -0,0 +1,93 @@
+Copyright 2020 The JetBrains Mono Project Authors (https://github.com/JetBrains/JetBrainsMono)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/res/JetBrainMono/README.txt b/res/JetBrainMono/README.txt
new file mode 100644
index 0000000000000000000000000000000000000000..0a8510da611b27aa8a69dec2f84cc0564d90fbd1
--- /dev/null
+++ b/res/JetBrainMono/README.txt
@@ -0,0 +1,79 @@
+JetBrains Mono Variable Font
+============================
+
+This download contains JetBrains Mono as both variable fonts and static fonts.
+
+JetBrains Mono is a variable font with this axis:
+ wght
+
+This means all the styles are contained in these files:
+ JetBrainsMono-VariableFont_wght.ttf
+ JetBrainsMono-Italic-VariableFont_wght.ttf
+
+If your app fully supports variable fonts, you can now pick intermediate styles
+that aren’t available as static fonts. Not all apps support variable fonts, and
+in those cases you can use the static font files for JetBrains Mono:
+ static/JetBrainsMono-Thin.ttf
+ static/JetBrainsMono-ExtraLight.ttf
+ static/JetBrainsMono-Light.ttf
+ static/JetBrainsMono-Regular.ttf
+ static/JetBrainsMono-Medium.ttf
+ static/JetBrainsMono-SemiBold.ttf
+ static/JetBrainsMono-Bold.ttf
+ static/JetBrainsMono-ExtraBold.ttf
+ static/JetBrainsMono-ThinItalic.ttf
+ static/JetBrainsMono-ExtraLightItalic.ttf
+ static/JetBrainsMono-LightItalic.ttf
+ static/JetBrainsMono-Italic.ttf
+ static/JetBrainsMono-MediumItalic.ttf
+ static/JetBrainsMono-SemiBoldItalic.ttf
+ static/JetBrainsMono-BoldItalic.ttf
+ static/JetBrainsMono-ExtraBoldItalic.ttf
+
+Get started
+-----------
+
+1. Install the font files you want to use
+
+2. Use your app's font picker to view the font family and all the
+available styles
+
+Learn more about variable fonts
+-------------------------------
+
+ https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts
+ https://variablefonts.typenetwork.com
+ https://medium.com/variable-fonts
+
+In desktop apps
+
+ https://theblog.adobe.com/can-variable-fonts-illustrator-cc
+ https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts
+
+Online
+
+ https://developers.google.com/fonts/docs/getting_started
+ https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide
+ https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts
+
+Installing fonts
+
+ MacOS: https://support.apple.com/en-us/HT201749
+ Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux
+ Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows
+
+Android Apps
+
+ https://developers.google.com/fonts/docs/android
+ https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts
+
+License
+-------
+Please read the full license text (OFL.txt) to understand the permissions,
+restrictions and requirements for usage, redistribution, and modification.
+
+You can use them in your products & projects – print or digital,
+commercial or otherwise.
+
+This isn't legal advice, please consider consulting a lawyer and see the full
+license for all details.
diff --git a/res/JetBrainMono/static/JetBrainsMono-Bold.ttf b/res/JetBrainMono/static/JetBrainsMono-Bold.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..b7484374e77f6f89862a234bd2b4b81177f1162e
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Bold.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-BoldItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-BoldItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..0091142300ae4661541c63d93cc4cc4d8ba1ce42
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-BoldItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-ExtraBold.ttf b/res/JetBrainMono/static/JetBrainsMono-ExtraBold.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..88eab2f7baf23fc7112c693636588cdcccc28729
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-ExtraBold.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-ExtraBoldItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-ExtraBoldItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..85e67db4032df81bbb1152b578ad189a0be88142
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-ExtraBoldItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-ExtraLight.ttf b/res/JetBrainMono/static/JetBrainsMono-ExtraLight.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..1f737144314873748cf27d47699460888215a50d
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-ExtraLight.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-ExtraLightItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-ExtraLightItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..745b58eeaaf00b327eed345f96080bf42b84cbb0
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-ExtraLightItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-Italic.ttf b/res/JetBrainMono/static/JetBrainsMono-Italic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..5b484dd61071dab3f81bd9648c4cc8effe9ea90d
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Italic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-Light.ttf b/res/JetBrainMono/static/JetBrainsMono-Light.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..296186f1db3d9d076134e5ee5e50e3aa4058e4b5
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Light.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-LightItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-LightItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..399ede744022d8b0a2f2b6d1794fb007b90276e5
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-LightItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-Medium.ttf b/res/JetBrainMono/static/JetBrainsMono-Medium.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..ad31fbd7f064cabb5dc7330d59abfe66a0dce39e
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Medium.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-MediumItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-MediumItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..4f499f281db443a2a61610f06b862e9d2023e8b4
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-MediumItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-Regular.ttf b/res/JetBrainMono/static/JetBrainsMono-Regular.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..02bc07ea088e3cbf370cb21e884319f74a62b0ba
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Regular.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-SemiBold.ttf b/res/JetBrainMono/static/JetBrainsMono-SemiBold.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..c3adfd3151f691df37cfbda3bdfda5b37b1c78f0
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-SemiBold.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-SemiBoldItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-SemiBoldItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..62d58add4754ddbabd81ba5936c97595259845f0
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-SemiBoldItalic.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-Thin.ttf b/res/JetBrainMono/static/JetBrainsMono-Thin.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..6a6a556f10c77c7b2651a802a97d3153d641d19d
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-Thin.ttf differ
diff --git a/res/JetBrainMono/static/JetBrainsMono-ThinItalic.ttf b/res/JetBrainMono/static/JetBrainsMono-ThinItalic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..33a23d7ca8434efd94dac65e24d339cdd44faae8
Binary files /dev/null and b/res/JetBrainMono/static/JetBrainsMono-ThinItalic.ttf differ
diff --git a/res/POSTGRESQL.png b/res/POSTGRESQL.png
new file mode 100644
index 0000000000000000000000000000000000000000..da105cc65b992b6cdbf84d2713930aa3e18496af
Binary files /dev/null and b/res/POSTGRESQL.png differ
diff --git a/res/ace-of-spades.png b/res/ace-of-spades.png
new file mode 100644
index 0000000000000000000000000000000000000000..245c04197058c1b95cdaedf2b9d6a25e1415dee7
Binary files /dev/null and b/res/ace-of-spades.png differ
diff --git a/res/choikbar.JPG b/res/choikbar.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..4e4bdfba19126b5a6ed89759a7eaccc12a3b1c45
Binary files /dev/null and b/res/choikbar.JPG differ
diff --git a/res/queneau.png b/res/queneau.png
new file mode 100644
index 0000000000000000000000000000000000000000..e8d96cc1260f8d7e587540f79dd104740a5137ef
Binary files /dev/null and b/res/queneau.png differ
diff --git a/res/univ-lille.png b/res/univ-lille.png
new file mode 100644
index 0000000000000000000000000000000000000000..0122fd227b7aa27dc04c244b82b5f009ff71d9a3
Binary files /dev/null and b/res/univ-lille.png differ