Browse Source

Mise en place du PHP

Jovian (Darkside) 6 years ago
parent
commit
5c2be13b3f
16 changed files with 377 additions and 863 deletions
  1. 8 0
      .idea/php.xml
  2. 0 107
      contact.html
  3. 42 0
      contact.php
  4. 4 68
      cv.html
  5. 0 101
      error404.html
  6. 34 0
      error404.php
  7. 73 0
      header.php
  8. 0 109
      index.html
  9. 41 0
      index.php
  10. 8 75
      projects.html
  11. 9 69
      projets/pro_ascii_space.html
  12. 0 132
      projets/pro_pulsar.html
  13. 74 0
      projets/pro_pulsar.php
  14. 0 133
      projets/pro_quoridor.html
  15. 75 0
      projets/pro_quoridor.php
  16. 9 69
      projets/pro_static_site.html

+ 8 - 0
.idea/php.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="PhpIncludePathManager">
+    <include_path>
+      <path value="" />
+    </include_path>
+  </component>
+</project>

+ 0 - 107
contact.html

@@ -1,107 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="css/bootstrap.css" rel="stylesheet">
-    <link href="css/custom/main.css" rel="stylesheet">
-
-    <title>Contact - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav" aria-controls="joviaNav"
-          aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png" alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="projects.html" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="projets/pro_static_site.html">
-                        Jovian Website
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_ascii_space.html">
-                        ASCII Space Destroyer
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_pulsar.html">
-                        Pulsar
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_quoridor.html">
-                        Quoridor
-                    </a>
-                </div>
-            </li>
-            <li class="nav-item active">
-                <div class="nav-link">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </div>
-            </li>
-        </ul>
-    </div>
-</nav>
-
-<!-- Content -->
-<main role="main" class="container">
-
-    <div class="focus-center">
-        <h1>Contact</h1>
-        <img src="https://img.icons8.com/color/96/000000/filled-message.png" alt="home flat icon">
-        <h2>Retrouvez ici différents moyens pour me contacter</h2>
-        <p class="lead">Pour l'instant par Linkedin, bientôt avec une adresse mail personnalisée.</p>
-    </div>
-
-    <h3>
-    	<img src="https://img.icons8.com/color/48/000000/linkedin.png" alt="V">
-    	Linkedin
-    </h3>
-    <p>Lien vers <a href="http://www.linkedin.com/in/jovian-hersemeule-232855150">mon profil Linkedin</a>.
-    <p>Vous retrouverez sur Linkedin le détail de mon parcours scolaire et de mes expériences professionnelles.</p>
-    <p>N'hésitez pas également à l'utiliser pour m'envoyer un message.</p>
-
-</main>
-
-<!-- Footer -->
-<footer class="footer fixed-bottom bg-dark mt-5">
-    <div class="container">
-        <span class="text-muted">Images sources : ICON8</span>
-        <a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
-        <a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
-        <a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
-    </div>
-</footer>
-
-<!-- Scripts -->
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="js/bootstrap.js"></script>
-</body>
-</html>

+ 42 - 0
contact.php

@@ -0,0 +1,42 @@
+<?php
+$title = "Contact";
+include("header.php");
+?>
+
+<!-- Content -->
+<main role="main" class="container">
+
+    <div class="focus-center">
+        <h1>Contact</h1>
+        <img src="https://img.icons8.com/color/96/000000/filled-message.png" alt="home flat icon">
+        <h2>Retrouvez ici différents moyens pour me contacter</h2>
+        <p class="lead">Pour l'instant par Linkedin, bientôt avec une adresse mail personnalisée.</p>
+    </div>
+
+    <h3>
+    	<img src="https://img.icons8.com/color/48/000000/linkedin.png" alt="V">
+    	Linkedin
+    </h3>
+    <p>Lien vers <a href="http://www.linkedin.com/in/jovian-hersemeule-232855150">mon profil Linkedin</a>.
+    <p>Vous retrouverez sur Linkedin le détail de mon parcours scolaire et de mes expériences professionnelles.</p>
+    <p>N'hésitez pas également à l'utiliser pour m'envoyer un message.</p>
+
+</main>
+
+<!-- Footer -->
+<footer class="footer fixed-bottom bg-dark mt-5">
+    <div class="container">
+        <span class="text-muted">Images sources : ICON8</span>
+        <a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
+        <a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
+        <a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
+    </div>
+</footer>
+
+<!-- Scripts -->
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+<script src="js/bootstrap.js"></script>
+</body>
+</html>

+ 4 - 68
cv.html

