[AJ] Feuille de style bleu disponible

TACHES

@@ -23,7 +23,6 @@ DESTDIR
 - Que donne une ligne vide dans le fichier de catégorie ? => à tester comme cas possible
 
 Pour la v0.1.1 : 
-- Faire la feuille de style bleue pour le site avec un menu
 - améliorer la connexion entre le makefile et creation_categ.sh afin de ne plus toucher aux variables de creation_categ.sh
 - faire des "which" pour les programmes utilisés (notamment pour sha1 ou md5). Quitter le makefile si dans TEST les "which" sont vides
 - dans dossier categ on fait une somme sha1 ou md5 de tous les fichiers. On copie dans le dossier porteail. Au début du programme, on compare somme de tous les fichiers du dossier categ avec la somme contenue dans dossier porteail (s'il existe). Si les sommes sont pareilles, alors on quitte le makefile
@@ -97,4 +96,4 @@ des éléments
 - améliorer visibilité sur écran 22" avec : {margin-left:10%;margin-right:10%;}
 - créer un site internet parlant de PorteAil avec une page générée par PorteAil comportant l'ensemble des sites utilisant Porteail
 - Essayer de faire en sorte que le lien soit écarté jusqu'aux bords de tout l'élément afin que le clic sur l'élément renvoie sur la page
-
+- Faire la feuille de style bleue pour le site avec un menu

style/bleu_avec_menu.css

@@ -0,0 +1,186 @@
+html, body {
+height: 100%;
+width: 100%;
+min-width: 300px;
+margin: 0;
+padding: 0;
+background-color: #e9ecf4;
+color: #223355;
+}
+
+a:link {
+color: #6276a4;
+text-decoration: underline;
+}
+
+a:visited {
+color: #6276a4;
+}
+
+a:hover {
+background-color: #6276a4;
+color: #ffffff;
+}
+
+p {
+padding: 5px;
+}
+
+h2 {
+width: 94%;
+padding-left: 2%;
+margin-left: 1%;
+color: #555577;
+border-bottom: solid;
+border-left: solid;
+-moz-border-radius: 10px;
+border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+h3 {
+width: 92%;
+padding-left: 3%;
+margin-left: 1%;
+color: #555577;
+border-bottom: solid;
+border-left: solid;
+-moz-border-radius: 12px;
+border-radius: 12px;
+-webkit-border-radius: 12px;
+}
+
+div#chapeau {
+position: relative;
+margin: 0;
+padding: 0;
+height: 50px;
+width: 78%;
+top: 0;
+left: 1%;
+background-color: #223355;
+color: #ffffff;
+text-align: center;
+font-size: 120%;
+line-height: 15%;
+-moz-border-radius-bottomright: 25px;
+border-bottom-left-radius: 25px;
+-webkit-border-radius-bottomright: 25px;
+-moz-border-radius-bottomleft: 25px;
+border-bottom-right-radius: 25px;
+-webkit-border-radius-bottomleft: 25px;
+}
+
+div#chapeau h1 {
+margin: 0;
+padding: 0;
+height: 50px;
+line-height: 50px;
+}
+
+div#corps {
+position: relative;
+width: 78%;
+left: 2%;
+}
+
+div#corps div.ensemble_element {
+min-height: 10em;
+}
+
+div#corps a.cadre {
+height: 9em;
+width: 11em;
+margin: 0 5px 10px 5px;
+float: left;
+border: thin solid #000000;
+-moz-border-radius: 15px;
+border-radius: 15px;
+-webkit-border-radius: 15px;
+-moz-box-shadow: 1px 1px 8px #000000;
+box-shadow: 1px 1px 8px #000000;
+-webkit-box-shadow: 1px 1px 8px #000000;
+overflow: hidden;
+text-align: center;
+text-decoration: none;
+}
+
+div#corps a.cadre:hover {
+background-color: #223355;
+color: #ffffff;
+}
+
+div#corps a.cadre div.element {
+height: 9em;
+margin-top: 1em;
+}
+
+div#corps a.cadre div.element img {
+margin-top: 2em;
+margin-right: auto;
+margin-left: auto;
+border: 0;
+}
+
+div#corps div.espace {
+clear: both;
+}
+
+div#cartable {
+position: absolute;
+height: auto;
+width: 20%;
+top: 90px;
+right: 0;
+background-color: #223355;
+color: #ffffff;
+-moz-border-radius-topleft: 25px;
+border-top-left-radius: 25px;
+-webkit-border-radius-topleft: 25px;
+-moz-border-radius-bottomleft: 25px;
+border-bottom-left-radius: 25px;
+-webkit-border-radius-bottomleft: 25px;
+overflow: hidden;
+}
+
+div#cartable h3 {
+width: 90%;
+color: #ffffff;
+text-align: center;
+border-bottom: solid;
+border-left: solid;
+-moz-border-radius: 12px;
+border-radius: 12px;
+-webkit-border-radius: 12px;
+border-color: #ffffff;
+}
+
+div#cartable a:link {
+color: #aaaabb;
+text-decoration: underline;
+}
+
+div#cartable a:visited {
+color: #aaaabb;
+}
+
+div#cartable a:hover {
+background-color: #aaaabb;
+color: #223355;
+}
+
+div#soulier {
+position: relative;
+top: 5px;
+right: 5px;
+height: 20px;
+width: 98%;
+color: #000000;
+}
+
+div#soulier p {
+margin: 0;
+padding: 0;
+font-size: 10px;
+text-align: center;
+}