source: extensions/sobre/branches/1.4/theme.css @ 9352

Last change on this file since 9352 was 9352, checked in by Gotcha, 13 years ago

Beter integration with Facebook plugin (transparency at home)
Beter align with SortOrder
Beter display for tags cloud

File size: 12.1 KB
Line 
1/* Valide CSS3 http://jigsaw.w3.org/css-validator/validator */
2/* Compressé avec http://www.cleancss.com/ (musclé !) */
3/* Nom du fichier avant compression : theme.bak.css */
4/* Nom du fichier après compression : theme.css*/
5
6
7
8
9/* MERCI DE NE PAS TOUCHER A CE FICHIER */
10
11
12
13
14
15
16/* Importation de feuilles de styles additionnelles */
17@import "slider.css";
18
19/* Le header */
20/* Fonctionne avec l'administration du thème*/
21/* Désactivé par défaut */
22#theHeader {
23        background: transparent url("../../themes/sobre/images/header.png") no-repeat center bottom;
24    height: 144px;
25        margin: 0 auto;
26}
27#theHeader H1 {
28    margin-top: 0px;
29}
30#theHeader p {
31  margin-top:72px;
32}
33
34/* Centrage en une seule colonne */
35body {
36margin: 0 auto;
37max-width: 1190px;
38min-width: 980px;
39}
40
41/* Couleurs des textes */
42BODY, H1, H3,
43INPUT.rateButtonSelected  { /* <= why IE doesn't inherit this ? */
44        color:#d0d0d0;
45}
46H2, #menubar DT {
47        color: #fff48e;
48}
49A, INPUT.rateButton {
50        color: #fff;
51        border: none;
52}
53A:hover {
54        color: #FFF48E;
55}
56#copyright {
57        color: #000000;
58}
59#copyright a {
60        color: #FF7700;
61}
62
63/* Arrières plans */
64BODY, H3, #imageBar, #imageToolBar A:hover {
65        background: #393737
66}
67BODY {
68background: #EAEAEA url(images/background-0.png) repeat-x top;
69}
70H2 {
71        background-image: url(images/tableh1_bg.png);
72        color: #fff48e;
73}
74#imageHeaderBar H2 {
75        background-image: none;
76        background-color: transparent;
77        border: none;
78}
79#imageHeaderBar {
80        background-image: url(images/tableh2_bg.png);
81        background-repeat: repeat-x;
82        background-position: center;
83        border-top: 1px solid #000;
84}
85.content, #imageToolBar, .header_notes {
86        background-color: black;
87}
88#imageToolBar {
89        background-color:#505050;
90}
91
92/* Bordures */
93.content{
94        border: 1px solid #252525;
95        margin: 0;
96}
97H2, #imageToolBar {
98        border-bottom: 1px solid #000;
99}
100FIELDSET, INPUT, SELECT, TEXTAREA,
101.content DIV.thumbnailCategory {
102        border: 1px solid gray;
103}
104.content UL.thumbnails SPAN.wrap2 {
105        border: 1px solid #aaaaaa;      /* thumbnails border color and style */
106}
107.content UL.thumbnails SPAN.wrap2:hover,
108.content UL.thumbnailCategories DIV.thumbnailCategory:hover,
109.content UL.thumbnailCategories DIV.thumbnailCategory:hover A {
110        background-color: #faebd7;
111        border-color: yellow;   /* thumbnails border color when mouse cursor is over it */
112        color: black;
113}
114#thePicturePage {
115        border:1px solid white;
116}
117
118/* Les polices */
119h2 {
120        font-family:Mon-menu;
121        font-size:18px;
122        font-style:italic;
123        font-weight:normal;
124}
125.content ul.thumbnails span.thumbLegend {
126        height: 100%;
127}
128.content div.thumbnailCategory div.description div.text p {
129  font-family:Trebuchet MS;
130}
131.stuffs_block {
132  font-family:Comic Sans MS;
133}
134
135/* Plugin PWG_Stuff, permet d'afficher les derniers commentaires sur 2 colonnes. */
136.content #comments ul.thumbnailCategories li {
137  width:49.9%;
138}
139
140/* Affichage des tags avec le plugin Cumulus cloud tags */
141.tagLetter table.tagLetterContent {
142  font-size:100%;
143}
144
145/* Modifications pour RV Mpas & Earth */
146#theImage #mapPicture {
147  width: 280px;
148}
149#theImage #map {
150height:600px;
151min-height:512px;
152position: relative;
153background-color: rgb(229, 227, 223);
154left: 290px;
155right: -290px;
156margin-right: 290px;
157}
158
159/* Plugin Whois Online */
160.Online {
161        font-size: 11px;
162        color: #444444;
163}
164.Online a {
165        color: black;
166}
167
168/* Centrage modifications de la caractéristique de la catégorie. */
169.content div.thumbnailCategory div.description div.text p.Nb_images {
170  border-top:1px solid #808080;
171  color:#FF9960;
172  font-style:italic;
173  text-align:center;
174}
175
176/* Centrage modifications du nom de la catégorie. */
177.content div.thumbnailCategory div.description h3 {
178  font-weight: bold;
179  text-align:center;
180}
181
182/* Modifications de la description de la catégorie. */
183.content div.thumbnailCategory div.description div.text p {
184  color:#996060;
185}
186
187/* Correction du centrage de la miniature */
188.content div.thumbnailCategory div.illustration {
189  text-align: center;
190  margin: 2px;
191}
192
193/* Plus de place pour le texte des catégories */
194.content ul.thumbnails span.wrap2, .content div.thumbnailCategory div.description  {
195        height: 190px;
196}
197.content div.thumbnailCategory div.description .text {
198        text-align: justify;
199        padding-right:5px;
200}
201.content div.thumbnailCategory div.description {
202        height:100%;
203}
204
205/* Correction de l'affichage de la liste des tags */
206ul.tagSelection {
207        width:100%;
208}
209ul.tagSelection li{
210        float:left;
211        width:150px!important;
212        overflow:hidden;
213}
214
215/* Tips pour picture.tpl */
216#theImage img {
217        margin-top: 10px;
218}
219#theImage p {
220        color: #000;
221        font-style:italic;
222        margin:10px auto auto;
223        position:relative;
224        width:800px;
225}
226#linkPrev, #linkNext {
227        display: none;
228}
229/* Mise en page du tableau */
230TABLE.infoTable {
231  width:920px;
232  background: #505050;
233  border: solid 1px;
234  margin-top: 6px;
235}
236TABLE.infoTable .label {
237  background-color: #2F0000;
238  font-weight: bold;
239  text-align: left;
240  padding-right: 0.5em;
241  padding-left: 3px;
242  width: 100px;
243}
244TABLE.infoTable .value p {
245  width: 320px;
246  margin: 0px;
247}
248TABLE.infoTable .value {
249  max-width: 320px;
250}
251TABLE.infoTable .value p a, input.rateButton {
252border-width:0;
253color:#FF7700;
254}
255/* Modification de zone de commentaires */
256#comments fieldset {
257    width: 910px;
258        margin: auto;
259        padding: 0;
260        background-color: #F0F0F0;
261        color: black;
262}
263#comments fieldset legend {
264        margin-left: 10px;
265        background: #F0F0F0;
266}
267#thePicturePage form.filter fieldset ul, #thePicturePage form.filter fieldset label {
268        display:block;
269        float:none;
270        margin-right:0;
271        padding:0;
272}
273table.commentr {
274        margin-top: -20px;
275        margin-bottom: -10px;
276}
277table.commentr td.center {
278        height: 138px;
279}
280#outils {
281        padding-top: 17px;
282}
283form.filter input[type="submit"] {
284        margin-top:0;
285}
286form fieldset p {
287        margin-top:0;
288}
289#comments  {
290        border-width:0;
291        padding:5px;
292    padding-bottom: 13px;
293        width: 910px;
294        margin: 0 auto;
295        background-color: #505050;
296}
297#theImage table {
298        background-color: #D3D3D3;
299        border:1px solid #000;
300        width: 800px;
301        margin:10px auto 0;
302}
303#comments h3 {
304        margin:14px -5px;
305        padding:0 7px;
306}
307#comments table tbody tr td  select {
308        width: 95px;
309}
310#comments SPAN.author {
311        font-weight:bold;
312}
313#comments blockquote {
314        border-color:black;
315        border-style:solid;
316        border-width:0 0 0 2px;
317        padding-left:5px;
318        font-style:italic;
319}
320form.filter fieldset ul, form.filter fieldset label {
321        padding-top: 5px;
322        padding-left: 5px;
323}
324
325/* Tip pour la page d'accueil */
326/* Concerne PWG_Stuffs */
327/* A adapter */
328#stuffs_block_3 #comments {
329        width: 100%;
330}
331
332/*
333Petite bidouille pour le panneau de connection en haut du site avec PWG_Stuffs
334#stuffs_block_2 form.properties span.property {
335  width: 150px;
336  text-align: left;
337}
338*/
339
340/* Modification pûrement visuel et esthétique modifiant l'affichage de l'enveloppe sous une miniature nouvelle */
341.content ul.thumbnails span.thumbLegend img {
342  position:relative; top:-3px;
343}
344
345/* Tip personnel pour un bloc */
346/* Utilisez PWG_Stuffs */
347/* Bloc privé */
348#stuffs_block_10 div.personal_block{
349display:none;
350}
351#stuffs_block_10:hover div.personal_block{
352display:block;
353}
354
355/* Pour IE et Chrome surtout */
356.content ul.thumbnailCategories {
357width: 99%; /* Peut être à 100% */
358padding-left: 4px; /* Correction du centrage du cadre de la catégorie */
359}
360
361
362
363
364
365/* Modifications de la tailles des miniatures. L'expemple ci-dessous suppose une taille de 200px de coté pour les miniatures.*/
366/* A vous d'adapter en fonction de vos propres miniatures et choix esthétique.*/
367
368.content DIV.thumbnailCategory DIV.description {
369        padding-left: 0px                    /* For Sylvia theme only */
370}
371.content div.thumbnailCategory div.illustration {
372        text-align:center;
373}
374.content div.thumbnailCategory div.illustration { 
375        width:170px;                      /* Usable range 162px-360px , optimal : Thumbnail width + 10px */
376        margin-top:19px;
377}
378.content div.thumbnailCategory { 
379        height: 200px;                    /* Usable range 172px-250px , optimal : Thumbnail height + 10px */ /* For Slyvia theme, Thumbnail height + 40px */
380}
381.content div.thumbnailCategory div.description .text { 
382        height: 110px;                   /* Optimal : Thumbnail height - 50px */ 
383}
384#comments div.thumbnailCategory div.illustration { 
385        width: 255px;                    /* Usable range 219px-360px , optimal : Thumbnail width + 95px */ 
386}
387.content ul.thumbnails span,
388.content ul.thumbnails span.wrap2 a,
389.content ul.thumbnails label {
390        width: 170px;                        /* Optimal : Thumbnail width + 10px */ 
391}
392.content ul.thumbnails span.wrap2, .content div.thumbnailCategory div.description  {
393height:170px;
394}
395
396/* Set defaults for thumbnails legend ( modifie le nbre de ligne sous les vignettes)*/
397#content UL.thumbnails SPAN.thumbLegend {
398  display: block;    /* display: none; if you don't want legend */
399  height: 5em;        /* legend height (don't set auto to be Gecko friendly)*/
400}
401
402.content ul.categoryActions img {
403margin:2px 0 0;
404}
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423#menubar {
424height:2.1em;
425margin:-2px auto 3px;
426position:relative;
427width:980px;
428z-index:2;
429padding-bottom:25px;
430display:block;
431float:none;
432}
433
434#menubar #menuTagCloud a {
435display:inline;
436border:none;
437}
438
439#menubar #menuTagCloud span {
440display:inline-block;
441padding: 0;
442margin: 5px;
443text-align:left;
444}
445
446#menubar .button {
447border:medium none;
448float:right;
449left:95%;
450list-style-image:none;
451list-style-position:outside;
452list-style-type:none;
453margin:-2px 2px 2px;
454padding:0;
455position:absolute;
456text-align:center;
457text-indent:0;
458width:auto;
459}
460
461#menubar a,#menubar dt a,#menubar dd a {
462border:0;
463color:#fff;
464display:block;
465text-decoration:none;
466}
467
468#menubar a,#menubar dt,div#menubar dl:hover dd,div#menubar ul li:hover ul,div#menubar ul ul li:hover ul,div#menubar ul ul ul li:hover ul,div#menubar ul ul ul ul li:hover ul,div#menubar ul ul ul ul ul li:hover ul {
469display:block;
470}
471
472#menubar a:hover,#menubar dt:hover {
473color:#fff;
474}
475
476#menubar dd {
477background:#333;
478border:1px solid #8c8c8c;
479position:absolute;
480text-align:left;
481z-index:500;
482margin-top: -5px;
483width:25%;
484}
485
486#menubar dd a {
487padding:0.5em;
488border:1px solid #3F3F3F;
489}
490
491#menubar dd a:hover {
492background-color:#333;
493border:1px solid #8c8c8c;
494color:#FFF;
495font-style:italic;
496}
497
498#menubar dd ul ul {
499background-color:#fff;
500border:1px solid #8c8c8c;
501left:100%;
502position:absolute;
503top:0;
504z-index:500;
505}
506
507#menubar dl {
508display:inline;
509height:25px;
510text-align:center;
511width:25%;
512}
513
514#menubar dl dd p {
515margin: 0;
516padding:0 0 10px;
517}
518
519#menubar dt {
520background-image:url("images/tableh1_bg.png");
521border:0;
522color:#fff48e;
523}
524
525#menubar li {
526position:relative;
527}
528
529#menubar li a {
530background:#3f3f3f none repeat scroll 0 0;
531}
532
533#menubar li span {
534right:7px;
535}
536
537#menubar li span,#menubar li IMG {
538padding-left:4px;
539position:absolute;
540top:7px;
541}
542
543#menubar img.button {
544margin-right:17px;
545display:none;
546}
547
548#menubar li span.bullet,div#menubar dd,div#menubar ul ul,div#menubar ul li:hover ul ul,div#menubar ul ul li:hover ul ul,div#menubar ul ul ul li:hover ul ul,div#menubar ul ul ul ul li:hover ul ul {
549display:none;
550}
551
552#menubar li:hover {
553background:#3f3f3f;
554}
555
556#menubar p,#menubar p.totalimages,#menubar p,#menubar p.totalimages,form#quickconnect {
557clear:both;
558margin:0;
559padding:0.2em;
560text-align:center;
561}
562
563#menubar ul {
564width:20em;
565}
566
567#menubar ul li a {
568margin-left:25px;
569padding-right:3em;
570}
571
572#menubar ul,#menubar dl,#menubar ul#menuTagCloud {
573float:left;
574list-style:none;
575margin:0;
576padding:0;
577}
578
579#menubar ul,#menubar li {
580background:#333 none repeat scroll 0 0;
581}
582
583#menubar ul.rvTree ul {
584padding-left:0 !important;
585}
586
587body#theadminpage #menubar {
588border:none;
589display:block;
590float:none;
591margin:5px auto;
592width:898px;
593}
594
595form#quickconnect .button {
596left:50px;
597position:relative;
598top:-20px;
599}
600
601form#quickconnect fieldset {
602padding-top:5px;
603text-align:left;
604width:19em;
605}
606
607form#quickconnect label {
608clear:left;
609}
610
611form#quickconnect label input {
612font-size:1em;
613}
614
615form#quickconnect p,form#quickconnect a {
616border:none;
617padding:0;
618}
619
620form#quicksearch {
621border-bottom:1px solid #000;
622padding:0 0 0 15px;
623}
624
625
626
627
628/* Scroll to top */
629#scrolltotop {
630  bottom:14px;
631  position:fixed;
632  right:0;
633  z-index:1000;
634  opacity:0;
635  outline:none;
636}
637#scrolltotop a {
638  background-color:transparent;
639  background-image: url("images/top.gif");
640  background-position:left top; background-repeat:no-repeat; display:block;
641  height:50px; text-indent:-9999px; width:44px;
642}
643#scrolltotop a:hover {
644  border-bottom:none;
645}
646
647
648
649ul.categoryActions li.SortOrder {
650  margin-top: 5px;
651  float: left;
652}
653
654
655/* Facebook plugin */
656dl#mbFBP_activity_feed, dl#mbFBP_like_box {
657  display:none;
658}
Note: See TracBrowser for help on using the repository browser.