@@ -1,71 +1,7 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="css/bootstrap.css" rel="stylesheet">
-    <link href="css/custom/main.css" rel="stylesheet">
-
-    <title>CV - Jovian Hersemeule</title>
-</head>
-<body>
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav" aria-controls="joviaNav"
-          aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png" alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item active">
-                <div class="nav-link">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </div>
-            </li>
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="projects.html" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="projets/pro_static_site.html">
-                        Jovian Website
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_ascii_space.html">
-                        ASCII Space Destroyer
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_pulsar.html">
-                        Pulsar
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_quoridor.html">
-                        Quoridor
-                    </a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
+<?php
+$title = "CV";
+include("header.php");
+?>
 
 
 <main role="main" class="container">
 <main role="main" class="container">
     <div class="focus-center">
     <div class="focus-center">

+ 0 - 101
error404.html

@@ -1,101 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="css/bootstrap.css" rel="stylesheet">
-    <link href="css/custom/main.css" rel="stylesheet">
-
-    <title>404 - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
-         aria-controls="joviaNav"
-         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
-         alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="projects.html" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="projets/pro_static_site.html">
-                        Jovian Website
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_ascii_space.html">
-                        ASCII Space Destroyer
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_pulsar.html">
-                        Pulsar
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_quoridor.html">
-                        Quoridor
-                    </a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
-
-<!-- Content -->
-<main role="main" class="container">
-
-    <div class="focus-center">
-        <h1>404</h1>
-        <img src="https://img.icons8.com/color/96/000000/matrix-desktop.png" alt="home flat icon">
-        <h2>Page non trouvée</h2>
-        <p class="lead">La page à laquelle votre navigateur souhaite accéder n'existe pas. Il est possible que j'ai fait
-            une erreur lors du développement de mon site. N'hésitez pas à revenir plus tard ...</p>
-    </div>
-</main>
-
-<!-- Footer -->
-<footer class="footer fixed-bottom bg-dark mt-5">
-    <div class="container">
-        <span class="text-muted">Images sources : ICON8</span>
-        <a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
-        <a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
-        <a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
-    </div>
-</footer>
-
-<!-- Scripts -->
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="js/bootstrap.js"></script>
-</body>
-</html>

+ 34 - 0
error404.php

@@ -0,0 +1,34 @@
+<?php
+$title = "404";
+include("header.php");
+?>
+
+<!-- Content -->
+<main role="main" class="container">
+
+    <div class="focus-center">
+        <h1>404</h1>
+        <img src="https://img.icons8.com/color/96/000000/matrix-desktop.png" alt="home flat icon">
+        <h2>Page non trouvée</h2>
+        <p class="lead">La page à laquelle votre navigateur souhaite accéder n'existe pas. Il est possible que j'ai fait
+            une erreur lors du développement de mon site. N'hésitez pas à revenir plus tard ...</p>
+    </div>
+</main>
+
+<!-- Footer -->
+<footer class="footer fixed-bottom bg-dark mt-5">
+    <div class="container">
+        <span class="text-muted">Images sources : ICON8</span>
+        <a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
+        <a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
+        <a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
+    </div>
+</footer>
+
+<!-- Scripts -->
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+<script src="js/bootstrap.js"></script>
+</body>
+</html>

+ 73 - 0
header.php

