diff options
| author | Martial Simon <msimon_fr@hotmail.com> | 2024-12-25 11:41:54 +0100 |
|---|---|---|
| committer | Martial Simon <msimon_fr@hotmail.com> | 2024-12-25 11:41:54 +0100 |
| commit | 549908224395a73ae2be8a7b98bcb7c0b57a3944 (patch) | |
| tree | a03067f6f2c4a4fffe236410d912a0eb4885df5d | |
| parent | cc515e6d6105f8de9bfc66889cb1640e68fd8aed (diff) | |
fix: header & typos
| -rw-r--r-- | index.html | 14 | ||||
| -rw-r--r-- | style.css | 26 |
2 files changed, 25 insertions, 15 deletions
@@ -1,4 +1,6 @@ -<!-- !TODO: Trouver des icônes-->
+<!-- !TODO : nav links on hr-->
+<!-- !TODO : colorscheme-->
+<!-- !TODO : reverse timeline-->
<!DOCTYPE html>
<head>
<title>Martial Simon</title>
@@ -11,23 +13,21 @@ <header>
<h1><a href="#">Martial Simon</a></h1>
<nav>
- <sep> </sep>
<a href="#skills"><h2>Compétences</h2></a>
- <sep> </sep>
+ <sep><h3>-</h3></sep>
<a href="#contact"><h2>Contact</h2></a>
- <sep> </sep>
</nav>
</header>
<div id="content">
<section id="presentation">
<div>
<h2>Qui donc ?</h2>
- <p>Féru d'informatique, je suis étudiant en classe préparatoire à l’Ecole Pour l’Informatique et les
+ <p>Féru d'informatique, je suis étudiant en cycle ingénieur à l’Ecole Pour l’Informatique et les
Techniques Avancées (EPITA) à Lyon. Consciencieux et travailleur, je me sers de ces compétences
pour mes études mais aussi dans mes loisirs que sont la pratique de la musique (guitare
et basse) et du sport (escalade, cyclisme).<br>J’aime également le travail en équipe comme j’ai pu
l’expérimenter dès le lycée avec un projet collaboratif de ballon sonde stratosphérique, puis au cours de projets de groupe au sein de mes études supérieures (réalisation d'un jeu vidéo et logiciel d'OCR), ou encore en étant
- membre d’un groupe de musique (voir le <a class="text-link" style="color: #400080" href="lesrunninggags.marcellus.cc">site du groupe</a>).<br>Fort de plusieurs expériences internationales, je communique aisément en anglais et suis capable de comprendre assez globalement l'allemand.</p>
+ membre d’un groupe de musique (voir le <a class="text-link" style="color: #400080" href="https://lesrunninggags.marcellus.cc">site du groupe</a>).<br>Fort de plusieurs expériences internationales, je communique aisément en anglais et suis capable de comprendre assez globalement l'allemand.</p>
</div>
<img id="id-pic" src="img/PI.png" alt="photo de moi">
</section>
@@ -203,7 +203,7 @@ <h3>Écoutes (toujours pas exhaustives) :</h3>
<p>Mon éducation musicale s'est faîte à partir des classiques du rock et des standards de jazz: d'un côté Pink Floyd, Led Zeppelin et les solos de guitare lunaires, de l'autre Dave Brubeck, John Coltrane et Jaco Pastorius.</p>
<p>Ces 2 directions sont bien distinctes mais souvent guidées par mon parcours de musicien: en apprenant la guitare basse, j'ai immédiatement préféré le jazz et ses voisins funk et soul, inspiré par Jaco Pastorius, Marcus Miller, Victor Wooten, et Joe Dart dans le groupe Vulfpeck. Autrement, après des années de guitare, je me suis orienté vers des influences découlant du rock, m'essayant au metal et à ses variations, puis en découvrant le punk à travers le <u>Journal</u> de Kurt Cobain.</p>
- <h4>Vous reprendrez bien une recommendation ?</h4>
+ <h4>Vous reprendrez bien une recommandation ?</h4>
<p>Ou peut-être plus d'une : Commencez avec un album des Beatles, si vous voulez de l'énergie, écoutez <u>Lover Boy</u> de Supertramp. Puis, si ça vous a donné envie de tout casser, je vous conseille <u>Hertz</u> d'Amyl and The Sniffers, ou bien si vous voulez seulement bouger, partez sur <u>1612</u> de Vulfpeck. Pour des situations plus spécifiques, référez vous à <a href="img/music flowchart.svg" alt="flowchart" class="text-link" style="color:#9370db" target="_blank">ce diagramme</a>.</p>
<div class="citation">
<p>"Je veux que toutes les filles du monde prennent une guitare et se mettent à crier"</p>
@@ -20,18 +20,25 @@ header { position: sticky;
top: 5px;
z-index: 10;
+ transition-property: top;
}
-h1, h2, h3, h4 {
- font-family: martian;
+header {
+ filter: drop-shadow(white 2px 2px 0px);
}
header {
display: flex;
+ flex-wrap: wrap;
justify-content: space-evenly;
align-items: center;
}
+h1, h2, h3, h4 {
+ font-family: martian;
+}
+
+
h1::before, h1::after {
content: " - ";
}
@@ -48,19 +55,22 @@ a { nav {
display: flex;
flex-direction: row;
- flex-wrap: wrap;
- justify-content: space-between;
+ flex-wrap: nowrap;
+ justify-content: center;
+ align-content: space-between;
position: relative;
- padding: default 3vw;
height: 100%;
}
-nav a, nav sep {
+nav a {
display: inline-block;
+ margin: auto 3%;
}
-nav sep {
- margin: auto 0;
+sep {
+ display: inline-block;
+ font-weight: bold;
+ margin: auto 3%;
}
.text-link:hover {
|