source: extensions/floOS/OS_default/theme.css @ 10053

Last change on this file since 10053 was 10053, checked in by flop25, 13 years ago

thumbnails can be bigger and smaller than 140px : resize for album and use of jquery for thumbnails to use maximum height

File size: 11.1 KB
Line 
1@import "iconset.css";
2
3BODY {
4  margin: 0px;
5  padding: 0;
6  font-size: 0.8em;
7  font-family:  Univers, Helvetica, Optima, "Bitstream Vera Sans", sans-serif;
8  text-align: center; /* be nice to IE5 */
9}
10body#theCommentsPage .content, body#theUploadPage .content, body#theRegisterPage .content, body#theIdentificationPage .content, body#theProfilePage .content, body#theSearchPage .content, body#theAboutPage .content, body#thePasswordPage .content, body#theNotificationPage .content, body#theTagsPage .content {
11  margin-left: 20em !important;
12        margin-bottom: 1em !important;
13        margin-right: 1em !important;
14        margin-top:1.9em !important;
15}
16body#thePopuphelpPage #theHeader {
17        display:none;
18}
19#the_page {
20        height:100%;
21        margin: 0px;
22}
23.thumbnailCategory .icon {
24    border: none;
25}
26
27H1 {
28  text-align: center;
29  font-size: 150%;
30  font-weight: bold;
31  padding: 0;
32  margin: 0.5em 0 1em 0;
33}
34
35H2 {
36        margin: 0;
37        padding: 5px 0.5em 5px 0.5em;
38        text-align: left;
39        font-size: 120%;
40}
41
42A {
43        text-decoration:none;
44        border-bottom: 1px dotted #000;
45}
46A:hover {
47        border-bottom: 1px solid #fff;
48}
49A.button, A.button:hover { 
50        border: 0; 
51}
52IMG {
53        border:none;
54}
55.illustration A, .titre_acordeon A, .titre_acordeon_0 A{
56        border-bottom:none;
57}
58
59HR.separation {
60  visibility: hidden;
61  clear: both;
62}
63
64#copyright {
65    clear: both;
66    font-size: 83%;
67    text-align: center;
68    margin: 0 0 10px 0;
69}
70.thumbnails SPAN, .thumbnails .wrap2 A, .thumbnails LABEL, .thumbnailCategory DIV.illustration {
71    width: auto;
72}
73.illustration IMG {
74        max-height:120px;
75}
76
77/** General defaults **/
78INPUT, SELECT {
79  margin: 0;
80  font-size: 1em;       /* <= some browsers don't set it correctly */
81}
82UL, DL, LI { text-align: left;}
83TABLE {                 /* horizontaly centered */
84  margin-left: auto;
85  margin-right: auto;
86}
87/* for debugging purpose */
88PRE { text-align:left; }
89
90/** forms **/
91
92FORM { padding: 0em; margin-top: 5px; }
93
94FORM P {
95        text-align: center;
96        margin-top: 2em;
97        margin-bottom: 2em;
98}
99
100FORM FIELDSET P {
101        margin-top: 1em;
102        margin-bottom: 0;
103}
104
105.small {
106        font-size: 80%;
107}
108
109TEXTAREA.description {
110  height: 6em;
111  width: 40em;
112  overflow: auto;
113}
114
115SELECT.categoryList {
116  height: 20em;
117  width: auto;
118}
119
120DIV.comment BLOCKQUOTE {
121  padding: 0.5em;
122  overflow: auto;       /* no solution for IE6 */
123  min-height: 2.75em;   /* fix a Gecko bug whith scrollbar and 1 line only */
124}
125
126
127/**
128 * Filter forms are displayed label by label with the input (or select...)
129 * below the label. Use an UL to make a group (radiobox for instance).
130 * Use a SPAN to group objects in line
131 */
132FIELDSET {
133  padding: 1em;
134  margin: 1em;
135  overflow: hidden; /* <- makes Opera happy */
136}
137
138FORM.filter FIELDSET UL {
139  margin: 0;
140}
141FORM.filter FIELDSET UL,
142FORM.filter FIELDSET LABEL {
143  display: block;
144  float: left;
145  margin-right: 1em;
146  padding: 0;
147}
148
149FORM.filter FIELDSET LI {
150  list-style: none;
151  margin-bottom: 0.5em;
152}
153
154FORM.filter FIELDSET LI LABEL {
155  display: inline;
156  float: none;
157}
158
159FORM.filter FIELDSET UL.tagSelection LABEL {
160  display: inline;
161  float: none;
162  margin-right:0.5em;/*reduce from above*/
163}
164
165/* cannot use FIELDSET>LABEL because of IE<=6 */
166FORM.filter FIELDSET LABEL INPUT,
167FORM.filter FIELDSET LABEL SELECT,
168FORM.filter FIELDSET LABEL SPAN,
169FORM.filter FIELDSET LABEL TEXTAREA {
170  display: block;
171  margin: 0.5em 0;
172}
173FORM.filter FIELDSET * LABEL INPUT,
174FORM.filter FIELDSET * LABEL SELECT,
175FORM.filter FIELDSET * LABEL TEXTAREA,
176FORM.filter FIELDSET LABEL SPAN INPUT,
177FORM.filter FIELDSET LABEL SPAN SELECT,
178FORM.filter FIELDSET LABEL SPAN TEXTAREA {
179  display: inline;
180  vertical-align: top;
181  margin: 0 0.5em 0 0;
182}
183
184FORM.filter FIELDSET UL.tagSelection LI LABEL INPUT {
185  margin-right:0;
186}
187
188/* following declaration is important to avoid strange FF behaviour */
189FORM.filter FIELDSET LABEL SPAN SELECT {
190  margin: 0;
191}
192
193FORM.filter FIELDSET P
194{
195  clear: left;
196  display: block;
197}
198
199FORM.filter INPUT[type="submit"] {
200  margin-top: 1em;
201}
202
203FORM.properties UL, FORM#update UL {
204  list-style-type: none;
205  margin: 0;
206  padding: 0;
207}
208
209FORM.properties LI, FORM#update UL  {
210  margin-bottom: 0.5em;
211  padding: 0;
212  line-height: 1.8em;
213  clear: left;
214}
215
216FORM.properties SPAN.property {
217  font-weight: bold;
218  float: left;
219  width: 50%;
220  text-align: right;
221  margin: 0;
222  padding: 0 0.5em 0 0;
223}
224
225#theHeader H1 {
226        padding-top: 1em;
227        padding-bottom: 0.5em;
228        margin: 0px;
229}
230
231/* button tools */
232UL.actions {
233  text-indent: 0;
234  list-style: none;
235}
236UL.actions  LI {
237  display: inline;
238}
239UL.actions  A {
240  border: none;
241}
242
243UL.tagSelection {
244  width: 99%;
245  margin: 1em 0 1em 0;
246  padding: 0;
247}
248
249UL.tagSelection LI {
250  display: inline;
251  white-space: nowrap;
252}
253
254#fullTagCloud {
255  font-size: 120%;
256  text-align: justify;
257  padding: 0;
258  margin: 1em 2em 1em 2em;
259}
260
261#fullTagCloud SPAN {
262        white-space: nowrap;
263        margin: 0 2px;
264}
265
266.tagLevel5 { font-size: 150%; }
267.tagLevel4 { font-size: 140%; }
268.tagLevel3 { font-size: 120%; }
269.tagLevel2 { font-size: 100%; }
270.tagLevel1 { font-size: 90%; }
271
272
273/* Popup help page */
274BODY#thePopuphelpPage #copyright {
275  display: none;
276}
277#theNotificationPage p { padding: 0.5em; }
278
279BODY#thePopuphelpPage .content P {
280  text-align: justify;
281  padding: 0.5em;
282}
283
284BODY#thePopuphelpPage .content OL LI,
285BODY#thePopuphelpPage .content UL LI
286{
287  margin-bottom: 0.5em;
288}
289
290BODY#thePopuphelpPage P#pageBottomActions A {
291  border: none;
292}
293
294TR.tagLine {
295  border-bottom: 1px solid #ddd;
296  text-align: left;
297}
298TR.tagLine:hover {
299  background-color: #fff;
300}
301TD.nbEntries {
302  text-align: right;
303  font-style: italic;
304  font-size: 90%;
305}
306
307FIELDSET.tagLetter {
308  border: 1px solid #d3d3d3;
309  width: 200px;
310  margin: 0.5em;
311  padding: 10px;
312}
313
314LEGEND.tagLetterLegend {
315  border: 1px solid #d3d3d3;
316  font-size:120%;
317  font-weight: bold;
318  padding: 0 5px;
319  font-style: normal;
320}
321
322TABLE.tagLetterContent {
323  width:100%;
324  font-size:80%;
325  border-collapse : collapse;
326}
327
328#theNotificationPage DL,
329#thePopuphelpPage DL { margin: 0 25px 25px; }
330.content #comments UL.thumbnailCategories LI { width:99%; }
331/* jQuery datepicker */
332IMG.ui-datepicker-trigger {
333        cursor : pointer;
334}
335
336/*--------menu--------------*/
337#table_content, #table_menu {
338width:100%;
339height:100%;
340border:0;
341padding:0;
342margin:0;
343}
344
345#theHeader {
346        margin: 0px;
347        padding: 0px;
348        height:100px;
349}
350#menubar .button_res {
351        margin: 0 2px;
352        width: auto;
353        padding: 0;
354        text-indent: 0;
355        list-style: none;
356        text-align: center;
357        float: left;
358}
359.mb_left, .mb_right {
360        width:0px;
361}
362#theNotificationPage #menubar dl {
363        margin:0;
364}
365/* menu en haut */
366#div_Menu
367{
368        padding: 0px;
369        clear:both;
370        margin-right: 0px;
371        margin-bottom: 10px;
372        margin-left: 0px;
373        height:25px;
374}
375
376ul#Menu
377{
378        height:25px;
379        margin: 0;
380        list-style-type: none;
381        padding-top: 0;
382        padding-right: 0;
383        padding-bottom: 0;
384        padding-left: 8px;
385}
386ul#Menu li
387{
388        float: left;
389        text-align: center;
390        display: block;
391        margin:0 10px;
392        height:25px;
393}
394ul#Menu li a
395{
396        width: auto;
397        line-height: 30px;
398        font-size: 1em;
399        text-decoration: none;
400}
401#home_icon, #form_search_menu {
402        float:right !important;
403        margin-right:20px;
404}
405
406input#qsearchInput {
407width: 150px;
408text-align:left;
409}
410
411
412/**
413 * Informations box in administration
414 */
415.infos {
416  text-align: left;
417  color: #002000;
418  background-color: #98fb98; /* palegreen */
419  background-image: url(icon/admin/infos.png);
420  background-repeat: no-repeat;
421  background-position: top right;
422  margin: 0px;
423  padding: 10px 50px 10px 10px;
424}
425
426/**
427 * Header message like upgrade or adviser mode
428 */
429.header_msgs {
430  text-align:center;
431  font-weight: bold;
432  color:#696969;        /* dimgray */
433  background-color: #d3d3d3;
434  margin: 1px;
435  padding: 1px;
436        float:right;
437        position: absolute;
438        top: 1px;
439        right: 1px;
440        width:20%;
441        padding-top: 5px;
442        padding-right: 0px;
443        padding-bottom: 0px;
444        padding-left: 30px;
445}
446
447/**
448 * Header notes box in public/administration
449 */
450.header_notes {
451        border: 1px solid #aaaaaa; /* border color and style */
452        text-align: center;
453        background-image: url(icon/note.png);
454        background-repeat: no-repeat;
455        background-position: top left;
456        font-weight: bold;
457        margin: 14px;
458        float:right;
459        color:#000000;
460        position: absolute;
461        top: 1px;
462        right: 1px;
463        width:20%;
464        padding-top: 5px;
465        padding-right: 0px;
466        padding-bottom: 0px;
467        padding-left: 30px;
468}
469
470/* form picture.css */
471#imageHeaderBar {
472        padding-top: 2px;
473        padding-bottom: 2px;
474        overflow: hidden;
475        width: 100%;
476                margin-top:0px;
477
478}
479
480#imageHeaderBar .browsePath {
481  float: left;
482  margin-left: 10px;
483}
484
485#imageHeaderBar .imageNumber {
486  float: right;
487  margin-right: 10px;
488}
489
490#imageHeaderBar H2 {
491  text-align: center;
492  padding: 0;
493  clear: both;
494}
495
496#imageToolBar {
497  text-align: center;
498  position: relative;
499  clear: both;
500  margin-bottom: 4px;
501  padding: 0;
502}
503
504#imageToolBar {
505    height: 50px;
506}
507#imageToolBar A, #imageToolBar IMG {
508    display: inline;
509    margin: 0; padding: 0;
510}
511#imageToolBar A {
512        margin-right: 3px;
513        margin-left: 5px;
514}
515#imageToolBar IMG { margin: 2px auto; }
516#imageToolBar .randomButtons A { float: left; }
517#imageToolBar .navButtons    A { float: right;  width:36px; }
518
519
520
521#theImage {
522    clear: left;
523}
524
525#theImage>IMG {
526    display: block;
527    margin: 0 auto;
528}
529
530#theImage IMG {
531  border-width: 3px;
532  border-style: solid;
533}
534#imageToolBar {
535    height: 60px;
536}
537#imageToolBar #thumbPrev, #imageToolBar #thumbNext {
538        margin-left:5px;
539        margin-right:5px;
540        display:inline;
541        width:auto;
542}
543#imageToolBar #thumbCurrent {
544        margin-left:5px;
545        margin-right:5px;
546        display:inline;
547        width:auto;
548}
549#imageToolBar #linkPrev, #imageToolBar #thumbCurrent, #imageToolBar #linkNext {
550        border:#FFF solid 2px;
551        width:auto;
552}
553.navButtons .pwg-state-disabled {
554        float: right;
555}
556/**               les miniatures */
557.thumbLink {
558height:45px;
559width:auto;
560}
561.navThumb {
562    margin-top: 2px;
563}
564#thumbPrev {
565    float: right;
566        margin-right:0px;
567}
568
569#thumbNext {
570    float: right;
571        margin-left:0px;
572}
573#thumbCurrent {
574    float: right;
575        border:1px solid #FF0000;
576}
577#linkPrev {
578    margin-right: 10px;
579    margin-left: 5px;
580}
581
582#linkNext {
583    margin-right: 5px;
584    margin-left: 10px;
585}
586#action_pict {
587/*      float:left;
588        position: absolute;
589        left: 5px;
590        top: 300px;
591    width:150px;*/
592        width:600px;
593        margin-left:auto;
594        margin-right:auto;
595        padding:0;
596}
597#action_pict A, #action_pict IMG{
598        border: none;
599        margin-right: 2px;
600        margin-left: 2px;       
601}
602
603TABLE.infoTable .value {
604    text-align: left;
605}
606
607TABLE.infoTable .label {
608    font-weight: bold;
609    text-align: right;
610    padding-right: 0.5em;
611}
612
613TABLE.infoTable TD.value UL {
614  margin: 0;
615  padding: 0 0 0 1.5em;
616  list-style-type: square;
617}
618
619#rateForm {
620        display:block;
621        height:20px;
622        overflow:visible;
623}
624.rateButton, .rateButtonSelected, .rateButtonStarFull, .rateButtonStarEmpty  {
625  padding:0;
626  border:0;
627  height:16px;
628  width:16px;
629}
630
631.rateButton, .rateButtonStarFull, .rateButtonStarEmpty {
632  cursor: pointer;
633}
634
635.rateButtonSelected {
636  font-weight:bold;
637  font-size:120%;
638}
639
640.rateButtonStarFull {
641        background: url('icon/rating-stars.gif') no-repeat scroll; background-position:-16px center; width:16px;
642}
643
644.rateButtonStarEmpty {
645        background: url('icon/rating-stars.gif') no-repeat scroll; background-position:0 center; width:16px;
646}
647
648#comments {
649        text-align: left;
650        margin:20px 30px 2em;
651}
652
653#comments .comment {
654  margin: 1em 0;
655}
656
657#comments P {
658  margin: 0 0.5em 0 1em;
659}
660
661#comments .author {
662  font-weight: bold;
663}
664
665#thePicturePage #comments BLOCKQUOTE {
666  margin: 0.5em 1em 1em 4em;
667}
668
669#comments P.userCommentDelete {
670  float: right;
671  margin: 0 0.5em 0 0;
672}
Note: See TracBrowser for help on using the repository browser.