@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Page description -->
+    <meta name="description" content="The official website of Jovian Hersemeule.">
+    <meta name="author" content="Jovian Hersemeule">
+    <meta property="og:image" content="images/home_picture_v1.jpg">
+
+    <!-- Style sheet -->
+    <link href="/css/bootstrap.css" rel="stylesheet">
+    <link href="/css/custom/main.css" rel="stylesheet">
+    <link href="/css/custom/pagination.css" rel="stylesheet">
+
+    <title><?php echo $title;?> - Jovian Hersemeule</title>
+</head>
+<body>
+
+<!-- Navbar -->
+<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
+    <a class="navbar-brand" href="index.php">Jovian Hersemeule</a>
+    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
+         aria-controls="joviaNav"
+         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
+         alt="V">
+    <div class="collapse navbar-collapse" id="joviaNav">
+        <ul class="navbar-nav mr-auto">
+            <li class="nav-item <?php if ($title == "Accueil") echo "active";?>">
+                <a class="nav-link" href="index.php">
+                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
+                    Accueil
+                </a>
+            </li>
+            <li class="nav-item <?php if ($title == "CV") echo "active";?>">
+                <a class="nav-link" href="cv.php">
+                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
+                    CV
+                </a>
+            </li>
+            <li class="nav-item dropdown <?php if ($title == "Projets") echo "active";?>">
+                <a class="nav-link dropdown-toggle" href="projects.php" id="dropdown01" data-toggle="dropdown"
+                   aria-haspopup="true" aria-expanded="false">
+                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
+                    Projets
+                </a>
+                <div class="dropdown-menu" aria-labelledby="dropdown01">
+                    <a class="dropdown-item <?php if ($title == "Projets") echo "active";?>" href="projects.php">Liste des projets</a>
+                    <div class="dropdown-divider"></div>
+                    <a class="dropdown-item <?php if ($title == "Site") echo "active";?>" href="projets/pro_static_site.php">
+                        Jovian Website
+                    </a>
+                    <a class="dropdown-item <?php if ($title == "ASCII") echo "active";?>" href="projets/pro_ascii_space.php">
+                        ASCII Space Destroyer
+                    </a>
+                    <a class="dropdown-item <?php if ($title == "Pulsar") echo "active";?>" href="projets/pro_pulsar.php">
+                        Pulsar
+                    </a>
+                    <a class="dropdown-item <?php if ($title == "Quoridor") echo "active";?>" href="projets/pro_quoridor.php">
+                        Quoridor
+                    </a>
+                </div>
+            </li>
+            <li class="nav-item <?php if ($title == "Contact") echo "active";?>">
+                <a class="nav-link" href="contact.php">
+                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
+                    Contact
+                </a>
+            </li>
+        </ul>
+    </div>
+</nav>

+ 0 - 109
index.html

@@ -1,109 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-    <meta property="og:image" content="images/home_picture_v1.jpg">
-
-    <!-- Style sheet -->
-    <link href="css/bootstrap.css" rel="stylesheet">
-    <link href="css/custom/main.css" rel="stylesheet">
-
-    <title>Home - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
-         aria-controls="joviaNav"
-         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
-         alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item active">
-                <div class="nav-link">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="projects.html" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="projets/pro_static_site.html">
-                        Jovian Website
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_ascii_space.html">
-                        ASCII Space Destroyer
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_pulsar.html">
-                        Pulsar
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_quoridor.html">
-                        Quoridor
-                    </a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
-
-<!-- Content -->
-<main role="main" class="container">
-
-    <div class="focus-center">
-        <h1>Jovian Hersemeule</h1>
-        <img src="https://img.icons8.com/color/96/000000/city.png" alt="home flat icon">
-        <h2>Bienvenue sur mon site internet. :-)</h2>
-        <p class="lead">Vous trouverez ici les principales informations me concernant : qui je suis, mon parcours, mon
-            expérience professionnelle et mes projets de programmation.<br>Bonne visite !</p>
-    </div>
-    <img class="rounded img-fluid mx-auto d-block" src="images/home_picture_v1.jpg" alt="Photo d'accueil"
-         usemap="#homemap">
-
-    <!-- Map image parts to site naviagtion -->
-    <map class="d-none d-sm-block" name="homemap">
-        <area shape="rect" coords="120,12,412,306" alt="CV" href="cv.html">
-        <area shape="rect" coords="494,592,944,880" alt="Projets" href="projects.html">
-        <area shape="rect" coords="0,564,194,708" alt="Contact" href="contact.html">
-    </map>
-
-</main>
-
-<!-- Footer -->
-<footer class="footer bg-dark mt-5">
-    <div class="container">
-        <span class="text-muted">Version 2.01+dev - mis en ligne le 24 janvier 2019 par Jovian Hersemeule</span>
-    </div>
-</footer>
-
-<!-- Scripts -->
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="js/bootstrap.js"></script>
-</body>
-</html>

+ 41 - 0
index.php

@@ -0,0 +1,41 @@
+<?php
+$title = "Accueil";
+include("header.php");
+?>
+
+<!-- Content -->
+<main role="main" class="container">
+
+    <div class="focus-center">
+        <h1>Jovian Hersemeule</h1>
+        <img src="https://img.icons8.com/color/96/000000/city.png" alt="home flat icon">
+        <h2>Bienvenue sur mon site internet. :-)</h2>
+        <p class="lead">Vous trouverez ici les principales informations me concernant : qui je suis, mon parcours, mon
+            expérience professionnelle et mes projets de programmation.<br>Bonne visite !</p>
+    </div>
+    <img class="rounded img-fluid mx-auto d-block" src="images/home_picture_v1.jpg" alt="Photo d'accueil"
+         usemap="#homemap">
+
+    <!-- Map image parts to site naviagtion -->
+    <map class="d-none d-sm-block" name="homemap">
+        <area shape="rect" coords="120,12,412,306" alt="CV" href="cv.php">
+        <area shape="rect" coords="494,592,944,880" alt="Projets" href="projects.php">
+        <area shape="rect" coords="0,564,194,708" alt="Contact" href="contact.php">
+    </map>
+
+</main>
+
+<!-- Footer -->
+<footer class="footer bg-dark mt-5">
+    <div class="container">
+        <span class="text-muted">Version dev - mis en ligne le 24 janvier 2019 par Jovian Hersemeule</span>
+    </div>
+</footer>
+
+<!-- Scripts -->
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+<script src="js/bootstrap.js"></script>
+</body>
+</html>

