3 Ce squelette definit les styles de l'espace prive
5 Note: l'entete
"Vary:" sert a repousser l'entete par
6 defaut
"Vary: Cookie,Accept-Encoding", qui est (un peu)
7 genant en cas de
"rotation du cookie de session" apres
8 un changement d'IP (effet de clignotement).
10 ATTENTION: il faut absolument le charset sinon Firefox croit que
14 #CACHE{
3600*
100,cache-client}
15 #HTTP_HEADER{Content-Type: text/css; charset=iso-
8859-
15}
16 #HTTP_HEADER{Vary: Accept-Encoding}
18 #SET{claire,##ENV{couleur_claire,edf3fe}}
19 #SET{foncee,##ENV{couleur_foncee,
3874b0}}
20 #SET{left,#ENV{ltr}|choixsiegal{left,left,right}}
21 #SET{right,#ENV{ltr}|choixsiegal{left,right,left}}
23 /* Ancien selecteur de rubriques */
24 .selecteur_parent{font-size:
90%; width:
99%; max-height:
24px;} /* appliquee sur le
<select> */
25 option.selec_rub { background-position: [(#GET{left})] center; background-image: url(#CHEMIN_IMAGE{rubrique-
12.png}); background-repeat: no-repeat; padding-#GET{left}:
16px; }
26 option.niveau_1 { font-weight: bold; background: #GET{claire}; background-image: url(#CHEMIN_IMAGE{secteur-
12.png}); background-repeat: no-repeat; color: #
444;}
27 option.niveau_2 { background:#eee; color: #
202020; border-bottom:
1px solid #GET{claire}; }
28 option.niveau_3 { background:#eee; color: #
404040; }
29 option.niveau_4 { background:#eee; color: #
606060; }
30 option.niveau_5 { background:#eee; color: #
808080; }
31 option.niveau_6 { background:#eee; color: #a0a0a0; }
35 div.petite-racine { margin-bottom: -
5px; }
36 div.petite-racine, a.petite-racine { background: [(#ENV{ltr}|choixsiegal{left,
1,
99})%] no-repeat; background-image: url(#CHEMIN_IMAGE{racine-
12.png}); padding-#GET{left}:
15px; background-color: #fff; border:
1px solid #GET{foncee}; border-bottom:
0; width:
134px; }
37 div.petite-rubrique, a.petite-rubrique { background: [(#ENV{ltr}|choixsiegal{left,
1,
99})%] no-repeat; background-image: url(#CHEMIN_IMAGE{rubrique-
12.png}); padding-#GET{left}:
15px; }
38 div.petit-secteur, a.petit-secteur { background: [(#ENV{ltr}|choixsiegal{left,
1,
99})%] no-repeat; background-image: url(#CHEMIN_IMAGE{secteur-
12.png}); padding-#GET{left}:
15px; }
39 div.rub-ouverte, a.rub-ouverte { padding-#GET{right}:
10px; background: url([(#CHEMIN_IMAGE{triangle-droite[(#GET{rtl})].gif})]) [(#GET{right})] center no-repeat; }
41 #choix_parent_principal { background: #fff; border:
1px solid #GET{foncee}; position: relative; height:
170px; overflow: auto; margin-top:
5px;}
42 .recherche_rapide_parent {margin-top: -
25px;float:right; }
43 .rubrique_actuelle {height:
25px; }
44 #selection_rubrique .informer { background: #fff; }
45 .informer-auteur { background: #fff; padding:
5px; border-top:
0; }
47 #choix_parent .item { color: #
666; background-color: #fff; }
48 #choix_parent_principal .item { padding:
2px; display: block; }
49 #choix_parent .item.on { color: #
000; background-color: #ccc; }
50 #choix_parent .item.on a {color:#
000;}
51 #choix_parent .item:hover a { color: #
000; cursor: pointer; }
55 /* Les éléments propres à chaque objet */
56 <BOUCLE_objets(POUR){tableau (#REM|lister_tables_objets_sql)}
>
57 [(#SET{petite_icone, [(#CHEMIN_IMAGE{#VALEUR{icone_objet}-
12.png}|sinon{[(#CHEMIN_IMAGE{#VALEUR{icone_objet}-
16.png}|image_reduire{
12}|extraire_attribut{src})]})]})]
58 ul.item_picked li.#VALEUR{type} {padding-#GET{left}:
15px;background-image:url(#GET{petite_icone});}
59 .item_picker .[(#VALEUR{table_objet})] .type_objet {padding-#GET{left}:
15px; background:url(#GET{petite_icone}) no-repeat[ (#GET{left}) ]center;}
60 .item_picker .frame ul li.#VALEUR{type} {background:url(#GET{petite_icone}) no-repeat[ (#GET{left}) ]
2px;}
63 /* Styles des éléments déjà sélectionnés */
64 ul.item_picked,fieldset ul.item_picked {list-style:none;margin:
0;padding:
0;float:left;}
65 ul.item_picked li {margin:
0 2px
2px;padding:
2px;background:#eee;border:
1px solid #GET{claire};float:#GET{left};clear:none;background-repeat:no-repeat;background-position: [(#GET{left}) ]center;}
66 ul.item_picked li span.sep {display:none;}
67 ul.item_picked li label {margin:
0;display:inline;float:none;}
68 .js ul.item_picked li .checkbox {display: none;}
70 ul.item_picked.select li {padding:
2px
0;border:
0;font-weight:bold;background:none;float:none;}
71 ul.item_picked.select ul
> li {float:#GET{left};}
72 ul.item_picked.changing {}
74 /* Le bouton pour ouvrir le sélecteur */
75 .picker_bouton {float:#GET{right};clear:both;}
77 /* Styles de la partie contenant le sélecteur */
78 .item_picker {clear:#GET{left};font-size:
0.95em;}
79 .item_picker .navigateur{border:
1px solid #GET{claire};padding:
0.2em;width:
20em;} /* pas trop large pour une meilleure lecture */
80 .item_picker .chemin {background:#GET{claire}; margin:
0 0 0.25em
0;padding:
0.3em;clear:both;}
81 .item_picker .chemin .on {margin:
0;}
82 .item_picker a.choisir_ici {display:block;text-align:center;margin:
0.2em
0;}
83 .item_picker a.choisir_ici span{padding-#GET{left}:
18px;background:transparent url('#CHEMIN_IMAGE{ajouter-
16.png}') no-repeat [ (#GET{left}) ] center;}
84 .item_picker .liste {margin:
0;max-height:
300px;overflow:auto;}
85 .item_picker .liste .type_objet {margin:
0;}
86 .selecteur_type_unique .item_picker .liste .type_objet{display:none;}
87 .item_picker .liste ul {list-style:none;margin:
0;padding:
0;}
88 .item_picker .liste li {display:block;clear:both;line-height:
1.1em;list-style:none;margin:
0;padding:
0;position:relative;}
89 .item_picker .liste li:hover {background-color:[#(#GET{claire}|couleur_eclaircir)];}
90 .item_picker .liste a.ouvrir {color:black;text-decoration:none;display:block;line-height:
16px;margin-#GET{right}:
20px;padding:
0.3em
0;padding-#GET{left}:
2px;padding-#GET{right}:
20px;background:transparent url('#CHEMIN_IMAGE{fleche-droite-
16.png}') no-repeat [ (#GET{right}) ]
0.3em;}
91 .item_picker .liste a.choisir {display:block;width:
16px;height:
16px;position:absolute;#GET{right}:
0;top:
0;padding:
0.3em
2px;text-indent:-
10000px;background:url('#CHEMIN_IMAGE{ajouter-
16.png}') no-repeat center center;}
92 .item_picker .liste a:hover,.item_picker .liste a:focus {background-color:#GET{claire};}
94 .item_picker .frame {background:#fff;border:
1px solid #GET{foncee};width:
159px;height:
400px;float:#GET{left};overflow:auto;position:relative;}
95 .cadre .cadre_padding .item_picker .frame {width:
153px;}
96 .fiche_objet .cadre .cadre_padding .item_picker .frame {width:
148px;}
97 .item_picker .frame.total_3 {margin-#GET{left}:-
58px;border-#GET{left}:
3px solid #GET{foncee};}
98 .item_picker .frame.frame_0 {margin-#GET{left}:
0;z-index:
1000;}
99 .item_picker .frame.frame_1 {z-index:
1010;}
100 .item_picker .frame.frame_2 {z-index:
1020;}
101 .item_picker .frame.frame_3 {z-index:
1030;}
102 .item_picker .frame.frame_4 {z-index:
1040;}
104 .item_picker .frame .frame_close {float:#GET{right};}
105 .item_picker .frame h2 {margin:
0;padding:
5px;background:[#(#GET{claire}|couleur_eclaircir)];font-size:
1.3em;}
106 .item_picker .frame .pagination {font-size:
0.9em;}
108 .item_picker .frame ul {list-style:none;margin:
0;padding:
0;}
109 .item_picker .frame ul li {display:block;clear:both;list-style:none;margin:
0;padding:
0 2px;padding-#GET{left}:
15px;padding-#GET{right}:
16px;position:relative;}
111 .item_picker .frame ul li:hover,.item_picker .frame ul li.on {background-color:[#(#GET{claire}|couleur_eclaircir)];}
112 .item_picker .frame a:hover,.item_picker .frame a:hover .ouvrir,.item_picker .frame a:hover .add {background-color:#GET{claire};}
114 .item_picker .frame ul li .ouvrir {position:absolute;display:block;top:
0px;#GET{right}:
0px;}
115 .item_picker .frame ul
>li .add {float:#GET{left};clear:#GET{left};}
116 .item_picker .frame ul li a {display:block;}
117 .item_picker .frame a {text-decoration:none;}
119 .browser .choix_rapide {font-size:
0.9em;}
120 .browser #picker_id {padding:
0;margin:
0 5px;border:
1px solid;}
124 Selecteurs de rubrique / article
125 ayant une classe li.selecteur_item
126 n'ont pas de marge a gauche pour occuper toute la largeur
128 .formulaire_spip li.selecteur_item {
129 padding-#GET{left}:
10px;background:#fff;
131 .formulaire_spip li.selecteur_item label {
132 margin-#GET{left}:
0;display:block;float:left;padding:
2px
0;