Date: Wed, 10 Jul 2024 22:31:36 +0200 Subject: proto: added a picture and fixed the layout a bit --- img/PI.jpg | Bin 0 -> 191389 bytes img/PI.png | Bin 0 -> 308235 bytes index.html | 33 ++++++++++++++++++++----------- style.css | 66 ++++++++++++++++++++++++++++++++++++++++++++++++++----------- 4 files changed, 76 insertions(+), 23 deletions(-) create mode 100644 img/PI.jpg create mode 100644 img/PI.png diff --git a/img/PI.jpg b/img/PI.jpg new file mode 100644 index 0000000..02fa02e Binary files /dev/null and b/img/PI.jpg differ diff --git a/img/PI.png b/img/PI.png new file mode 100644 index 0000000..6d8a593 Binary files /dev/null and b/img/PI.png differ diff --git a/index.html b/index.html index bbd286c..0a20d02 100644 --- a/index.html +++ b/index.html @@ -8,18 +8,29 @@ -

Martial Simon

Qui ça ?

Féru d'informatique, je suis étudiant en classe préparatoire à 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 du modélisme, de la musique (guitare -et basse) et du sport (escalade, cyclisme). 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 actif actuellement d’un groupe de musique (voir le site du groupe).

Martial Simon

+ +

Qui donc ?

Féru d'informatique, je suis étudiant en classe préparatoire à 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 du modélisme, de la musique (guitare + et basse) et du sport (escalade, cyclisme). 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 actif actuellement d’un groupe de musique (voir le site du groupe).

Formation

Mon parcours

2020

diff --git a/style.css b/style.css index aeabbea..721617f 100644 --- a/style.css +++ b/style.css @@ -1,19 +1,45 @@ body { background: linear-gradient(74deg, skyblue, pink 60%, salmon); - padding: 0 10vh + padding: 0 12vw; +} + +header { + display: flex; + justify-content: space-evenly; + align-content: baseline; } h1::before, h1::after { content: " - "; } -/*h2::before, h2::after { - content: " ~ "; -}*/ -h2 { +section h2 { font-style: italic; } +a { + color: black; + text-decoration: none; +} + +nav { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-evenly; + position: relative; + padding: default 3vw; + height: 100%; +} + +nav a, nav test { + display: inline-block; +} + +nav test { + margin: auto 0; +} + .text-link::after { content: '<'; } @@ -22,21 +48,35 @@ h2 { content: '>'; } -section p { - max-width: 500px; +section>span>p { + padding-left: 30vw; } @media screen and (max-width: 600px) { - section p { - max-width: 90vw; + body { + padding: 10px 5vw; + } + + section>span>p { + padding-left: 10vw; } } section:nth-of-type(odd) { - justify-items: end; text-align: end; } +section#presentation { + display: flex; + flex-direction: row-reverse; + justify-content: end; + height: 50vh; +} + +#id-pic { + height: auto; +} + h1, h2 { transition-property: text-decoration; transition-duration: 0.7s; @@ -55,10 +95,12 @@ h1:hover,h2:hover { #timeline::before { position: absolute; content: ''; - width: 5px; + width: 4px; height: 100%; - background: skyblue; + background: #add8e6; left: 14px; + border: 1px solid grey; + box-shadow: 1px 1px 1px #696969; border-radius: 3px; } -- cgit v1.2.3