+ 8 - 75
projects.html

@@ -1,74 +1,7 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="css/bootstrap.css" rel="stylesheet">
-    <link href="css/custom/main.css" rel="stylesheet">
-
-    <title>Projets - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
-         aria-controls="joviaNav"
-         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
-         alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item active dropdown">
-                <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <div class="dropdown-item active">Liste des projets</div>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="projets/pro_static_site.html">
-                        Jovian Website
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_ascii_space.html">
-                        ASCII Space Destroyer
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_pulsar.html">
-                        Pulsar
-                    </a>
-                    <a class="dropdown-item" href="projets/pro_quoridor.html">
-                        Quoridor
-                    </a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
+<?php
+$title = "Projets";
+include("header.php");
+?>
 
 
 <!-- Main -->
 <!-- Main -->
 <main role="main" class="container">
 <main role="main" class="container">
@@ -124,7 +57,7 @@
                 <p class="card-text">
                 <p class="card-text">
                     Mon site Internet : celui sur lequel vous naviguez actuellement.
                     Mon site Internet : celui sur lequel vous naviguez actuellement.
                 </p>
                 </p>
-                <a href="projets/pro_static_site.html" class="btn btn-success">
+                <a href="projets/pro_static_site.php" class="btn btn-success">
                     Voir la page du projet
                     Voir la page du projet
                 </a>
                 </a>
             </div>
             </div>
@@ -173,7 +106,7 @@
                     Un jeu de vaisseau spatial dessiné avec des caractères ASCII, où le joueur peut créer son propre
                     Un jeu de vaisseau spatial dessiné avec des caractères ASCII, où le joueur peut créer son propre
                     vaisseau.
                     vaisseau.
                 </p>
                 </p>
-                <a href="projets/pro_ascii_space.html" class="btn btn-success">
+                <a href="projets/pro_ascii_space.php" class="btn btn-success">
                     Voir la page du projet
                     Voir la page du projet
                 </a>
                 </a>
             </div>
             </div>
@@ -190,7 +123,7 @@
                     articielle.
                     articielle.
                 </p>
                 </p>
                 <div title="Développement en cours .. revenez plus tard !">
                 <div title="Développement en cours .. revenez plus tard !">
-                    <a href="projets/pro_quoridor.html" class="btn btn-success disabled">
+                    <a href="projets/pro_quoridor.php" class="btn btn-success disabled">
                         Voir la page du projet
                         Voir la page du projet
                     </a>
                     </a>
                 </div>
                 </div>
@@ -228,7 +161,7 @@
                     Un jeu de vaisseaux spatiaux, où chaque équipe tente de prendre l'ascendant dans un système solaire.
                     Un jeu de vaisseaux spatiaux, où chaque équipe tente de prendre l'ascendant dans un système solaire.
                 </p>
                 </p>
                 <div title="Développement en cours .. revenez plus tard !">
                 <div title="Développement en cours .. revenez plus tard !">
-                    <a href="projets/pro_pulsar.html" class="btn btn-success disabled">
+                    <a href="projets/pro_pulsar.php" class="btn btn-success disabled">
                         Voir la page du projet
                         Voir la page du projet
                     </a>
                     </a>
                 </div>
                 </div>

+ 9 - 69
projets/pro_ascii_space.html

@@ -1,67 +1,7 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="../css/bootstrap.css" rel="stylesheet">
-    <link href="../css/custom/main.css" rel="stylesheet">
-    <link href="../css/custom/pagination.css" rel="stylesheet">
-
-    <title>Projets - Mon Site - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="../index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
-         aria-controls="joviaNav"
-         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
-         alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="../index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item active dropdown">
-                <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="../projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <a class="dropdown-item" href="pro_static_site.html">Jovian Website</a>
-                    <div class="dropdown-item active">ASCII Space Destroyer</div>
-                    <a class="dropdown-item" href="pro_pulsar.html">Pulsar</a>
-                    <a class="dropdown-item" href="pro_quoridor.html">Quoridor</a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
+<?php
+$title = "ASCII";
+include("../header.php");
+?>
 
 
 <!-- Main -->
 <!-- Main -->
 <main role="main" class="container">
 <main role="main" class="container">
