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

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

un peu de style pour la page login

File size: 18.3 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; display: none; }
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_centrale #articles_presentation {
68  position: absolute;
69  top: 5px;
70  right: 200px;
71  width: 700px;
72  text-align: right;
73  margin: 0;
74  padding: 0;
75  list-style-type: none;
76  font-size: 0.8em;
77}
78
79#principal #colonne_centrale #articles_presentation li {  display: inline;  padding-left: 10px;}
80#principal #colonne_centrale #articles_presentation li a {  text-decoration: none;}
81#principal #colonne_centrale #articles_presentation li a:hover {  color: black;}
82
83#principal #colonne_centrale #choix_version {
84  float: right;
85  width: 180px;
86  border: 1px solid #ccc;
87  -moz-border-radius: 10px;
88  -webkit-border-radius: 10px; 
89  background-color: #f7f7f7;
90  background: url(#CHEMIN{imgs/fond-selection.gif}) bottom repeat-x;
91  padding: 9px;
92  margin: 0;
93  margin-right: -230px;
94  font-size: 80%;
95  list-style-type: none;
96}
97
98#principal #colonne_centrale #choix_version .sel_choix_version {  padding-top: 2px;  padding-left: 20px;  line-height: 1.1em;}
99#principal #colonne_centrale #choix_version .sel_choix_version a {  text-decoration: none;}
100
101#principal #colonne_centrale #choix_version .sel_choix_version_actif {
102  font-weight: bold;
103  padding-left: 20px;
104  background: url([(#CHEMIN{imgs/check-valid.gif})]) left 2px no-repeat;
105}
106
107#principal #colonne_centrale #choix_version .sel_choix_version_actif a {  color: black;}
108
109#principal #colonne_centrale .colonne_etroite {
110  padding-right: 230px;
111}
112
113#principal #colonne_centrale .colonne_etroite .texte {
114  margin-top: 25px;
115  line-height: 1.4em;
116  text-align: justify;
117  color: #444444;
118}
119
120#principal #colonne_centrale .colonne_etroite .texte p {
121  text-indent: 1.4em;
122  padding: 0;
123  margin: 0;
124}
125
126#principal #colonne_centrale .colonne_etroite .texte p:first-child {
127  text-indent: 0;
128}
129
130#principal #colonne_centrale .colonne_etroite .liste_articles {
131  margin-top: 25px;
132}
133
134#principal #colonne_centrale .colonne_etroite .liste_articles .selection {
135  float: right;
136}
137
138#principal #colonne_centrale .text_description {
139  width: 440px;
140  text-align: justify;
141  font-family: arial, helvetica, sans-serif, sans;
142  line-height: 1.4em;
143  padding-top: 20px;
144}
145
146#principal #colonne_centrale .text_description p {
147  padding: 0;
148  margin: 0;
149  text-indent: 1.4em;
150}
151
152#principal #colonne_centrale .text_description p:first-child {
153  text-indent: 0;
154}
155
156#principal #colonne_centrale .texte_article {
157  text-align: justify;
158  font-family: arial, helvetica, sans-serif, sans;
159  font-size: 85%;
160  line-height: 160%;
161  padding-top: 50px;
162}
163
164#principal #colonne_centrale .texte_article .spip_documents {
165  font-size: 90%;
166  text-align: justify;
167}
168
169#principal #colonne_centrale .texte_article .spip_documents p {
170  padding: 0;
171}
172
173#principal #colonne_centrale .texte_article .spip_documents .spip_doc_titre {
174  text-align: left;
175  padding-top: 5px;
176}
177
178#principal #colonne_centrale .texte_article .spip_documents .spip_doc_descriptif {
179  width: auto;
180}
181
182#principal #colonne_centrale .texte_article p {
183  padding: 0;
184  margin: 0;
185  padding-top: 0.7em;
186  padding-bottom: 0.7em;
187  padding-right: 230px;
188}
189
190#principal #colonne_centrale .texte_article p .spip_documents_right {
191  margin-right: -230px;
192  padding-left: 30px;
193  padding-bottom: 20px;
194}
195
196#principal #colonne_centrale .texte_article ul.spip {
197  margin-right: 230px;
198  margin-top: 0;
199  padding-top: 0;
200  padding-bottom: 0;
201}
202
203#principal #colonne_centrale .texte_article ul.spip li {
204  padding-top: 1em;
205}
206
207#principal #colonne_centrale .texte_article ul.spip li:first-child {
208  padding-top: 0;
209}
210
211#principal #colonne_centrale .texte_article ul.spip ul {
212  margin-right: 0;
213}
214
215#principal #colonne_centrale .texte_article h3 {
216  margin-right: 230px;
217  padding-left: 30px;
218  padding-right: 30px;
219  font-family: arial, helvetica, sans-serif, sans;
220  font-weight: bold;
221  font-size: 120%;
222  color: #444444;
223}
224
225#principal #colonne_centrale .notes_article {
226  margin-top: 30px;
227  font-size: 80%;
228  padding-left: 30px;
229  padding-right: 230px;
230}
231
232#principal #colonne_centrale .notes_article .ouvre_note {
233  display: block;
234  float: left;
235  margin-left: -30px;
236}
237
238.coloration_code .cadre {
239  background-color: #f0f0f0;
240  padding: 10px;
241}
242
243.coloration_code .cadre ol {
244  margin: 0;
245  padding: 0;
246  padding-left: 30px;
247  font-family: verdana, arial, sans;
248  font-weight: bold;
249  color: #999999;
250  line-height: 1.1em;
251  font-size: 0.5em;
252}
253
254.coloration_code .cadre ol li {
255  margin: 0;
256  padding: 0;
257  border-bottom: 1px solid #eeeeee;
258  margin-bottom: 2px;
259  padding-bottom: 2px;
260  font-weight: normal;
261  text-align: left;
262}
263
264.coloration_code .cadre ol li:first-child {
265  border-top: 1px solid #eeeeee;
266  padding-top: 4px;
267}
268
269.coloration_code .cadre ol li div {
270  color: #444444;
271  font-size: 2.4em;
272  line-height: 1.2em;
273}
274
275.coloration_code .cadre_download a {
276  font-size: 0.9em;
277}
278
279/* Styles du pied de page */
280/* ---------------------- */
281#bandeau-bas { padding-top: 15px; font-size: 70%; line-height: 1.5em; color: white;
282        background: url([(#CHEMIN{imgs/fond-bandeau-bas.gif})]) top left repeat-x; }
283#bandeau-bas .bloc-pied { padding-bottom: 1em; }
284#bandeau-bas .logo-site-spip { position: absolute; right: -3px; top: 10px; }
285#bandeau-bas a { color: #dddddd; }
286#bandeau-bas a:hover { color: white; }
287#bandeau-bas ul { padding-left: 15px; list-style-type: disc; }
288#bandeau-bas #site-utilise { position: absolute; top: 70px; right: 0; width: 237px; }
289#bandeau-bas #galaxie { position: absolute; top: 100px; left: 0; }
290#bandeau-bas #syndication { position: absolute; top: 5px; left: 230px; width: 360px; }
291#bandeau-bas #syndication h3 { margin-top: 10px; }
292
293
294#selection_spip {
295  padding-top: 30px;
296  float: right;
297  width: 200px;
298  text-align: center;
299}
300
301
302/* --------------------------------- */
303/* plugins.spip.net version SVP 2011 */
304/* --------------------------------- */
305
306/* mise en page */
307
308.conteneur_page { position: relative;  width: 900px;  margin: auto;}
309#principal { min-height: 300px;  padding-bottom: 57px; background-color: #fff; }
310#principal #colonne_centrale { position: relative; width: 670px; float: right; padding-top: 55px;
311        font-family: arial, helvetica, sans-serif, sans; line-height: 1.4em; }
312#principal #colonne_navigation { width: 200px; padding-top: 150px; vertical-align: top; display: inline-block; -moz-display: inline-box; }
313
314h1 { margin: 0; padding: 0; color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
315.minititre { margin-bottom: 5px; overflow: hidden; }
316.minititre span { display: block; float: left; padding: 0 4px 0 6px; height: 21px; overflow: hidden; background-color: [#(#GET{couleur})];
317  -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius : 5px; }
318<BOUCLE_minititres(DATA){source table,#SVP_CATEGORIES}>
319.categorie_[(#CLE)] span { background-color: [#(#CLE|categorie2couleur)]; }
320</BOUCLE_minititres>
321
322.pagination .sep { display: none; }
323.pagination { padding: 3px; margin: 3px; text-align: center; font-size: 90%; }
324.pagination .lien_pagination,
325.pagination .on { padding: 2px 5px 2px 5px; margin-right: 5px; border: 1px solid #ddd; text-decoration: none; color: #666; }
326.pagination .lien_pagination:hover,
327.pagination .lien_pagination:active { border: 1px solid #a0a0a0; }
328.pagination .on { border-color: #e0e0e0; font-weight: bold; background-color: #e0e0e0; }
329
330/* navigation des categories */
331
332#colonne_navigation ul { margin: 0; padding: 0; list-style-type: none; font-size: 70%; line-height: 1.1em; }
333#colonne_navigation ul li a { display: block; overflow: hidden; width: 159px; height: 39px; margin-bottom: 0;
334        padding: 7px 15px 4px 4px; color: #555; text-decoration: none;
335        background: transparent url([(#CHEMIN{imgs/fond-nav-rectangle.png}|image_sepia{f3f3f3}|extraire_attribut{src})]) right center no-repeat; }
336#colonne_navigation ul li a span.numero { display: block; float: left; width: 40px; margin: 2px 0 0; padding: 0;
337        text-align: right; font-size: 42px; line-height: 31px; font-family: arial, helvetica, sans-serif, sans; color: #ddd; }
338#colonne_navigation ul li a span.intitule { display: block; padding-left: 52px; }
339#colonne_navigation ul li a:hover { color: #fff;
340        background: transparent url([(#CHEMIN{imgs/fond-nav-simple.png}|image_sepia{aaaaaa}|extraire_attribut{src})] ) right center no-repeat; }
341#colonne_navigation ul li a:hover span.numero { color: #666; }
342#colonne_navigation ul li a.on { color: #fff; text-decoration: none; font-weight: bold;
343        background: transparent url([(#CHEMIN{imgs/fond-nav-relief.png}|image_sepia{[(#GET{coul_nav})]}|extraire_attribut{src})] ) right center no-repeat; }
344#colonne_navigation ul li a.on span.numero { font-weight: normal; color: #fff; }
345#colonne_navigation ul li a.on:hover {
346  background: transparent url([(#CHEMIN{imgs/fond-nav-relief.png}|image_sepia{[(#GET{coul_nav}|couleur_foncer)]}|extraire_attribut{src})] ) right center no-repeat; }
347
348/* page plugin */
349
350#colonne_centrale #logo-article { width: 230px; position: absolute; top: 50px; left: -230px; text-align: center; }
351
352h1.titre_article { margin: 0 0 30px; }
353h1.titre_article img { padding: 3px 10px 0; background: #666;
354        -moz-border-radius : 12px; -webkit-border-radius : 12px; border-radius : 12px; }
355.titre_categorie { display: block; margin: -30px 0 0; padding: 0; color: #[(#GET{couleur}|couleur_foncer_si_claire)]; }
356.page_plugin .contenu-principal .texte {  }
357.page_plugin .contenu-principal .cartouche .info-publi { margin: -25px 0 0; font-size: 85%; color: #666; }
358
359.paquet { position: relative; font-size: 85%; }
360.paquet .h2 { padding-right: 120px; color: #666; font-size: 150%; }
361.paquet .telechargement { position: absolute; top: 0; right: 0; font-size: 125%; }
362.paquet .telechargement a { margin: 0; padding: 4px 4px 4px 20px; text-decoration: none; color: white;
363        background: #[(#GET{couleur})] url([(#CHEMIN{imgs/fleche-bas-blanc.gif})]) 6px center no-repeat;
364        -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius : 5px; }
365.paquet .bloc_infos { overflow: hidden; margin-left: 0; font-size: 90%; color: #666; }
366.paquet .bloc_infos a { color: #666; }
367.paquet .bloc_infos a:hover { color: #000; }
368.paquet .bloc_infos dt { float: left; clear: right; width: 30%; margin: 0 ; padding: 3px 0; font-weight: bold; }
369.paquet .bloc_infos dd { float: right; width: 60%; margin: 0 ; padding: 3px 0; }
370
371.meta-publi { margin-top: 2px; }
372.meta-publi a { padding: 4px; background-color: #e0e0e0; color: #666; text-decoration: none;
373        -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius : 5px; }
374.meta-publi a:hover { color: #000; }
375
376/* page plugins / categorie */
377
378.page_plugins #principal { background-color: #eee; }
379.page_plugins .paquets { width: 70%; }
380.page_plugins .paquets .paquet { margin-bottom: 50px; }
381.paquet .logo { float: right; padding: 5px 0 5px 20px; }
382.page_plugins .paquets .paquet .slogan { margin-top: 20px; text-align: justify; color: #444; }
383.page_plugins .paquets .paquet .bloc_infos { margin-bottom: 15px; }
384.page_plugins .paquets .paquet .meta-publi { text-align: right; }
385
386/* page sommaire */
387
388.page_sommaire #principal { background-color: #ddd; }
389.page_sommaire .cartouche .h1 { margin-left: -230px; }
390.page_sommaire .h2 { font-size: 118%; color: #666; }
391.page_sommaire .liste { font-size: 85%; color: #444; }
392.page_sommaire .liste .liste-items { margin: 0; padding: 0; list-style: none; }
393.page_sommaire #principal #colonne_centrale .last { margin-right: 0; }
394.page_sommaire #selection { float: none; margin: 24px 0;  padding: 9px; overflow: hidden;
395        border: 2px solid #ccc; background: #f7f7f7 url(#CHEMIN{imgs/fond-selection.gif}) bottom repeat-x;
396        -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius : 10px; }
397.page_sommaire #selection .h2 { margin: 0; }
398.page_sommaire #selection #titres_selection { float: left; width: 200px; }
399.page_sommaire #selection #titres_selection a.lien-selection { display: block; width: 160px; padding: 2px 0 0 20px;
400        margin-top: 2px; text-decoration: none; color: #999; }
401.page_sommaire #selection #titres_selection a.lien-selection:hover { color: #444; }
402.page_sommaire #selection #titres_selection a.lien-selection-on { font-weight: bold; color: black;
403        background: url([(#CHEMIN{imgs/check-valid.gif})]) left 6px no-repeat; }
404.page_sommaire #selection #titres_selection a.lien-selection-on:hover { color: black; }
405.page_sommaire #selection #conteneur_selection { float: left; width: 440px; overflow: hidden; }
406.page_sommaire #selection #conteneur_selection #slide_selection { width: 4400px; }
407.page_sommaire #selection #conteneur_selection .liste-items .item { float: left; width: 440px; overflow: hidden; margin-bottom: 10px; font-size: 100%; }
408.page_sommaire #selection .liste-items .item .bloc_infos { margin-top: 10px; font-size: 90%; }
409.page_sommaire #selection .liste-items .item .bloc_infos dt { font-weight: bold; color: #666; }
410.page_sommaire #selection .liste-items .item .bloc_infos dd { margin: 0; }
411.page_sommaire #selection .liste-items .item .meta-publi { text-align: right; }
412.page_sommaire #selection .liste-items .item .meta-publi a { color: #e0e0e0; background: #999; }
413.page_sommaire #selection .liste-items .item .meta-publi a:hover { color: #666; background: #e0e0e0; }
414.page_sommaire .resume { width: 30%; float: left; margin-right: 32px; }
415.page_sommaire .resume .liste-items .item { overflow: hidden; border-bottom: 1px dotted #ababab; }
416.page_sommaire .resume .liste-items .item a { display: block; position: relative; padding: 0 5px 0 50px;
417        text-decoration: none; color: #444; }
418.page_sommaire .resume .liste-items .item a img.logo { position: absolute; left: 5px; top: 6px; padding: 4px;
419        background: #ddd; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius : 4px;  }
420.page_sommaire .resume .liste-items .item a:hover img.logo { background: #f3f3f3; }
421.page_sommaire .resume .liste-items .item span { display: block; }
422.page_sommaire .resume .liste-items .item .titre { height: 1.45em; overflow: hidden; padding: 8px 0 0;
423        font-weight: bold; color: #666; }
424
425/* page telechargements */
426
427.page_telechargements #colonne_centrale .h3,
428.page_telechargements #colonne_centrale .h4 { color: #666; }
429.page_telechargements #colonne_centrale .liste-items { margin: 0; padding: 0; list-style: none; }
430.page_telechargements #colonne_centrale .liste-items .item { padding: 10px 0; border-bottom: 1px dotted #ababab; }
431.page_telechargements #colonne_centrale .liste-items .item .h4 { margin: 5px 0; font-size: 85%; }
432.page_telechargements #colonne_centrale .liste-items .item .paquet { margin-bottom: 5px; }
433
434/* page login */
435
436.page_login #principal { background-color: #ddd; }
437.page_login #principal #colonne_centrale { float: none; width: 400px; margin: 0 auto; }
438.page_login #principal #colonne_centrale #hierarchie { display: none; }
439.page_login #principal #colonne_centrale .cartouche { text-align: center; color: #666; }
440.page_login #principal #colonne_centrale .formulaire_menu_lang { margin: 10px 0; }
441.page_login #principal #colonne_centrale .formulaire_login { padding: 10px; background: #fff; border: 1px solid #aaa; }
442.page_login #principal #colonne_centrale .formulaire_login fieldset { border: 0; }
443.page_login #principal #colonne_centrale .formulaire_login ul { margin: 0; padding: 0; list-style: none; }
444.page_login #principal #colonne_centrale .formulaire_login .boutons { text-align: right; }
445
446/* cadre extra et pied de page */
447
448#cadre-extra { overflow: hidden; border-top: 1px solid #[(#GET{couleur}|couleur_foncer)];
449        background-color: #[(#GET{couleur})]; color: #[(#GET{couleur}|couleur_extreme|couleur_inverser)];
450        font-size: 0.8em; font-family: arial, helvetica, sans-serif, sans; line-height: 1.5em; }
451#cadre-extra .liste { float: left; width: 48%; margin: 10px 0 20px; }
452#cadre-extra .liste:first-child { margin-right: 20px; }
453#cadre-extra .liste .liste-items { margin: 0; padding: 0 0 0 15px; }
454#cadre-extra a { color: #[(#GET{couleur}|couleur_extreme|couleur_inverser)]; }
Note: See TracBrowser for help on using the repository browser.