Ce thème utilise un système de page à 3 couches (voir aussi ici).
En effet, 3 blocs de position et taille identiques sont déclarés : bckg
, filtre
et page
Ces 3 blocs s’étendent sur toute la page puisqu’ils sont positionnés (par commun.css) de manière absolute
à une distance des bords égale à 0 , mais :
- bckg a pour index Z = -2, il sera donc situé tout à l’arrière. Il sera utilisé pour mettre une image d’arrière plan.
- filtre a pour index Z = -1, il sert de "filtre" grâce à une couleur de fond et une opacité variable qui vont "atténuer" les contrastes de couleur de l’arrière plan.
- page a pour index Z = 0 (valeur par défaut), son fond est transparent, ses éléments opaques car n’étant pas affectés par l’opacité variable du bloc filtre.
Ce thème est un thème Zengarden, mais il est "léger" et se base sur une feuille de style commune.
Le principe de "mes" thèmes est en fait très simple :
- une feuille de style commune gère le positionnement et la taille des éléments, qui sont globalement communs à tous les thèmes.
-
commun.css
est à la racine des thèmes, donc dans le répertoire themes
du site - ce fichier est inclut par celui du thème grâce à l’instruction
@import url("../commun.css");
- la feuille de style du thème se contente de modifier les couleurs, les images, éventuellement la police, la taille et la "décoration" des textes
- le thème n’a donc pas besoin de déclarer toutes les propriétés, ce qui rend sa conception et sa maintenance plus simples.
- si besoin est, le thème peut remplacer les propriétés définies dans la feuille commune.
Ce système permet une plus grande compatibilité des thèmes avec différents sites et donc différents squelettes Zpip.
Graphiquement, ce thème se présente sous la forme d’un bureau Gnome 3 du système Linux Fedora 16.
- Une image de fond marin avec sous-marin de type Nautilus, en référence à Jules Verne, sert d’arrière plan au site, dans le bloc
bckg
. Cette image est étendue aux dimensions du bloc (et donc de la page), ce qui peut éventuellement la déformer. - exceptionnellement le bloc
filtre
n’a pas de couleur d’arrière plan et est complétement transparent - le texte du contenu est donc en blanc, l’entête et le pied de page reprenant les couleurs de fond et de texte de la barre d’outils de Gnome 3.
L’icône du bloc dépliant "zone_tags" contenant la liste des tags liés à l’article est celle "par défaut" indiquée dans le css commun, et située à la racine des thèmes.
le bloc "logo" étant défini dans mon squelette Zpip, il ne l’est pas dans les thèmes, pour des raisons d’unicité de l’identifiant du div.
- Thème ZenGarden Fedora 16 (Verne)
- Icône mots-clés
- Feuille de style commune (site vader-fr)