@@ -521,22 +461,22 @@
     <!-- Pagination -->
     <!-- Pagination -->
     <ul class="pagination pagination-lg justify-content-center">
     <ul class="pagination pagination-lg justify-content-center">
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link arrow" title="Page précédente" href="pro_static_site.html">&laquo</a>
+            <a class="page-link arrow" title="Page précédente" href="pro_static_site.php">&laquo</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="Site web de Jovian" href="pro_static_site.html">1</a>
+            <a class="page-link" title="Site web de Jovian" href="pro_static_site.php">1</a>
         </li>
         </li>
         <li class="page-item active">
         <li class="page-item active">
             <div class="page-link" title="ASCII Space destroyer">2</div>
             <div class="page-link" title="ASCII Space destroyer">2</div>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="Pulsar" href="pro_pulsar.html">3</a>
+            <a class="page-link" title="Pulsar" href="pro_pulsar.php">3</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="Quoridor" href="pro_quoridor.html">4</a>
+            <a class="page-link" title="Quoridor" href="pro_quoridor.php">4</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link arrow" title="Page suivante" href="pro_pulsar.html">&raquo</a>
+            <a class="page-link arrow" title="Page suivante" href="pro_pulsar.php">&raquo</a>
         </li>
         </li>
     </ul>
     </ul>
 </main>
 </main>

+ 0 - 132
projets/pro_pulsar.html

@@ -1,132 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="../css/bootstrap.css" rel="stylesheet">
-    <link href="../css/custom/main.css" rel="stylesheet">
-	<link href="../css/custom/pagination.css" rel="stylesheet">
-
-    <title>Projets - Mon Site - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="../index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav" aria-controls="joviaNav"
-          aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png" alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-	    <ul class="navbar-nav mr-auto">
-	        <li class="nav-item">
-	            <a class="nav-link" href="../index.html">
-	                <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-	                Accueil
-	            </a>
-	        </li>
-	        <li class="nav-item">
-	            <a class="nav-link" href="../cv.html">
-	                <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-	                CV
-	            </a>
-	        </li>
-	        <li class="nav-item active dropdown">
-	            <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown"
-	               aria-haspopup="true" aria-expanded="false">
-	                <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-	                Projets
-	            </a>
-	            <div class="dropdown-menu" aria-labelledby="dropdown01">
-	                <a class="dropdown-item" href="../projects.html">Liste des projets</a>
-	                <div class="dropdown-divider"></div>
-	                <a class="dropdown-item" href="pro_static_site.html">Jovian Website</a>
-	                <a class="dropdown-item" href="pro_ascii_space.html">ASCII Space Destroyer</a>
-	                <div class="dropdown-item active">Pulsar</div>
-	                <a class="dropdown-item" href="pro_quoridor.html">Quoridor</a>
-	            </div>
-	        </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-	    </ul>
-	</div>
-</nav>
-
-<!-- Main -->
-<main role="main" class="container">
-    <div class="focus-center">
-        <h1>
-            Pulsar
-        </h1>
-        <img src="https://img.icons8.com/color/96/000000/code.png" alt="code flat icon">
-        <h2>
-            Concept de jeu vidéo
-        </h2>
-        <p class="lead">
-            Pulsar est un grand projet qui est dans mon tiroir depuis 3 ans. Il est ambitieux mais reste réalisable. C'est un jeu vidéo dynamique et multijoueur, qui allie à la fois combat et récolte de ressources dans un monde spatial.
-        </p>
-    </div>
-
-	<!-- Travaux -->
-	<div class="alert alert-info">
-		<img class="float-left" src="https://img.icons8.com/color/90/000000/road-worker.png" alt="[Working]">
-		<p>
-			Mon site web est encore en <strong>développement</strong>. Cette section sera implémentée dans une
-			future version.
-		</p>
-		<p>
-			Repassez plus tard ...
-		</p>
-	</div>
-
-	<!-- Pagination -->
-	<ul class="pagination pagination-lg justify-content-center">
-		<li class="page-item">
-			<a class="page-link arrow" title="Page précédente" href="pro_ascii_space.html">&laquo</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="Site web de Jovian" href="pro_static_site.html">1</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.html">2</a>
-		</li>
-		<li class="page-item active">
-			<div class="page-link" title="Pulsar">3</div>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="Quoridor" href="pro_quoridor.html">4</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link arrow" title="Page suivante" href="pro_quoridor.html">&raquo</a>
-		</li>
-	</ul>
-</main>
-
-<!-- Footer -->
-<!-- todo : remove fixed-bottom as soon as content was filled -->
-<footer class="footer bg-dark mt-5 fixed-bottom">
-	<div class="container">
-		<span class="text-muted">Images sources : ICON8</span>
-		<a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
-		<a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
-		<a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
-	</div>
-</footer>
-
-<!-- Scripts -->
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="../js/bootstrap.js"></script>
-
-</body>
-</html>

