source: extensions/yoga/Bubble/theme.css @ 31815

Last change on this file since 31815 was 7589, checked in by plg, 13 years ago

update theme Bubble for Piwigo 2.1 compatibility

File size: 20.4 KB
Line 
1@import url(menu.css);
2
3* { margin: 0; padding: 0; border: 0; }
4
5body {
6background:#90B9D2 url(images/bg.png) repeat-x top;
7        font-size:0.7em;
8        font-family: Verdana,arial,Helvetica,sans-serif;
9    margin:0;
10    padding:0;
11}
12
13.content h2 {
14-moz-border-radius-bottomleft:8px;
15-moz-border-radius-bottomright:8px;
16-moz-border-radius-topleft:8px;
17-moz-border-radius-topright:8px;
18background:transparent url(images/bg_title.png) repeat-x scroll 0 0;
19border:1px solid #789FC7;
20color:#3F4A69;
21height:20px;
22margin-bottom:10px;
23margin-top:11px;
24padding:7px;
25}
26
27* { outline: none }
28
29/*=====================================
30            Common styles
31=====================================*/
32h2 {
33color:#3F4A69; 
34border:1px solid #789FC7;
35-moz-border-radius:8px;
36-khtml-border-radius:8px;
37-webkit-border-radius:8px;
38padding:0;
39}
40
41h3 { 
42-moz-border-radius-bottomleft:8px;
43-moz-border-radius-bottomright:8px;
44-moz-border-radius-topleft:8px;
45-moz-border-radius-topright:8px;
46background:transparent url(images/bg_title.png) repeat-x scroll center top;
47border:1px solid #789FC7;
48color:#3F4A69;
49font-size:0.85em;
50font-weight:bold;
51line-height:1.5em;
52padding:6px 42px;
53position:relative;
54text-transform:uppercase;
55top:0;
56vertical-align:middle;
57}
58
59h4
60{ color:#FFFFFF;
61font-size:120%;
62margin:0;
63padding:5px 0.5em;
64text-align:left; 
65}
66
67ul { list-style: none; }
68ul li { list-style: none; }
69
70a, a:link { 
71color:#2E75BD; 
72text-decoration: none; 
73border:0; 
74}
75a:hover { 
76color:#295B82;
77text-decoration: none; 
78
79}
80
81
82pre { overflow: auto; width: 100%; height: auto; }
83.left { float: left; }
84.right { float: right; }
85
86img{}
87
88img.title{ border:none; }
89
90/*=====================================
91               Stuffs
92=====================================*/
93.middle_block { width: auto !important; }
94
95/*=====================================
96            Infos Errors
97=====================================*/
98.infos, .errors {
99  margin: 20px;
100  height: 30px;
101}
102 
103/*=====================================
104               Page
105=====================================*/
106body#thepicturepage,body#theCategorypage, body#theTagspage {}
107
108#the_page {
109        width: 1000px;
110        margin: -2px auto;
111        position: relative;
112        background: transparent url(images/global.png) repeat-y top center;
113}
114
115.content div.titrepage { padding: 10px 3px; }
116
117/*=====================================
118               Header
119=====================================*/
120#theHeader {
121        background: transparent url(images/header.png) no-repeat center bottom;
122height:211px;
123        margin: 0 auto;
124}
125
126#theHeader h1 { 
127color:#3F4A69;
128font-size:18px;
129left:30px;
130margin:0 0 0 358px;
131position:absolute;
132text-align:left;
133top:139px;
134}
135
136#theHeader p {display:none;}
137
138.content, body#theadminpage .content, body#theTagspage .content {
139        width: 980px;
140        margin: 0 auto !important;
141}
142
143/*=====================================
144    Spécifique à la page des images
145=====================================*/
146
147#thepicturepage #theHeader {
148height:211px;
149}
150#thepicturepage #theHeader h1 { display: none; }
151
152/*=========================================================================================*/
153
154.row1 { background-color: #999;}
155.throw { background-color: #999;}
156
157/*=====================================
158            Page Catégories
159=====================================*/
160.comments_table{
161-moz-border-radius-bottomleft:12px;
162-moz-border-radius-bottomright:12px;
163-moz-border-radius-topleft:12px;
164-moz-border-radius-topright:12px;
165border:1px solid #789FC7;
166/*background:#DEBF81;margin:auto auto 30px;width:98%;*/
167font-size:0.85em;
168font-weight:bold;
169line-height:1.5em;
170padding:6px 42px;
171
172}
173
174.content div.thumbnailCategory { 
175        padding: 20px; 
176/*      text-align: center;    */
177}
178.content div.thumbnailCategory:hover {
179        border:1px solid #789FC7;
180        background:#dfefff url(images/content_index.png) no-repeat scroll center top;
181}
182.content ul.thumbnailCategories li { width:49.9%; }
183
184/*=====================================
185            Page Image
186=====================================*/
187
188#imageToolBar{
189-moz-border-radius-bottomleft:5px;
190-moz-border-radius-bottomright:5px;
191-moz-border-radius-topleft:5px;
192-moz-border-radius-topright:5px;
193background:#DEEBF8 none repeat scroll 0 0;
194border:1px solid #789FC7;
195height:32px;
196margin:10px auto;
197padding:5px;
198width:860px;
199}
200#imageHeaderBar{
201-moz-border-radius-bottomleft:5px;
202-moz-border-radius-bottomright:5px;
203-moz-border-radius-topleft:5px;
204-moz-border-radius-topright:5px;
205background:#DEEBF8 none repeat scroll 0 0;
206border:1px solid #789FC7;
207margin:10px auto;
208width:860px;
209}
210
211#theImage IMG {
212  padding: 5px;
213  border:1px solid #789FC7;
214}
215
216#imageHeaderBar H2 { 
217    color:#3F4A69;
218        border: none;
219        clear: both;
220        padding: 0;
221        text-align: center;
222        padding: 0.5em 0 0 0;
223}
224#imageHeaderBar .browsepath a { color:#3F4A69; text-decoration: none; }
225#imageHeaderBar .browsepath a:hover { color:#FFFFFF; }
226
227.infotable{ margin: 20px auto; }
228#linkPrev{ margin: 20px 0 0 20px; }
229#linkNext{ margin: 20px 20px 0 0;}
230a#thumbprev, a#thumbNext { text-decoration: none; border:0; }
231
232#addComment label { width: 100%; margin-top: 1em; }
233
234#menubar .button {
235border:medium none;
236float:right;
237list-style-image:none;
238list-style-position:outside;
239list-style-type:none;
240margin:-2px 2px 2px;
241padding:0;
242text-align:center;
243text-indent:0;
244width:auto;
245}
246
247/*=====================================
248            Commentaires
249=====================================*/
250
251#comments{ width: 860px; margin: 20px auto; }
252#comments div.comment blockquote { border: 1px solid #5f5f5f; border-left: 2px solid #696969; }
253
254fieldset, input, select, table.table2, #infos,
255.content div.comment  a.illustration IMG { 
256-moz-border-radius-bottomleft:3px;
257-moz-border-radius-bottomright:3px;
258-moz-border-radius-topleft:3px;
259-moz-border-radius-topright:3px;
260background:transparent url(images/content.png) no-repeat scroll center top;
261border:1px solid #789FC7;
262}
263       
264.content div.thumbnailCategory { 
265-moz-border-radius-bottomleft:12px;
266-moz-border-radius-bottomright:12px;
267-moz-border-radius-topleft:12px;
268-moz-border-radius-topright:12px;
269background: transparent url(images/content_index.png) no-repeat center top;
270border:1px solid #789FC7;       
271}
272#comments ul.thumbnailCategories li { margin: 5px auto; }
273
274textarea { width: 100%; }
275
276/*=====================================
277            Miniatures
278=====================================*/
279.content ul.thumbnails span, .content ul.thumbnails span.wrap2 a,
280.content ul.thumbnails span.wrap2 label, .content div.thumbnailCategory div.illustration {
281  width: 167px;                 /* max thumbnail width + 2px */
282}
283.content ul.thumbnails span.wrap2{ width: 172px; height:150px; }
284.content div.thumbnailCategory div.description { height: 100px; }               /* max thumbnail height + 2px */
285.content div.thumbnailCategory div.illustration img { height: 96px; border:4px double #3F4A69; }
286.content div.thumbnailCategory div.illustration img:hover { border:4px double #74A9CA;}
287.content div.thumbnailCategory div.illustration a:hover { border:0; }
288
289.content div.comment blockquote {
290  margin-left: 172px;   /*maximum thumbnail width + ~10px */
291}
292.content div.thumbnailCategory div.description  p { text-align: left; }
293
294/*.content ul.thumbnails span.wrap1 { margin: 0 10px; }*/
295.content ul.thumbnails span.wrap2 img { padding: 5px; border:1px solid #789FC7; background-color: #FFFFFF;}
296.content ul.thumbnails span.wrap2 img:hover { border-color: #74A9CA; background-color: #CEE0EB;}
297
298.content ul.thumbnails li.thumbCat span.wrap2 { border-style: hidden; background-color: #3F4A69; }
299.content ul.thumbnails li.thumbCat span.wrap2:hover { border-style: solid; }
300
301.content ul.thumbnails span.wrap1 {
302    -moz-border-radius:12px;
303        -khtml-border-radius:12px;
304        -webkit-border-radius:12px; 
305background: transparent url(images/backthumb.png) no-repeat center top;
306border:1px solid #789FC7; 
307display:inline-block;
308margin:0 5px 5px;
309text-align:center;
310vertical-align:top;
311}
312
313.content ul.thumbnails span.thumbLegend {
314/*    height: auto;*/
315    padding: 0.5em 0;
316}
317.zero { display: none }
318.nb-hits { color: #120087; }
319.nb-comments { color: #120087; }
320}
321
322/*=====================================
323            Menu
324=====================================*/
325
326#menubar { position: relative; z-index: 2; }
327.content { /*position: relative; z-index: 1;*/ }
328
329.content div.thumbnailCategory div.description {
330        overflow: hidden; /* bug in FF 1.0 (not 1.5) */
331}
332
333/*=====================================
334            Horizontal menubar
335=====================================*/
336#menubar{
337        float: none;
338        width: 898px;
339        margin: 5px auto;
340        border: none;
341        display: block;
342
343}
344
345body#theadminpage #menubar {
346        float: none;
347        width: 898px;
348        margin: 5px auto;
349        border: none;
350        display: block;
351}
352
353/*=====================================
354            Filter button
355=====================================*/
356#menubar .button { position: absolute; left:95% } 
357#menubar p, #menubar p.totalimages{ clear: both; margin: 0; text-align: center; padding: 0.2em }
358
359/*=====================================
360    Set menubar height (not for IE)
361=====================================*/
362#the_page > #menubar, body#theadminpage #the_page > #menubar {
363-moz-border-radius-bottomleft:5px;
364-moz-border-radius-bottomright:5px;
365-moz-border-radius-topleft:5px;
366-moz-border-radius-topright:5px;
367float:left;
368height:2.1em;
369margin-top:-47px;
370padding:19px;
371}
372#menubar dl>dt {
373  padding: 0.2em 0.4em; 
374}
375
376/*=====================================
377        General ul formating
378=====================================*/
379#menubar ul, #menubar dl, #menubar ul#menuTagCloud {
380  list-style: none;
381  margin: 0;
382  padding: 0;
383  float: left;
384text-decoration:none; 
385}
386#menubar dl { 
387border-right:1px solid #120087;
388display:inline;
389height:21px;
390padding:0 1.1em;
391}
392
393body#theadminpage #the_page > #menubar dl { padding: 0 0.5em;}
394
395#menubar ul li a {  padding-right: 3em; margin-left:25px;}
396
397#menubar p, #menubar p.totalimages, form#quickconnect {
398  clear: both;
399  margin: 0;
400  text-align: center;
401  padding: 0.2em;
402}
403
404/*=====================================
405        Titres et liens
406=====================================*/
407#menubar a, #menubar dt { display: block; }
408
409/*=====================================
410            Positionnement
411=====================================*/
412#menubar li { position: relative; background:transparent url(images/cat.png) no-repeat; margin-left:5px;}
413#menubar dd { position: absolute; z-index: 500;}
414#menubar dd ul ul {
415background-color:#FFFFFF;
416border:1px solid #8C8C8C;
417  position: absolute;
418  top: 0px;
419  left: 100%;
420  z-index: 500;
421}
422#menubar li span,#menubar li IMG { position: absolute; top: 7px;}
423#menubar li span { right: 7px;}
424#menubar li IMG { right:4em;    }
425
426/*=====================================
427Hiding and revealing up to 6 menu levels
428=====================================*/
429div#menubar dd,
430div#menubar ul ul,
431div#menubar ul li:hover ul ul,
432div#menubar ul ul li:hover ul ul,
433div#menubar ul ul ul li:hover ul ul,
434div#menubar ul ul ul ul li:hover ul ul { display: none; }
435
436div#menubar dl:hover dd,
437div#menubar ul li:hover ul,
438div#menubar ul ul li:hover ul,
439div#menubar ul ul ul li:hover ul,
440div#menubar ul ul ul ul li:hover ul,
441div#menubar ul ul ul ul ul li:hover ul { display: block; }
442
443/*=====================================
444            Styles
445=====================================*/
446#menubar{
447        color:#3F4A69;
448        border:0px;
449}
450
451 #menubar dt{
452        color:#3F4A69;
453        border:0px;
454} 
455 
456 #menubar dd{
457background:#C3E1FF url(images/bgmenu.png) repeat-y scroll 0 0;
458border:1px solid #789FC7;
459color:#3F4A69;
460padding-top:0;
461} 
462 
463 #menubar ul {
464        color:#3F4A69;
465        width: 20em;
466
467}
468#menubar a, #menubar dt a, #menubar dd a { 
469        color:#3F4A69;
470        display: block; 
471text-decoration:none;
472        border: 0;
473}
474
475#menubar a:hover { color: #FFFFFF; }
476#menubar dd a { padding: 0.5em; }
477#menubar dd a:hover { color:#3F4A69; background-color:#FFFFFF; border:1px solid #8c8c8c; }
478
479form#quicksearch { width: 220px;}
480       
481/*=====================================
482            Quickconnect
483=====================================*/
484form#quickconnect fieldset { text-align: left; width: 220px; padding-top: 5px;}
485form#quickconnect label { clear: left; /*margin: 0;*/ }
486form#quickconnect label input { font-size: 1em; /*width: 15em;*/ }
487form#quickconnect p, form#quickconnect a { border: none; padding: 0; }
488form#quickconnect .button { position:relative; top: -20x; left: 50px}
489
490/*=====================================
491            MenuTagCloud
492=====================================*/
493
494#menubar #menuTagCloud a { display: inline; }
495#menubar #menuTagCloud span {
496  display: block;
497  padding: 0.5em 0;
498  text-align: left;
499}
500
501/*=====================================
502         Tags - page des tags
503=====================================*/
504
505ul#fullTagCloud {
506        position: relative;
507        border: 1px solid #E8E8E8;
508        border-width: 1px 0;
509        background: #FBFBFB;
510        padding: 5px;
511        margin: 8px 0 20px 0;
512        overflow: hidden;
513        height: 100%;
514        font-size: 120%;
515}
516        ul#fullTagCloud li {
517                display: block;
518                float: left;
519                margin: 4px;
520                padding: 1px 5px;
521                height: 18px;
522                line-height: 18px;
523                background: none;
524        }
525        ul#fullTagCloud li a:link, ul#fullTagCloud li a:visited {
526                color: #005D99;
527                text-decoration: none;
528                white-space: nowrap;
529        }
530        ul#fullTagCloud li a:hover { text-decoration: underline; border: 0; }
531        ul#fullTagCloud li a:focus, ul#fullTagCloud li a:active { background: #005D99; color: #FFFFFF; }
532
533.tagLevel5 { font-size:160%; }
534.tagLevel4 { font-size:140%; }
535.tagLevel3 { font-size:120%; }
536.tagLevel2 { font-size:100%; }
537.tagLevel1 { font-size:80%; }
538
539/*=====================================
540            Autres
541=====================================*/
542.pleaseNote {
543        margin: 20px auto;
544        width: 700px;
545    background: #eee;
546    color: #ff9b00;
547        border: 1px solid #ff9b00;
548    padding: 1ex;
549    font-weight: bold;
550}
551
552li.categoryli {
553        float:left;
554        margin:2px;
555        width:46%;
556}
557
558input.rateButton { color: #369; }
559input.rateButtonselected { color:#696969; }
560input.rateButton:hover { color: #369;}
561
562/*=====================================
563            Calendrier
564=====================================*/
565
566ul.categoryactions, div.calendarViews {
567  padding-top: 5px;
568  padding-right: 6px;
569}
570
571/*=====================================
572           Calendrier éléments
573=====================================*/
574span.calitemEmpty { color: silver; }
575
576span.calitem, span.calitemEmpty { border: 1px solid gray; }
577
578/*=====================================
579        Nice looking month calendar
580=====================================*/
581td.calDayCellEmpty, td.calDayCellFull { border: 1px solid gray;}
582
583td.calDayCellEmpty { color: silver; }
584
585.calBackDate { color: #000; }
586.calForeDate { color: #FFFFFF; }
587
588/*=====================================
589        Footer/Pied de page
590=====================================*/
591#copyright {
592background:transparent url(images/footer.png) repeat-x scroll 0 0;
593clear:both;
594font-weight:bold;
595height:29px;
596margin:0 auto;
597padding:26px 0;
598text-align:center;
599}
600#copyright a:link, #copyright a:visited { 
601color:#2E75BD;
602font-size:10px;
603}
604#copyright a:hover { 
605text-decoration: none; 
606color: #FFFFFF; 
607border: 0; }
608
609/*=====================================
610    Modifications/Parenté css
611=====================================*/
612
613.content div.thumbnailCategory div.description h3 {
614background:transparent none repeat scroll 0 0;
615border:medium none;
616font-size:120%;
617margin:0;
618padding:0.1em;
619text-align:left;
620}
621/*===============================
622      Infos Errors
623===============================*/
624.infos, .errors {
625  margin: 20px;
626}
627.infos {
628-moz-border-radius-bottomleft:12px;
629-moz-border-radius-bottomright:12px;
630-moz-border-radius-topleft:12px;
631-moz-border-radius-topright:12px;
632background:#B1E2AD url(images/infos.png) no-repeat scroll right top;
633border:1px solid #919191;
634color:#09460E;
635margin:5px;
636padding:10px 50px 10px 10px;
637min-height:30px;
638}
639
640.errors { 
641-moz-border-radius-bottomleft:12px;
642-moz-border-radius-bottomright:12px;
643-moz-border-radius-topleft:12px;
644-moz-border-radius-topright:12px;
645        color: #88181A;
646        font-weight: bold;
647        margin: 5px;
648border:1px solid #919191;
649        background:#FF9193 url(images/errors.png)no-repeat top right;
650        padding: 10px 50px 10px 10px;
651        min-height:30px;
652}
653
654/*----------------------------------
655    Advanced Menus Manager
656----------------------------------*/
657
658DL#mbAMM_links img {
659border:none;
660display:none;
661}
662div#iamm_ill0 {
663margin:0 25px 5px;
664}
665/*----------------------------------
666            Autres
667----------------------------------*/
668
669
670.content ul.thumbnails {
671margin-top:15px;
672}
673
674div#comments div.description {
675-moz-border-radius-bottomleft:8px;
676-moz-border-radius-bottomright:8px;
677-moz-border-radius-topleft:8px;
678-moz-border-radius-topright:8px;
679background:transparent url(images/content.png) repeat scroll 0 0;
680border:1px solid #919191;
681font-size:0.85em;
682font-weight:bold;
683line-height:1.5em;
684min-height:50px;
685padding:0 6px;
686}
687
688/*----------------------------------
689            Blocs/Boutons
690----------------------------------*/
691
692legend {
693-moz-border-radius-bottomleft:12px;
694-moz-border-radius-bottomright:12px;
695-moz-border-radius-topleft:12px;
696-moz-border-radius-topright:12px;
697background:#AE9161 url(images/form.png) repeat-x scroll center top;
698border:1px solid #919191;
699font-size:0.85em;
700font-style:normal;
701font-weight:bold;
702line-height:1.5em;
703margin-left:0.5em;
704margin-top:-0.4em;
705padding:2px 10px;
706position:relative;
707text-transform:uppercase;
708top:0;
709vertical-align:middle;
710}
711
712fieldset, table.table2, #infos, .content div.comment a.illustration img {
713-moz-border-radius-bottomleft:12px;
714-moz-border-radius-bottomright:12px;
715-moz-border-radius-topleft:12px;
716-moz-border-radius-topright:12px;
717background:transparent url(images/content.png) no-repeat scroll center top;
718border:1px solid #919191;
719}
720
721form.filter fieldset label input, form.filter fieldset label select, form.filter fieldset label span, form.filter fieldset label textarea {
722-moz-border-radius-bottomleft:12px;
723-moz-border-radius-bottomright:12px;
724-moz-border-radius-topleft:12px;
725-moz-border-radius-topright:12px;
726}
727
728input, select, textarea {
729background-color:#F5FBFF;
730border-color:#6993AE #CCCCCC #CCCCCC #6993AE;
731border-style:solid;
732border-width:1px;
733color:#2E3B5F;
734font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,'Bitstream Vera Sans',Times,serif;
735font-size:11px;
736padding:1px 2px;
737}
738
739input.reset:hover, input.submit:hover {
740border:1px solid #11365F;
741color:#3776BA;
742cursor:pointer;
743}
744
745input.submit:focus, select:focus, textarea:focus, input.focus, form .focus {
746border:1px solid #919191;
747background-color:none;
748}
749
750input[type="text"], 
751input[type="password"], 
752input[type="button"], 
753input[type="submit"], 
754input[type="reset"], 
755input[type="file"] {
756background-color:#E4D6BD;
757color:#552200;
758}
759
760input.submit{
761-moz-border-radius-bottomleft:5px;
762-moz-border-radius-bottomright:5px;
763-moz-border-radius-topleft:5px;
764-moz-border-radius-topright:5px;
765background:#A9CEE9 url(images/form.png) repeat-x scroll 0 0;
766border-color:#8498AE #515C68 #515C68;
767border-style:solid;
768border-width:1px;
769color:#3F4A69;
770font-family:Verdana,'Bitstream Vera Sans',Times,serif;
771font-size:10px;
772font-weight:bold;
773padding:1px 2px;
774}
775
776input.reset {
777-moz-border-radius-bottomleft:5px;
778-moz-border-radius-bottomright:5px;
779-moz-border-radius-topleft:5px;
780-moz-border-radius-topright:5px;
781background:#A9CEE9 url(images/form.png) repeat-x scroll 0 0;
782border-color:#8498AE #515C68 #515C68;
783border-style:solid;
784border-width:1px;
785color:#E10000;
786font-family:Verdana,'Bitstream Vera Sans',Times,serif;
787font-size:10px;
788font-weight:bold;
789padding:1px 2px;
790}
791
792
793legend {
794-moz-border-radius-bottomleft:12px;
795-moz-border-radius-bottomright:12px;
796-moz-border-radius-topleft:12px;
797-moz-border-radius-topright:12px;
798background:#D2E3F1 none repeat scroll 0 0;
799border:1px solid #919191;
800color:#3F4A69;
801font-size:0.85em;
802font-weight:bold;
803line-height:1.5em;
804margin-left:0.5em;
805margin-top:-0.4em;
806padding:2px 10px;
807position:relative;
808text-transform:uppercase;
809top:0;
810vertical-align:middle;
811}
812
813form.filter input[type="submit"] {
814margin-top:0;
815}
816
817.header_notes {
818background-image:none;
819border:none;
820font-weight:bold;
821margin:-11px;
822padding:5px 0 0;
823text-align:center;
824}
825span.calItem, span.calItemEmpty, td.calDayCellEmpty, td.calDayCellFull {
826border:1px solid #789FC7;
827}
Note: See TracBrowser for help on using the repository browser.