From 9d729aab37f7d5cc4aa5a0180d1ad494b94050fb Mon Sep 17 00:00:00 2001 From: Olivier DOSSMANN Date: Mon, 28 Feb 2011 11:51:49 +0100 Subject: [PATCH] Gestion de l'ajout facultatif d'un menu dans la page --- TACHES | 5 +- makefile | 12 ++-- style/bicolore_ajout_menu.patch | 25 +++++++ style/{defaut.css => bicolore_sans_menu.css} | 71 +++++++++++++------- 4 files changed, 82 insertions(+), 31 deletions(-) create mode 100644 style/bicolore_ajout_menu.patch rename style/{defaut.css => bicolore_sans_menu.css} (66%) diff --git a/TACHES b/TACHES index d458d4f..b837f91 100644 --- a/TACHES +++ b/TACHES @@ -3,8 +3,6 @@ - trouver une syntaxe pour les fichiers de catégories contenant des éléments Par exemple : ### Ma super catégorie ### -- permettre l'ajout facultatif d'un menu - - gérer le fait que le css change si on a un menu ou pas (Cf. dossier exemple avec le(s) fichier(s) patch) - rendre la page valide XHTML Strict via validator.w3.org - permettre l'ajout de plusieurs CSS dans HEAD - permettre l'ajout d'un texte d'introduction au début de la page @@ -44,3 +42,6 @@ FAITES : - ajouter une licence/copyright - faire une page d'exemple avec un menu et une feuille de style en noir et blanc - faire une page d'exemple sans menu et avec une feuille de style en noir et blanc +- permettre l'ajout facultatif d'un menu + - gérer le fait que le css change si on a un menu ou pas (Cf. dossier exemple avec le(s) fichier(s) patch) + diff --git a/makefile b/makefile index e8c7ff4..5dc46c2 100644 --- a/makefile +++ b/makefile @@ -12,11 +12,13 @@ ## obligatoires DESTINATION = porteail INDEX = $(DESTINATION)/index.html -CSS_DEFAUT = defaut.css +CSS_DEFAUT = bicolore_sans_menu.css +CSS_PATCH_AJOUT_MENU = bicolore_ajout_menu.patch +CSS_NOM = defaut.css TITRE = Titre par défaut ACCUEIL = Accueil - $(TITRE) ## facultatives -MENU = menu.html +#MENU = menu.html # création de tous les fichiers all: test index @@ -32,6 +34,7 @@ test: @test -d style || mkdir style @test -f style/$(CSS_DEFAUT) || exit $(if $(MENU), @test -f $(MENU) || exit, @echo -e "Pas de menu") + $(if $(MENU), @test -f style/$(CSS_DEFAUT) || exit) @test -d $(DESTINATION) || mkdir $(DESTINATION) @test -d $(DESTINATION)/image || mkdir $(DESTINATION)/image @echo -e "\t…terminé." @@ -44,8 +47,9 @@ index: @echo -e "Modification du contenu…" @sed -i "s/TITRE_PORTEAIL/$(TITRE)/g" $(INDEX) @sed -i "s/ACCUEIL_PORTEAIL/$(ACCUEIL)/g" $(INDEX) - @cp style/$(CSS_DEFAUT) $(DESTINATION) - @sed -i "s#CSS_DEFAUT#./$(CSS_DEFAUT)#g" $(INDEX) + @cp style/$(CSS_DEFAUT) $(DESTINATION)/$(CSS_NOM) + $(if $(MENU), @patch -u -p0 $(DESTINATION)/$(CSS_NOM) style/$(CSS_PATCH_AJOUT_MENU)) + @sed -i "s#CSS_DEFAUT#./$(CSS_NOM)#g" $(INDEX) @echo -e "\t…terminée." # nettoyage des fichiers générés diff --git a/style/bicolore_ajout_menu.patch b/style/bicolore_ajout_menu.patch new file mode 100644 index 0000000..eba74a6 --- /dev/null +++ b/style/bicolore_ajout_menu.patch @@ -0,0 +1,25 @@ +--- bicolore_sans_menu.css 2011-02-26 14:56:15.000000000 +0100 ++++ bicolore_avec_menu.css 2011-02-26 15:03:12.000000000 +0100 +@@ -47,11 +47,12 @@ + + div#chapeau { + position: relative; +-margin: 0 auto; ++margin: 0; + padding: 0; + height: 50px; + width: 78%; + top: 0; ++left: 1%; + background-color: #000000; + color: #ffffff; + text-align: center; +@@ -70,7 +71,7 @@ + + div#corps { + position: relative; +-width: 98%; ++width: 78%; + left: 2%; + } + diff --git a/style/defaut.css b/style/bicolore_sans_menu.css similarity index 66% rename from style/defaut.css rename to style/bicolore_sans_menu.css index 229219f..af042ca 100644 --- a/style/defaut.css +++ b/style/bicolore_sans_menu.css @@ -1,10 +1,10 @@ -body { +html, body { height: 100%; width: 100%; margin: 0; padding: 0; -background-color: #e9ecf4; -color: #223355; +background-color: #ffffff; +color: #000000; } a:link { @@ -29,7 +29,7 @@ h2 { width: 80%; padding-left: 2%; margin-left: 1%; -color: #555577; +color: #000000; border-bottom: solid; border-left: solid; -moz-border-radius: 10px; @@ -39,32 +39,39 @@ h3 { width: 80%; padding-left: 3%; margin-left: 1%; -color: #555577; +color: #000000; border-bottom: solid; border-left: solid; -moz-border-radius: 12px; } div#chapeau { -position: absolute; -height: 10%; +position: relative; +margin: 0 auto; +padding: 0; +height: 50px; width: 78%; top: 0; -left: 1%; -background-color: #223355; -color: white; +background-color: #000000; +color: #ffffff; text-align: center; +font-size: 120%; +line-height: 15%; -moz-border-radius-bottomright: 25px; -moz-border-radius-bottomleft: 25px; } +div#chapeau h1 { +margin: 0; +padding: 0; +height: 50px; +line-height: 50px; +} + div#corps { -position: absolute; -width: 78%; -height: 86%; +position: relative; +width: 98%; left: 2%; -top: 13%; -overflow: auto; } div#corps div.ensemble_element { @@ -74,13 +81,16 @@ min-height: 10em; div#corps div.element { height: 9em; width: 19ex; -margin-right: 5px; -margin-bottom: 5px; +margin: 0 5px 10px 5px; float: left; +border: thin solid #000000; +-moz-border-radius: 15px; +-moz-box-shadow: 1px 1px 8px #000000; +overflow: hidden; } div#corps div.element:hover { -background-color: #223355; +background-color: #000000; color: #ffffff; } @@ -106,15 +116,15 @@ div#corps div.espace { div#cartable { position: absolute; -height: 88%; +height: auto; width: 20%; -top: 10%; +top: 90px; right: 0; -background-color: #223355; -color: white; +background-color: #000000; +color: #ffffff; -moz-border-radius-topleft: 25px; -moz-border-radius-bottomleft: 25px; -overflow: auto; +overflow: hidden; } div#cartable h3 { @@ -139,7 +149,18 @@ background-color: #aaaabb; color: #223355; } -div#souliers { - +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; +}