change menu design, remove h2 from page & add it on menu

css/design.css

@@ -24,7 +24,8 @@ CSS
 	align-items: center;
 	font-family: ubuntumono;
 	background-color: #f0f0f0;
-	padding: 2px;	
+	padding: 2px;
+	border-bottom: 5px solid #cccccc;
 }
 
 article p, #pageTitle, article h3, article ul{
@@ -39,7 +40,7 @@ article p, #pageTitle, article h3, article ul{
 #logo{
 	width: 45px;
 	height: 45px;
-	margin-right: 5px;
+	margin-right: 15px;
 }
 
 #title{
@@ -50,16 +51,19 @@ article p, #pageTitle, article h3, article ul{
 	text-shadow: 0 0 3px #6699ff;
 }
 
-#pageTitle{
-	font-family: ubuntumono;
-	font-weight: normal;
-	margin-left: 15px;
-}
-
 #menu{
 	margin: auto;
 }
 
+h2{
+	display: inline-block;
+	margin: 0;
+	padding: 0;
+	font-weight: normal;
+	font-size: 1.5em;
+}
+
+
 h3{
 	margin-top: 5px;
 	font-size: 1em;
@@ -67,7 +71,6 @@ h3{
 
 #listMenu{
 	list-style-type: none;
-	font-size: 1.5em;
 	display: flex;
 	flex-direction: row;
 	justify-content: space-around;
@@ -132,19 +135,12 @@ Media Queries
 	#header{
 		justify-content: space-around;
 	}
-
-	#listMenu{
-		font-size: 1.2em;
-	}
 }
 
 @media all and (max-width: 1075px){
-	#title{
-		margin-left: 2px;
+	#logo{
+		margin: 0;
 	}
-}
-
-@media all and (max-width: 910px){
 	#page{
 		font-size: 1.2em;
 	}
@@ -163,18 +159,7 @@ Media Queries
 	}
 }
 
-@media all and (max-width: 700px){
-
-	#listMenu{
-		flex-wrap: wrap;
-		justify-content: center;
-	}
-	#listMenu a{
-		padding: 5px;
-	}
-}
-
-@media all and (max-width: 450px){
+@media all and (max-width: 500px){
 	#page{
 		font-size: 1em;
 	}
@@ -182,19 +167,30 @@ Media Queries
 		width: 45px;
 		height: 45px;
 	}
+	#title{
+		margin-bottom: 15px;
+	}
+	#listMenu{
+		width: 50%;
+		margin: auto;
+		flex-wrap: wrap;
+		justify-content: center;
+	}
+	#listMenu li, #listMenu h2, #listMenu a{
+		width: 100%;
+	}
 	#listMenu li{
-		width: 90%;
-		margin: -5px auto;
+		margin: 5px auto;
 		text-align: center;
 	}
 	#listMenu a{
 		display: inline-block;
-		width: 90%;
-		padding: 5px;
+		padding: 3px 0;
+		margin: 0;
 	}
 	#listMenu .selected{
 		border: none;
-		background-color: #d9d9d9;
+		background-color: #cccccc;
 	}
 }
 

site/controller/functionWriteMenu.php

@@ -2,9 +2,9 @@
 	function writeMenu($pageName){
 ?>
 	<ul id="listMenu">
-		<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><h2><a href="/" title="Blog" <?php if($pageName == "Blog"){ ?>class="selected"<?php } ?>>Blog</a></h2></li>
+		<li><h2><a href="/about" title="À propos" <?php if($pageName == "À Propos"){ ?>class="selected"<?php } ?>>À propos</a></h2></li>
+		<li><h2><a href="/projects" title="Projets" <?php if($pageName == "Projets"){ ?>class="selected"<?php } ?>>Projets</a></h2></li>
+		<li><h2><a href="/contact" title="Contact" <?php if($pageName == "Contact"){ ?>class="selected"<?php } ?>>Contact</a></h2></li>
 	</ul>
 <?php }
\ No newline at end of file

site/layout/layout.php

@@ -32,8 +32,6 @@
 		</nav>
 	</header>
 
-	<h2 id="pageTitle"><?php echo $pageName[0]; ?></h2>
-
 	<?php require_once("site/view/". $pageName[1] .".php"); ?>
 
 	<hr />