+ 74 - 0
projets/pro_pulsar.php

@@ -0,0 +1,74 @@
+<?php
+$title = "Pulsar";
+include("../header.php");
+?>
+
+<!-- Main -->
+<main role="main" class="container">
+    <div class="focus-center">
+        <h1>
+            Pulsar
+        </h1>
+        <img src="https://img.icons8.com/color/96/000000/code.png" alt="code flat icon">
+        <h2>
+            Concept de jeu vidéo
+        </h2>
+        <p class="lead">
+            Pulsar est un grand projet qui est dans mon tiroir depuis 3 ans. Il est ambitieux mais reste réalisable. C'est un jeu vidéo dynamique et multijoueur, qui allie à la fois combat et récolte de ressources dans un monde spatial.
+        </p>
+    </div>
+
+	<!-- Travaux -->
+	<div class="alert alert-info">
+		<img class="float-left" src="https://img.icons8.com/color/90/000000/road-worker.png" alt="[Working]">
+		<p>
+			Mon site web est encore en <strong>développement</strong>. Cette section sera implémentée dans une
+			future version.
+		</p>
+		<p>
+			Repassez plus tard ...
+		</p>
+	</div>
+
+	<!-- Pagination -->
+	<ul class="pagination pagination-lg justify-content-center">
+		<li class="page-item">
+			<a class="page-link arrow" title="Page précédente" href="pro_ascii_space.php">&laquo</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="Site web de Jovian" href="pro_static_site.php">1</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.php">2</a>
+		</li>
+		<li class="page-item active">
+			<div class="page-link" title="Pulsar">3</div>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="Quoridor" href="pro_quoridor.php">4</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link arrow" title="Page suivante" href="pro_quoridor.php">&raquo</a>
+		</li>
+	</ul>
+</main>
+
+<!-- Footer -->
+<!-- todo : remove fixed-bottom as soon as content was filled -->
+<footer class="footer bg-dark mt-5 fixed-bottom">
+	<div class="container">
+		<span class="text-muted">Images sources : ICON8</span>
+		<a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
+		<a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
+		<a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
+	</div>
+</footer>
+
+<!-- Scripts -->
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+<script src="../js/bootstrap.js"></script>
+
+</body>
+</html>

+ 0 - 133
projets/pro_quoridor.html

