tabs navigation w/ apache urlrewriting config

css/design.css

@@ -26,24 +26,34 @@ CSS
 	padding: 2px;
 }
 
-#logo, h1{
+#logo, #title{
 	vertical-align: middle;
 }
 
-h1{
-	display: inline-block;
+#logo{
+	width: 45px;
+	height: 45px;
+	margin-right: 5px;
+}
+
+#title{
+	display: flex;
 	width: auto;
 	margin: 0 0 0 15px;
 	color: #2E2E2E;
 	text-shadow: 0 0 3px #6699ff;
 }
 
-h2{
+#pageTitle{
 	margin-left: 5px;
 	font-family: ubuntumono;
 	font-weight: normal;
 }
 
+#menu{
+	margin: auto;
+}
+
 h3{
 	margin-top: 5px;
 }
@@ -92,20 +102,23 @@ article .postInfos{
 	font-size: 0.8em;
 }
 
-address, time{
-	display: inline;
+#footer{
+	width: 98%;
+	background-color: #f0f0f0;
+	margin: auto;
+	padding: 1%;
+	text-align: center;
+	font-size: 0.8em;
 }
 
 
-
-
 /*
 ====
 Media Queries
 */
 
 @media all and (max-width: 1350px){
-	header{
+	#header{
 		justify-content: space-around;
 	}
 
@@ -115,18 +128,13 @@ Media Queries
 }
 
 @media all and (max-width: 1190px){
-	h1{
+	#title{
 		font-size: 1.4em;
 	}
 }
 
 @media all and (max-width: 1075px){
-	#logo{
-		width: 45px;
-		height: 45px;
-		margin-right: 5px;
-	}
-	h1{
+	#title{
 		margin-left: 2px;
 	}
 
@@ -142,19 +150,23 @@ Media Queries
 	}
 }
 
-@media all and (max-width: 920px){
+@media all and (max-width: 955px){
 	#page{
 		font-size: 1.2em;
 	}
 
-	#header{
+	#header, #title{
 		flex-direction: column;
 		margin-top: 5px;
 	}
-
-	h1{
+	#title{
 		font-size: 1.7em;
 		margin: 0;
+		text-align: center;
+	}
+	#logo{
+		width: auto;
+		height: auto;
 	}
 }
 
@@ -191,7 +203,10 @@ Media Queries
 	#page{
 		font-size: 1em;
 	}
-
+	#logo{
+		width: 45px;
+		height: 45px;
+	}
 	li{
 		width: 90%;
 		margin: 3px auto;

index.php

 <?php
 // action par défaut
-$namePage = "blog";
+$pageName = "blog";
 
-require_once("site/layout/layout.php");
-
-echo "<pre>";
+require_once("site/view/functionGetPageName.php");
+require_once("site/view/functionWriteMenu.php");
 
-if(isset($_GET['about'])){
-	echo "truc";
-}
+$pageName = getPageName();
 
-echo "</pre>";
+require_once("site/layout/layout.php");
 
 ?>
\ No newline at end of file

site/layout/layout.php

@@ -4,7 +4,7 @@
 	<meta charset="utf-8" />
 	<meta name="description" content="Site perso de Corentin Bettiol." />
 	<meta name="viewport" content="width=device-width" />
-	<title>l3m website -- <?php echo $namePage; ?></title>
+	<title>l3m website - <?php echo $pageName; ?></title>
 	<link rel="stylesheet" href="css/design.css" />
 	<style>
 		*{
@@ -26,20 +26,14 @@
 			<a href="/" title="Accueil - blog"><!--
 				--><img src="img/logo.png" alt="logo_morse" id="logo" /><!--
 			--></a><!--
-			--><h1>l3m website</h1>
+			--><h1 id="title">l3m website</h1>
 		</header>
-		<nav>
-			<ul>
-				<li><a href="/" title="Blog" class="selected">Blog</a></li>
-				<li><a href="about" title="À propos">À propos</a></li>
-				<li><a href="projects" title="Projets">Projets</a></li>
-				<li><a href="contact" title="Contact">Contact</a></li>
-				<li><a href="login" title="Connexion">Connexion</a></li>
-			</ul>
+		<nav id="menu">
+			<?php writeMenu($pageName); ?>
 		</nav>
 	</header>
 
-	<h2>Blog</h2>
+	<h2 id="pageTitle">Blog</h2>
 
 	<article>
 		<h3><a href="?article=1">Premier article</a></h3>
@@ -53,5 +47,11 @@
 		</section>
 	</article>
 
+	<footer id="footer">
+		<p>
+			Site créé par Corentin Bettiol - <a href="/changelog" title="changelog">Changelog</a> - <a href="/rss" title="rss">RSS</a> - v1
+		</p>
+	</footer>
+
 </body>
 </html>
\ No newline at end of file

site/view/functionGetPageName.php

+<?php
+function getPageName(){
+	switch ($_GET['action']) {
+	case 'contact':
+		return "Contact";
+		break;
+	case 'about':
+		return "À Propos";
+		break;
+	case 'projects':
+		return "Projets";
+		break;
+	case 'login':
+		return "Connexion";
+		break;
+	default:
+		return "Blog";
+		break;
+	}
+}
\ No newline at end of file

site/view/functionWriteMenu.php

+<?php
+	function writeMenu($pageName){
+?>
+	<ul>
+		<li><a href="/" title="Blog" <?php if($pageName == "Blog"){ ?>class="selected"<?php } ?>>Blog</a></li>
+		<li><a href="about" title="À propos" <?php if($pageName == "À Propos"){ ?>class="selected"<?php } ?>>À propos</a></li>
+		<li><a href="projects" title="Projets" <?php if($pageName == "Projets"){ ?>class="selected"<?php } ?>>Projets</a></li>
+		<li><a href="contact" title="Contact" <?php if($pageName == "Contact"){ ?>class="selected"<?php } ?>>Contact</a></li>
+		<li><a href="login" title="Connexion" <?php if($pageName == "Connexion"){ ?>class="selected"<?php } ?>>Connexion</a></li>
+	</ul>
+<?php }
\ No newline at end of file

site/view/functionWritePageName.php

+<?php
+
+	function getPageName(){
+		switch ($_GET['action']) {
+		case 'contact':
+			$namePage = "Contact";
+			break;
+		case 'about':
+			echo "À Propos";
+			break;
+		case 'projects':
+			echo "Projets";
+			break;
+		case 'login':
+			echo "Connexion";
+			break;
+		default:
+			echo "Blog";
+			break;
+		}
+	}
\ No newline at end of file