source: spip-zone/_galaxie_/plugins-spip-net/svp2010/css.html @ 47959

Last change on this file since 47959 was 47959, checked in by brunobergot@…, 10 years ago

ébauche du sommaire, on avance sur la page plugin, rangement et nettoyage

File size: 15.9 KB
Line 
1[(#HTTP_HEADER{Content-type: text/css})]
2#SET{couleur, #ENV{couleur_categorie, b9274d}}
3#SET{coul_nav,#GET{couleur}}
4[(#REM)
5<style>
6]
7
8/* Conteneur et outils de base */
9/* --------------------------- */
10body { background-color: #717070; margin: 0; padding: 0; font-family: verdana, arial, helvetica, sans-serif, sans; }
11body img { border: 0; }
12body a { color: #[(#GET{couleur}|couleur_foncer_si_claire)];  outline: none; }
13body a .spip_in { color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
14body a .spip_out { color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
15body .spip-admin-float { right: auto; left: 20px; font-size: 0.8em; }
16
17.clear-left { clear: left; }
18.clear-right { clear: left; }
19.clear-both { clear: both; }
20
21/* Surcharge de typo SPIP */
22/* ---------------------- */
23.spip_code { color: #[(#GET{couleur}|couleur_foncer_si_claire)];}
24
25table.spip { width: 100%; font-size: 0.9em; margin-left: 0; margin-right: 0; border-collapse: separate; overflow: hidden;
26        border: 1px solid #[(#GET{couleur})]; }
27table.spip caption {
28        border-bottom: 0;
29        margin: 0;
30        display: table-caption;
31        background-color: #[(#GET{couleur})];
32        color: #[(#GET{couleur}|couleur_extreme|couleur_inverser)];
33        font-size: 1em;
34        padding: 3px;
35        padding-left: 10px;
36        text-align: left;
37}
38table.spip thead tr th { background-color: #[(#GET{couleur}|couleur_eclaircir)];  border: 0; }
39table.spip tbody tr.row_even { background-color: white; }
40table.spip tbody tr td { padding: 3px;  border: 0;  color: #444444; }
41
42
43/* Bandeau */
44/* ------- */
45#bandeau-haut { position: relative;  height: 99px; background: url([(#CHEMIN{imgs/fond-bandeau-haut.png}|image_sepia{[(#GET{couleur})]}|extraire_attribut{src})]); }
46#bandeau-haut .conteneur_page { height: 99px; }
47#bandeau-haut .logo-site-spip { position: absolute;  left: -2px;  top: 27px; }
48#bandeau-haut .polatouche { position: absolute;  right: -7px;  bottom: -62px;   z-index:100; }
49
50
51/* nav */
52#nav { position: absolute; top: 0; right: 0; width: 480px; height: 23px;
53        padding: 3px 0 0 20px; text-align: left; font-size: 75%; color: white;
54        background: url([(#CHEMIN{imgs/bandeau-haut-droite.png})]) no-repeat; }
55#nav .menu-liste { list-style: none; margin: 0; padding: 0; }
56#nav .menu-liste .menu-entree { display: inline; }
57#nav .menu-liste .menu-entree a { text-decoration: none;  margin-left: 5px;  padding-left: 10px;  color: #ddd; }
58#nav .menu-liste .menu-entree a:hover { color: white;  background: url([(#CHEMIN{imgs/fond-petit-carre.gif})]) left 50% no-repeat; }
59
60/* cadre recherche */
61#cadre-recherche { position: relative; background-color: #eeeeee; padding: 20px 0 20px; }
62#cadre-recherche .conteneur_page { overflow: hidden; }
63
64#principal div.liste_pipelines {  font-size: 0.7em;  text-align: left;  margin: 0;  margin-top: 25px;}
65#principal div.liste_pipelines ul {  margin: 0;  padding: 0;  padding-left: 15px;}
66
67#principal #colonne_navigation ul {
68  font-size: 70%;
69  line-height: 1.1em;
70  margin: 0;
71  padding: 0;
72  list-style-type: none;
73}
74
75#principal #colonne_navigation ul li a {
76  width: 159px;
77  margin-bottom: 0;
78  padding: 4px;
79  padding-top: 7px;
80  padding-right: 15px;
81  display: block;
82  height: 29px;
83  overflow: hidden;
84}
85
86#principal #colonne_navigation ul li a span.numero {
87  display: block;
88  float: left;
89  width: 40px;
90  text-align: right;
91  font-size: 32px;
92  line-height: 31px;
93  margin: 0;
94  margin-top: -2px;
95  padding: 0;
96  font-family: arial, helvetica, sans-serif, sans;
97}
98
99#principal #colonne_navigation ul li a span.intitule {  display: block;  padding-left: 47px;}
100
101#principal #colonne_navigation ul li a {
102  background-color: #f3f3f3;
103  background: url([(#CHEMIN{imgs/fond-nav-rectangle.png}|image_sepia{f3f3f3}|image_aplatir{gif,ffffff, 256, true}|extraire_attribut{src})] ) right center no-repeat;
104  color: #555555;
105  text-decoration: none;
106}
107
108#principal #colonne_navigation ul li a span.numero {  color: #dddddd;}
109
110#principal #colonne_navigation ul li a:hover {
111  background-color: #aaaaaa;
112  background: url([(#CHEMIN{imgs/fond-nav-simple.png}|image_sepia{aaaaaa}|image_aplatir{gif,ffffff, 256, true}|extraire_attribut{src})] ) right center no-repeat;
113  color: white;
114}
115
116#principal #colonne_navigation ul li a:hover span.numero {  color: #666666;}
117
118#principal #colonne_navigation ul li a.on {
119  background: url([(#CHEMIN{imgs/fond-nav-relief.png}|image_sepia{[(#GET{coul_nav})]}|image_aplatir{gif,ffffff, 256, true}|extraire_attribut{src})] ) right center no-repeat;
120  color: white;
121  text-decoration: none;
122  font-weight: bold;
123}
124
125#principal #colonne_navigation ul li a.on span.numero {  font-weight: normal;color: #ffffff;}
126
127#principal #colonne_navigation ul li a.on:hover {
128  background: url([(#CHEMIN{imgs/fond-nav-relief.png}|image_sepia{[(#GET{coul_nav}|couleur_foncer)]}|image_aplatir{gif,ffffff, 256, true}|extraire_attribut{src})] ) right center no-repeat;
129}
130
131#principal #colonne_centrale #articles_presentation {
132  position: absolute;
133  top: 5px;
134  right: 200px;
135  width: 700px;
136  text-align: right;
137  margin: 0;
138  padding: 0;
139  list-style-type: none;
140  font-size: 0.8em;
141}
142
143#principal #colonne_centrale #articles_presentation li {  display: inline;  padding-left: 10px;}
144#principal #colonne_centrale #articles_presentation li a {  text-decoration: none;}
145#principal #colonne_centrale #articles_presentation li a:hover {  color: black;}
146
147#principal #colonne_centrale #choix_version {
148  float: right;
149  width: 180px;
150  border: 1px solid #ccc;
151  -moz-border-radius: 10px;
152  -webkit-border-radius: 10px; 
153  background-color: #f7f7f7;
154  background: url(#CHEMIN{imgs/fond-selection.gif}) bottom repeat-x;
155  padding: 9px;
156  margin: 0;
157  margin-right: -230px;
158  font-size: 80%;
159  list-style-type: none;
160}
161
162#principal #colonne_centrale #choix_version .sel_choix_version {  padding-top: 2px;  padding-left: 20px;  line-height: 1.1em;}
163#principal #colonne_centrale #choix_version .sel_choix_version a {  text-decoration: none;}
164
165#principal #colonne_centrale #choix_version .sel_choix_version_actif {
166  font-weight: bold;
167  padding-left: 20px;
168  background: url([(#CHEMIN{imgs/check-valid.gif})]) left 2px no-repeat;
169}
170
171#principal #colonne_centrale #choix_version .sel_choix_version_actif a {  color: black;}
172
173#principal #colonne_centrale .colonne_etroite {
174  padding-right: 230px;
175}
176
177#principal #colonne_centrale .colonne_etroite .texte {
178  margin-top: 25px;
179  line-height: 1.4em;
180  text-align: justify;
181  color: #444444;
182}
183
184#principal #colonne_centrale .colonne_etroite .texte p {
185  text-indent: 1.4em;
186  padding: 0;
187  margin: 0;
188}
189
190#principal #colonne_centrale .colonne_etroite .texte p:first-child {
191  text-indent: 0;
192}
193
194#principal #colonne_centrale .colonne_etroite .liste_articles {
195  margin-top: 25px;
196}
197
198#principal #colonne_centrale .colonne_etroite .liste_articles .selection {
199  float: right;
200}
201
202#principal #colonne_centrale .text_description {
203  width: 440px;
204  text-align: justify;
205  font-family: arial, helvetica, sans-serif, sans;
206  line-height: 1.4em;
207  padding-top: 20px;
208}
209
210#principal #colonne_centrale .text_description p {
211  padding: 0;
212  margin: 0;
213  text-indent: 1.4em;
214}
215
216#principal #colonne_centrale .text_description p:first-child {
217  text-indent: 0;
218}
219
220#principal #colonne_centrale .texte_article {
221  text-align: justify;
222  font-family: arial, helvetica, sans-serif, sans;
223  font-size: 85%;
224  line-height: 160%;
225  padding-top: 50px;
226}
227
228#principal #colonne_centrale .texte_article .spip_documents {
229  font-size: 90%;
230  text-align: justify;
231}
232
233#principal #colonne_centrale .texte_article .spip_documents p {
234  padding: 0;
235}
236
237#principal #colonne_centrale .texte_article .spip_documents .spip_doc_titre {
238  text-align: left;
239  padding-top: 5px;
240}
241
242#principal #colonne_centrale .texte_article .spip_documents .spip_doc_descriptif {
243  width: auto;
244}
245
246#principal #colonne_centrale .texte_article p {
247  padding: 0;
248  margin: 0;
249  padding-top: 0.7em;
250  padding-bottom: 0.7em;
251  padding-right: 230px;
252}
253
254#principal #colonne_centrale .texte_article p .spip_documents_right {
255  margin-right: -230px;
256  padding-left: 30px;
257  padding-bottom: 20px;
258}
259
260#principal #colonne_centrale .texte_article ul.spip {
261  margin-right: 230px;
262  margin-top: 0;
263  padding-top: 0;
264  padding-bottom: 0;
265}
266
267#principal #colonne_centrale .texte_article ul.spip li {
268  padding-top: 1em;
269}
270
271#principal #colonne_centrale .texte_article ul.spip li:first-child {
272  padding-top: 0;
273}
274
275#principal #colonne_centrale .texte_article ul.spip ul {
276  margin-right: 0;
277}
278
279#principal #colonne_centrale .texte_article h3 {
280  margin-right: 230px;
281  padding-left: 30px;
282  padding-right: 30px;
283  font-family: arial, helvetica, sans-serif, sans;
284  font-weight: bold;
285  font-size: 120%;
286  color: #444444;
287}
288
289#principal #colonne_centrale .notes_article {
290  margin-top: 30px;
291  font-size: 80%;
292  padding-left: 30px;
293  padding-right: 230px;
294}
295
296#principal #colonne_centrale .notes_article .ouvre_note {
297  display: block;
298  float: left;
299  margin-left: -30px;
300}
301
302#principal #colonne_centrale .pave-liste-article {
303  margin-bottom: 50px;
304}
305
306#principal #colonne_centrale .pave-liste-article .lien_traduction {
307  font-size: 80%;
308  margin-left: 10px;
309}
310
311#principal #colonne_centrale .pave-liste-article .bloc-info-liste {
312  margin-bottom: 10px;
313}
314
315#principal #colonne_centrale .pave-liste-article .logo {
316  float: right;
317  padding-left: 20px;
318  padding-top: 5px;
319  padding-bottom: 5px;
320}
321
322#principal #colonne_centrale .pave-liste-article .bloc-info-lire {
323  font-size: 80%;
324  text-align: right;
325  padding-top: 7px;
326}
327
328#principal #colonne_centrale .pave-liste-article .bloc-info-lire a {
329  color: #e0e0e0;
330  background-color: #999;
331  padding: 2px;
332  padding-left: 5px;
333  padding-right: 5px;
334  -moz-border-radius: 5px;
335  -webkit-border-radius: 5px;                   
336  -moz-display: inline-box;
337  display: inline-block;
338  text-decoration: none;
339}
340
341#principal #colonne_centrale .pave-liste-article .bloc-info-lire a:hover {
342  background-color: #e0e0e0;
343  color: #666666;
344}
345
346#principal #colonne_centrale .pave-liste-article .bloc-info-rubrique {
347  font-size: 75%;
348  float: left;
349  padding-top: 7px;
350  color: #666666;
351}
352
353#principal #colonne_centrale .pave-liste-article .bloc-info-rubrique a {
354  font-weight: bold;
355}
356
357#principal #colonne_centrale .pave-liste-article .description-liste-article {
358  font-size: 80%;
359  text-align: justify;
360}
361
362#principal #colonne_centrale .pave-liste-article .description-liste-article p {
363  padding: 0;
364  margin: 0;
365  text-indent: 1.4em;
366}
367
368#principal #colonne_centrale .pave-liste-article .description-liste-article p:first-child {
369  text-indent: 0;
370}
371
372#principal #colonne_centrale .petit-titre-article {
373  cursor: pointer;
374  margin-bottom: 5px;
375}
376
377#principal #colonne_centrale .petit-titre-article a {
378  display: block;
379  float: left;
380  color: white;
381  height: 21px;
382  overflow: hidden;
383  padding-right: 5px;
384  background: url([(#CHEMIN{imgs/fond-petit-titre-droite.png}|image_sepia{#GET{couleur}}|extraire_attribut{src})]) right top no-repeat;
385}
386
387#principal #colonne_centrale .petit-titre-article a span {
388  display: block;
389  padding-left: 6px;
390  background: url([(#CHEMIN{imgs/fond-petit-titre-gauche.png}|image_sepia{#GET{couleur}}|extraire_attribut{src})]) left top no-repeat;
391}
392
393.coloration_code .cadre {
394  background-color: #f0f0f0;
395  padding: 10px;
396}
397
398.coloration_code .cadre ol {
399  margin: 0;
400  padding: 0;
401  padding-left: 30px;
402  font-family: verdana, arial, sans;
403  font-weight: bold;
404  color: #999999;
405  line-height: 1.1em;
406  font-size: 0.5em;
407}
408
409.coloration_code .cadre ol li {
410  margin: 0;
411  padding: 0;
412  border-bottom: 1px solid #eeeeee;
413  margin-bottom: 2px;
414  padding-bottom: 2px;
415  font-weight: normal;
416  text-align: left;
417}
418
419.coloration_code .cadre ol li:first-child {
420  border-top: 1px solid #eeeeee;
421  padding-top: 4px;
422}
423
424.coloration_code .cadre ol li div {
425  color: #444444;
426  font-size: 2.4em;
427  line-height: 1.2em;
428}
429
430.coloration_code .cadre_download a {
431  font-size: 0.9em;
432}
433
434/* Styles du pied de page */
435/* ---------------------- */
436#bandeau-bas {  padding-top: 15px; font-size: 0.8em; line-height:1.5em; color: white;
437                                background: url([(#CHEMIN{imgs/fond-bandeau-bas.gif})]) top left repeat-x; }
438#bandeau-bas .bloc-pied { padding-bottom: 1em; }
439#bandeau-bas .logo-site-spip { position: absolute; right: -3px; top: 10px; }
440#bandeau-bas a { color: #dddddd; }
441#bandeau-bas a:hover { color: white; }
442#bandeau-bas ul { padding-left: 15px; list-style-type: disc; }
443#bandeau-bas #site-utilise { position: absolute; top: 70px; right: 0; width: 237px; }
444#bandeau-bas #galaxie { position: absolute; top: 100px; left: 0; }
445#bandeau-bas #syndication { position: absolute; top: 5px; left: 230px; width: 360px; }
446#bandeau-bas #syndication h3 { margin-top: 10px; }
447
448
449#selection_spip {
450  padding-top: 30px;
451  float: right;
452  width: 200px;
453  text-align: center;
454}
455
456#selection {
457  border: 2px solid #ccc;
458  margin-bottom: 60px;
459  margin-top: 24px;
460  padding: 9px;
461  -moz-border-radius: 10px;
462  -webkit-border-radius: 10px; 
463  background-color: #f7f7f7;
464  background: url(#CHEMIN{imgs/fond-selection.gif}) bottom repeat-x;
465}
466
467#selection #titres_selection { float: left; width: 200px; font-size: 80%; }
468#selection #titres_selection a.lien-selection {
469  display: block;
470  width: 160px;
471  padding-top: 2px;
472  margin-top: 2px;
473  padding-left: 20px;
474  text-decoration: none;
475  color: #999;
476}
477
478#selection #titres_selection a.lien-selection:hover { color: #444;}
479
480#selection #titres_selection a.lien-selection-on {
481  background: url([(#CHEMIN{imgs/check-valid.gif})]) left 2px no-repeat;
482  color: black;
483  font-weight: bold;
484}
485
486#selection #titres_selection a.lien-selection-on:hover { color: black; }
487#selection #slide_selection .pave-liste-article-section { margin-bottom: 0; }
488
489
490#cadre-extra {
491        font-size: 0.8em;
492        line-height:1.5em;
493        border-top: 1px solid #[(#GET{couleur}|couleur_foncer)];
494        background-color: #[(#GET{couleur})];
495        color: #[(#GET{couleur}|couleur_extreme|couleur_inverser)]
496}
497
498
499/* --------------------------------- */
500/* plugins.spip.net version SVP 2011 */
501/* --------------------------------- */
502
503/* mise en page */
504
505.conteneur_page { position: relative;  width: 900px;  margin: auto;}
506#principal { min-height: 300px;  padding-bottom: 57px; background-color: #fff; }
507#principal #colonne_centrale { position: relative; width: 670px; float: right; padding-top: 55px;
508        font-family: arial, helvetica, sans-serif, sans; line-height: 1.4em; }
509#principal #colonne_navigation { width: 200px; padding-top: 150px; vertical-align: top; display: inline-block; -moz-display: inline-box; }
510
511.page_sommaire #principal { background-color: #ddd; }
512.page_plugins #principal { background-color: #eee; }
513 
514
515/* page plugin */
516
517#colonne_centrale #logo-article { width: 230px; position: absolute; top: 50px; left: -230px; text-align: center; }
518.page_plugin #hierarchie { display:none; }
519
520h1 { color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
521h1.titre_article { margin: 0 0 30px; }
522h1.titre_article img { padding:3px 10px 0; background: #666;
523        -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; }
524.titre_categorie { display: block; margin: -30px 0 0; padding: 0; color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
525.page_plugin .contenu-principal .texte {  }
526
527.paquet { position: relative; font-size: 85%; }
528.paquet .h2 { padding-right: 120px; color: #666; font-size: 150%; }
529.paquet .telechargement { position: absolute; top: 0; right: 0; font-size: 125%; }
530.paquet .telechargement a { margin: 0; padding: 4px 4px 4px 20px; text-decoration: none; color: white;
531        background: #[(#GET{couleur})] url([(#CHEMIN{imgs/fleche-bas-blanc.gif})]) 6px center no-repeat;
532        -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius : 5px; }
533.paquet .bloc_infos { overflow: hidden; margin-left: 0; font-size: 90%; color: #666; }
534.paquet .bloc_infos a { color: #666; }
535.paquet .bloc_infos a:hover { color: #000; }
536.paquet .bloc_infos dt { float: left; clear: right; width: 30%; margin: 0 ; padding: 3px 0; font-weight: bold; }
537.paquet .bloc_infos dd { float: right; width: 60%; margin: 0 ; padding: 3px 0; }
538.paquet .meta-publi { margin-top: 2px; }
539.paquet .meta-publi a { padding: 4px; background-color: #e0e0e0; color: #666; text-decoration: none;
540        -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius : 5px; }
541.paquet .meta-publi a:hover { color: #000; }
Note: See TracBrowser for help on using the repository browser.