@@ -1,133 +0,0 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="../css/bootstrap.css" rel="stylesheet">
-    <link href="../css/custom/main.css" rel="stylesheet">
-	<link href="../css/custom/pagination.css" rel="stylesheet">
-
-    <title>Projets - Mon Site - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="../index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav" aria-controls="joviaNav"
-          aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png" alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-	    <ul class="navbar-nav mr-auto">
-	        <li class="nav-item">
-	            <a class="nav-link" href="../index.html">
-	                <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-	                Accueil
-	            </a>
-	        </li>
-	        <li class="nav-item">
-	            <a class="nav-link" href="../cv.html">
-	                <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-	                CV
-	            </a>
-	        </li>
-	        <li class="nav-item active dropdown">
-	            <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown"
-	               aria-haspopup="true" aria-expanded="false">
-	                <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-	                Projets
-	            </a>
-	            <div class="dropdown-menu" aria-labelledby="dropdown01">
-	                <a class="dropdown-item" href="../projects.html">Liste des projets</a>
-	                <div class="dropdown-divider"></div>
-	                <a class="dropdown-item" href="pro_static_site.html">Jovian Website</a>
-	                <a class="dropdown-item" href="pro_ascii_space.html">ASCII Space Destroyer</a>
-	                <a class="dropdown-item" href="pro_pulsar.html">Pulsar</a>
-	                <div class="dropdown-item active">Quoridor</div>
-	            </div>
-	        </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-	    </ul>
-	</div>
-</nav>
-
-<!-- Main -->
-<main role="main" class="container">
-    <div class="focus-center">
-        <h1>
-            Quoridor
-        </h1>
-        <img src="https://img.icons8.com/color/96/000000/code.png" alt="code flat icon">
-        <h2>
-            TIPE 2017
-        </h2>
-        <p class="lead">
-            Développement d'intelligences artificielles pour le jeu de stratégie quoridor.
-            Ce projet est un travail de groupe réalisé sur l'ensemble de ma seconde année de prépa.
-        </p>
-    </div>
-
-	<!-- Travaux -->
-	<div class="alert alert-info">
-		<img class="float-left" src="https://img.icons8.com/color/90/000000/road-worker.png" alt="[Working]">
-		<p>
-			Mon site web est encore en <strong>développement</strong>. Cette section sera implémentée dans une
-			future version.
-		</p>
-		<p>
-			Repassez plus tard ...
-		</p>
-	</div>
-
-	<!-- Pagination -->
-	<ul class="pagination pagination-lg justify-content-center">
-		<li class="page-item">
-			<a class="page-link arrow" title="Page précédente" href="pro_pulsar.html">&laquo</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="Site web de Jovian" href="pro_static_site.html">1</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.html">2</a>
-		</li>
-		<li class="page-item">
-			<a class="page-link" title="Pulsar" href="pro_pulsar.html">3</a>
-		</li>
-		<li class="page-item active">
-			<div class="page-link" title="Quoridor">4</div>
-		</li>
-		<li class="page-item">
-			<a class="page-link arrow" title="Page suivante" href="../projects.html">&raquo</a>
-		</li>
-	</ul>
-</main>
-
-<!-- Footer -->
-<!-- todo : remove fixed-bottom as soon as content was filled -->
-<footer class="footer bg-dark mt-5 fixed-bottom">
-	<div class="container">
-		<span class="text-muted">Images sources : ICON8</span>
-		<a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
-		<a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
-		<a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
-	</div>
-</footer>
-
-<!-- Scripts -->
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="../js/bootstrap.js"></script>
-
-</body>
-</html>

+ 75 - 0
projets/pro_quoridor.php

@@ -0,0 +1,75 @@
+<?php
+$title = "Quoridor";
+include("../header.php");
+?>
+
+<!-- Main -->
+<main role="main" class="container">
+    <div class="focus-center">
+        <h1>
+            Quoridor
+        </h1>
+        <img src="https://img.icons8.com/color/96/000000/code.png" alt="code flat icon">
+        <h2>
+            TIPE 2017
+        </h2>
+        <p class="lead">
+            Développement d'intelligences artificielles pour le jeu de stratégie quoridor.
+            Ce projet est un travail de groupe réalisé sur l'ensemble de ma seconde année de prépa.
+        </p>
+    </div>
+
+	<!-- Travaux -->
+	<div class="alert alert-info">
+		<img class="float-left" src="https://img.icons8.com/color/90/000000/road-worker.png" alt="[Working]">
+		<p>
+			Mon site web est encore en <strong>développement</strong>. Cette section sera implémentée dans une
+			future version.
+		</p>
+		<p>
+			Repassez plus tard ...
+		</p>
+	</div>
+
+	<!-- Pagination -->
+	<ul class="pagination pagination-lg justify-content-center">
+		<li class="page-item">
+			<a class="page-link arrow" title="Page précédente" href="pro_pulsar.php">&laquo</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="Site web de Jovian" href="pro_static_site.php">1</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.php">2</a>
+		</li>
+		<li class="page-item">
+			<a class="page-link" title="Pulsar" href="pro_pulsar.php">3</a>
+		</li>
+		<li class="page-item active">
+			<div class="page-link" title="Quoridor">4</div>
+		</li>
+		<li class="page-item">
+			<a class="page-link arrow" title="Page suivante" href="../projects.php">&raquo</a>
+		</li>
+	</ul>
+</main>
+
+<!-- Footer -->
+<!-- todo : remove fixed-bottom as soon as content was filled -->
+<footer class="footer bg-dark mt-5 fixed-bottom">
+	<div class="container">
+		<span class="text-muted">Images sources : ICON8</span>
+		<a href="https://icons8.com/icon/104082/cv">CV icon by Icons8</a>
+		<a href="https://icons8.com/icon/104084/city">City icon by Icons8</a>
+		<a href="https://icons8.com/icon/19293/code">Code icon by Icons8</a>
+	</div>
+</footer>
+
+<!-- Scripts -->
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
+        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+        crossorigin="anonymous"></script>
+<script src="../js/bootstrap.js"></script>
+
+</body>
+</html>

