Commit 26b34341 authored by Corentin Bettiol's avatar Corentin Bettiol 💻

changelog, rss & 404

parent 2aefac78
/* http://www.alsacreations.com/tuto/lire/1620-une-video-arriere-plan-sur-toute-la-page.html */
#video-fond {
overflow: hidden;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0.6;
z-index: -1;
}
#video-fond > video {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
@media (min-aspect-ratio: 16/9) {
#video-fond > video {
height: 300%;
top: -100%;
}
}
@media (max-aspect-ratio: 16/9) {
#video-fond > video {
width: 300%;
left: -100%;
}
}
@supports (object-fit: cover) {
#video-fond > video {
width: 100%;
height: 100%;
top: 0;
left: 0;
object-fit: cover;
}
}
body{
opacity: 0.75;
}
#video-fond{
opacity: 1;
}
#header{
margin-top: 0;
}
\ No newline at end of file
...@@ -59,7 +59,7 @@ h3{ ...@@ -59,7 +59,7 @@ h3{
font-size: 1em; font-size: 1em;
} }
ul{ #list-menu{
list-style-type: none; list-style-type: none;
font-size: 1.5em; font-size: 1.5em;
display: flex; display: flex;
...@@ -70,7 +70,7 @@ ul{ ...@@ -70,7 +70,7 @@ ul{
padding: 0; padding: 0;
} }
li a{ #list-menu a{
padding: 7px; padding: 7px;
margin: 5px; margin: 5px;
text-decoration: none; text-decoration: none;
...@@ -78,7 +78,7 @@ li a{ ...@@ -78,7 +78,7 @@ li a{
transition: color 0.2s, background-color 0.2s; transition: color 0.2s, background-color 0.2s;
} }
li a:hover{ #list-menu a:hover{
color: #47476b; color: #47476b;
background-color: #f0f0f0; background-color: #f0f0f0;
transition: color 0.2s, background-color 0.2s; transition: color 0.2s, background-color 0.2s;
...@@ -94,7 +94,7 @@ article{ ...@@ -94,7 +94,7 @@ article{
section{ section{
} }
li .selected{ #list-menu .selected{
padding-bottom: 2px; padding-bottom: 2px;
border-bottom: 5px solid #cccccc; border-bottom: 5px solid #cccccc;
} }
...@@ -112,6 +112,11 @@ article .postInfos{ ...@@ -112,6 +112,11 @@ article .postInfos{
font-size: 0.8em; font-size: 0.8em;
} }
hr{
width: 66%;
border: 1px solid #CFCFCF;
}
/* /*
==== ====
...@@ -123,7 +128,7 @@ Media Queries ...@@ -123,7 +128,7 @@ Media Queries
justify-content: space-around; justify-content: space-around;
} }
ul{ #list-menu{
font-size: 1.2em; font-size: 1.2em;
} }
} }
...@@ -138,14 +143,10 @@ Media Queries ...@@ -138,14 +143,10 @@ Media Queries
#title{ #title{
margin-left: 2px; margin-left: 2px;
} }
li{
margin: 0 5px;
}
} }
@media all and (max-width: 1020px){ @media all and (max-width: 1020px){
li a{ #list-menu li a{
margin: 2px; margin: 2px;
padding: 5px; padding: 5px;
} }
...@@ -179,22 +180,22 @@ Media Queries ...@@ -179,22 +180,22 @@ Media Queries
width: 75%; width: 75%;
} }
ul{ #list-menu{
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
} }
li{ #list-menu li{
margin: 5px; margin: 7px;
} }
li a{ #list-menu a{
background-color: #f2f2f2; background-color: #f2f2f2;
padding: 3px; padding: 3px;
} }
li a:hover{ #list-menu a:hover{
background-color: #e3e3e3; background-color: #e3e3e3;
} }
li .selected{ #list-menu .selected{
border-top: 1px solid #cccccc; border-top: 1px solid #cccccc;
border-bottom: 2px solid #cccccc; border-bottom: 2px solid #cccccc;
} }
...@@ -208,17 +209,17 @@ Media Queries ...@@ -208,17 +209,17 @@ Media Queries
width: 45px; width: 45px;
height: 45px; height: 45px;
} }
li{ #list-menu li{
width: 90%; width: 90%;
margin: 3px auto; margin: 3px auto;
text-align: center; text-align: center;
} }
ul li a{ #list-menu a{
display: inline-block; display: inline-block;
width: 90%; width: 90%;
padding: 3px 5px; padding: 3px 5px;
} }
li .selected{ #list-menu .selected{
border: none; border: none;
background-color: #d9d9d9; background-color: #d9d9d9;
} }
......
...@@ -13,6 +13,15 @@ function getPageName(){ ...@@ -13,6 +13,15 @@ function getPageName(){
case 'login': case 'login':
return ["Connexion", "login"]; return ["Connexion", "login"];
break; break;
case 'changelog':
return ["Changelog", "changelog"];
break;
case 'rss':
return ["Rss", "rss"];
break;
case '404':
return ["Erreur 404 - File not found", "404"];
break;
default: default:
return ["Blog", "blog"]; return ["Blog", "blog"];
break; break;
......
<?php <?php
function writeMenu($pageName){ function writeMenu($pageName){
?> ?>
<ul> <ul id="list-menu">
<li><a href="/" title="Blog" <?php if($pageName == "Blog"){ ?>class="selected"<?php } ?>>Blog</a></li> <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="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="projects" title="Projets" <?php if($pageName == "Projets"){ ?>class="selected"<?php } ?>>Projets</a></li>
......
...@@ -6,15 +6,19 @@ ...@@ -6,15 +6,19 @@
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<title>l3m website - <?php echo $pageName[0]; ?></title> <title>l3m website - <?php echo $pageName[0]; ?></title>
<link rel="stylesheet" href="css/design.css" /> <link rel="stylesheet" href="css/design.css" />
<?php
if($pageName[1] == 404){ ?>
<link rel="stylesheet" href="css/404.css" />
<?php } ?>
<style> <style>
*{ *{
color: #1f1f2e; color: #1f1f2e;
} }
li a{ #list-menu a{
background-color: #e3e3e3; background-color: #e3e3e3;
} }
@media all and (max-width: 700px){ @media all and (max-width: 700px){
li a{ #list-menu a{
background-color: #f2f2f2; background-color: #f2f2f2;
} }
} }
...@@ -37,6 +41,8 @@ ...@@ -37,6 +41,8 @@
<?php require_once("site/view/". $pageName[1] .".php"); ?> <?php require_once("site/view/". $pageName[1] .".php"); ?>
<hr />
<footer id="footer"> <footer id="footer">
<p> <p>
Site créé par Corentin Bettiol - <a href="/changelog" title="changelog">Changelog</a> - <a href="/rss" title="rss">RSS</a> - v1 Site créé par Corentin Bettiol - <a href="/changelog" title="changelog">Changelog</a> - <a href="/rss" title="rss">RSS</a> - v1
......
<article>
<p>
Désolé, ce lien est cassé, le contenu n'existe pas ou a changé d'adresse.
</p>
</article>
<div id="video-fond">
<video autoplay loop>
<source type="video/mp4" src="img/CloudsLoop.mp4" media="(orientation: landscape)">
</video>
</div>
\ No newline at end of file
...@@ -7,6 +7,8 @@ ...@@ -7,6 +7,8 @@
</article> </article>
<hr />
<article> <article>
<h3>À propos du site</h3> <h3>À propos du site</h3>
...@@ -22,6 +24,8 @@ ...@@ -22,6 +24,8 @@
</p> </p>
</article> </article>
<hr />
<article> <article>
<h3>À propos du serveur</h3> <h3>À propos du serveur</h3>
...@@ -32,7 +36,7 @@ ...@@ -32,7 +36,7 @@
</p> </p>
<p> <p>
Certaines données pouvant vous concerner peuvent être conservées (pas plus d'un an). Elles ne seront jamais vendues ni transmises à des tiers. Certaines données pouvant vous concerner peuvent être y conservées dessus (pas plus d'un an). Elles ne seront jamais vendues ni transmises à des tiers.
</p> </p>
</article> </article>
\ No newline at end of file
<article>
<h3>22/10/18</h3>
<ul>
<li>Création & remplissage des pages <a href="changelog">changelog</a>, <a href="rss">rss</a> & <a href="404">404</a></li>
<li>Modifs design du menu, ajout de la vidéo de fond sur la page 404</li>
</ul>
</article>
<hr />
<article>
<h3><a href="https://git.bitmycode.com/sodimel/l3m-website/commit/2aefac7867534e551e4d043fdb553231f9129d47" title="commit 2aefac78">avant le 22/10/18</a></h3>
<ul>
<li>Création du layout MVC</li>
<li>Création des pages vides Blog, Connexion, A propos, Contact, Projets</li>
<li>Exemple de remplissage de Blog, remplissage de A propos & Contact</li>
<li>Design sommaire</li>
<li>Configuration Apache (url rewriting, site-enabled)</li>
</ul>
</article>
<hr />
<article>
<h3><a href="https://git.bitmycode.com/sodimel/l3m-website/commit/51781624eb563269075ffc2d70de59f6eb12d78b" title="commit 51781624">Au tout début</a></h3>
<p>
Le 15 septembre 2018, j'ai eu envie de remplir mon site. Mais il était vraiment très mal codé.
</p>
<p>
Donc là je me suis dit <q>okay cette année je refais mon site</q>. Et voilà.
</p>
<p>
La v1 est la version de développement (il manque des features).
</p>
</article>
<hr />
<article>
<p><i>Les <a href="https://git.bitmycode.com/sodimel/l3m-website">sources</a> sont disponibles sur le <a href="https://git.bitmycode.com">gitlab</a> de <a href="https://bitmycode.com">BitMyCode</a>.</i></p>
</article>
\ No newline at end of file
...@@ -11,6 +11,8 @@ ...@@ -11,6 +11,8 @@
</p> </p>
</article> </article>
<hr />
<article> <article>
<h3>Réseaux sociaux</h3> <h3>Réseaux sociaux</h3>
......
TODO -- projets
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment