diff --git a/cursus.html b/cursus.html index 34c8d83..766b4a6 100644 --- a/cursus.html +++ b/cursus.html @@ -1,60 +1,68 @@ - + + - - - - Corentin - + -

Lycée

-

Montluçon

-

Lycée madame de Staël

- montluçon + +

CURSUS SCOLAIRE

+
+
+
+

2023 ➡️ aujourd'hui

+

Iut Aubière

+ aubière +
+
+
+
+

2020 ➡️ 2023

+

Lycée LEM

+ LEM +
+
+
+
+

2016 ➡️ 2020

+

Collège George-Sand

+ huriel +
+
+
+ + -

Maintenant

-

Aubière

- aubière - - \ No newline at end of file diff --git a/form.php b/form.php index 687f1e6..d710f70 100644 --- a/form.php +++ b/form.php @@ -29,7 +29,7 @@

- +

diff --git a/images.html b/images.html index 0eae3be..045db51 100644 --- a/images.html +++ b/images.html @@ -1,67 +1,77 @@ - + + - - - - Corentin - - - + + + + Corentin + + + + +

Galerie d'Images

- + diff --git a/planning.html b/planning.html index a0d0fca..896c920 100644 --- a/planning.html +++ b/planning.html @@ -19,9 +19,6 @@
  • Form
  • - - -

    PLANNING

    diff --git a/style.css b/style.css index 5eba5a4..fa93b80 100644 --- a/style.css +++ b/style.css @@ -34,7 +34,7 @@ body { color: #f1f1f1; } -h1, h2, h3 { +h1, h2:not(.exclude), h3:not(.exclude) { color: #ffffff; } @@ -273,3 +273,148 @@ figcaption { text-align: center; margin-top: 20px; } + + +/********************************************************************************/ +/* Css for the timeline (general) */ + +#titre_cursus { + text-align: center; + margin-top: 20px; +} + +* { + box-sizing: border-box; + } + + /* Set a background color */ + body { + background-color: #474e5d; + font-family: Helvetica, sans-serif; + } + + /* The actual timeline (the vertical ruler) */ + .timeline { + position: relative; + max-width: 1200px; + margin: 0 auto; + } + + /* The actual timeline (the vertical ruler) */ + .timeline::after { + content: ''; + position: absolute; + width: 6px; + background-color: white; + top: 0; + bottom: 0; + left: 50%; + margin-left: -3px; + } + + /* Container around content */ + .container { + padding: 10px 40px; + position: relative; + background-color: inherit; + width: 50%; + } + + /* The circles on the timeline */ + .container::after { + content: ''; + position: absolute; + width: 25px; + height: 25px; + right: -17px; + background-color: white; + border: 4px solid #FF9F55; + top: 15px; + border-radius: 50%; + z-index: 1; + } + + /* Place the container to the left */ + .left { + left: 0; + } + + /* Place the container to the right */ + .right { + left: 50%; + } + + /* Add arrows to the left container (pointing right) */ + .left::before { + content: " "; + height: 0; + position: absolute; + top: 22px; + width: 0; + z-index: 1; + right: 30px; + border: medium solid white; + border-width: 10px 0 10px 10px; + border-color: transparent transparent transparent white; + } + + /* Add arrows to the right container (pointing left) */ + .right::before { + content: " "; + height: 0; + position: absolute; + top: 22px; + width: 0; + z-index: 1; + left: 30px; + border: medium solid white; + border-width: 10px 10px 10px 0; + border-color: transparent white transparent transparent; + } + + /* Fix the circle for containers on the right side */ + .right::after { + left: -16px; + } + + /* The actual content */ + .content { + padding: 20px 30px; + background-color: white; + position: relative; + border-radius: 6px; + color: #333; + } + + /* Media queries - Responsive timeline on screens less than 600px wide */ + @media screen and (max-width: 600px) { + /* Place the timelime to the left */ + .timeline::after { + left: 31px; + } + + /* Full-width containers */ + .container { + width: 100%; + padding-left: 70px; + padding-right: 25px; + } + + /* Make sure that all arrows are pointing leftwards */ + .container::before { + left: 60px; + border: medium solid white; + border-width: 10px 10px 10px 0; + border-color: transparent white transparent transparent; + } + + /* Make sure all circles are at the same spot */ + .left::after, .right::after { + left: 15px; + } + + /* Make all right containers behave like the left ones */ + .right { + left: 0%; + } + } \ No newline at end of file diff --git a/videos.html b/videos.html index 1fc6e69..71ff45d 100644 --- a/videos.html +++ b/videos.html @@ -1,97 +1,137 @@ - + + - - - - Corentin - - - -

    Galerie Video

    + + + + Corentin + + + +

    Galerie Video

    - - +
    Planning d'activités