+ 9 - 69
projets/pro_static_site.html

@@ -1,67 +1,7 @@
-<!DOCTYPE html>
-<html lang="fr">
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-
-    <!-- Page description -->
-    <meta name="description" content="The official website of Jovian Hersemeule.">
-    <meta name="author" content="Jovian Hersemeule">
-
-    <!-- Style sheet -->
-    <link href="../css/bootstrap.css" rel="stylesheet">
-    <link href="../css/custom/main.css" rel="stylesheet">
-    <link href="../css/custom/pagination.css" rel="stylesheet">
-
-    <title>Projets - Mon Site - Jovian Hersemeule</title>
-</head>
-<body>
-
-<!-- Navbar -->
-<nav class="navbar navbar-expand-md navbar-dark bg-success fixed-top">
-    <a class="navbar-brand" href="../index.html">Jovian Hersemeule</a>
-    <img class="rounded-circle jovian-toggler" type="button" data-toggle="collapse" data-target="#joviaNav"
-         aria-controls="joviaNav"
-         aria-expanded="false" aria-label="Dérouler le menu" src="https://img.icons8.com/color/48/000000/menu-2.png"
-         alt="V">
-    <div class="collapse navbar-collapse" id="joviaNav">
-        <ul class="navbar-nav mr-auto">
-            <li class="nav-item">
-                <a class="nav-link" href="../index.html">
-                    <img src="https://img.icons8.com/color/48/000000/city.png" alt="|">
-                    Accueil
-                </a>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../cv.html">
-                    <img src="https://img.icons8.com/color/48/000000/parse-from-clipboard.png" alt="|">
-                    CV
-                </a>
-            </li>
-            <li class="nav-item active dropdown">
-                <a class="nav-link dropdown-toggle" href="#" id="dropdown01" data-toggle="dropdown"
-                   aria-haspopup="true" aria-expanded="false">
-                    <img src="https://img.icons8.com/color/48/000000/code.png" alt="|">
-                    Projets
-                </a>
-                <div class="dropdown-menu" aria-labelledby="dropdown01">
-                    <a class="dropdown-item" href="../projects.html">Liste des projets</a>
-                    <div class="dropdown-divider"></div>
-                    <div class="dropdown-item active">Jovian Website</div>
-                    <a class="dropdown-item" href="pro_ascii_space.html">ASCII Space Destroyer</a>
-                    <a class="dropdown-item" href="pro_pulsar.html">Pulsar</a>
-                    <a class="dropdown-item" href="pro_quoridor.html">Quoridor</a>
-                </div>
-            </li>
-            <li class="nav-item">
-                <a class="nav-link" href="../contact.html">
-                    <img src="https://img.icons8.com/color/48/000000/secured-letter.png" alt="|">
-                    Contact
-                </a>
-            </li>
-        </ul>
-    </div>
-</nav>
+<?php
+$title = "Site";
+include("../header.php");
+?>
 
 
 <!-- Main -->
 <!-- Main -->
 <main role="main" class="container">
 <main role="main" class="container">
@@ -275,22 +215,22 @@
     <!-- Pagination -->
     <!-- Pagination -->
     <ul class="pagination pagination-lg justify-content-center">
     <ul class="pagination pagination-lg justify-content-center">
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link arrow" title="Page précédente" href="../projects.html">&laquo</a>
+            <a class="page-link arrow" title="Page précédente" href="../projects.php">&laquo</a>
         </li>
         </li>
         <li class="page-item active">
         <li class="page-item active">
             <div class="page-link" title="Site web de Jovian">1</div>
             <div class="page-link" title="Site web de Jovian">1</div>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.html">2</a>
+            <a class="page-link" title="ASCII Space destroyer" href="pro_ascii_space.php">2</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="Pulsar" href="pro_pulsar.html">3</a>
+            <a class="page-link" title="Pulsar" href="pro_pulsar.php">3</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link" title="Quoridor" href="pro_quoridor.html">4</a>
+            <a class="page-link" title="Quoridor" href="pro_quoridor.php">4</a>
         </li>
         </li>
         <li class="page-item">
         <li class="page-item">
-            <a class="page-link arrow" title="Page suivante" href="pro_ascii_space.html">&raquo</a>
+            <a class="page-link arrow" title="Page suivante" href="pro_ascii_space.php">&raquo</a>
         </li>
         </li>
     </ul>
     </ul>
 </main>
 </main>