Dotclear

source: admin/style/default.css @ 1333:5e1388edd0c9

Revision 1333:5e1388edd0c9, 29.0 KB checked in by Anne Kozlika <kozlika@…>, 11 years ago (diff)

Post: prepare some css work on "preview post" and "next|previous entry". Some very little enhancements on Search page.

Line 
1/*
2# -- BEGIN LICENSE BLOCK ---------------------------------------
3#
4# This file is part of Dotclear 2.
5#
6# Copyright (c) 2003-2013 Olivier Meunier & Association Dotclear
7# Licensed under the GPL version 2.0 license.
8# See LICENSE file or
9# http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
10#
11# -- END LICENSE BLOCK -----------------------------------------
12*/
13
14/* ------------------------------------------------------------------ html */
15html {
16     font-size: 62.5%;
17}
18body {
19     font: 1.2rem/1.5 Arial,Helvetica,sans-serif;
20     color: #333;
21     background: #fff;
22     margin: 0;
23     padding: 0;
24}
25
26a, a:link, a:visited {
27     color: #2373A8;
28     text-decoration: none;
29     border-bottom: 1px dotted #f90;
30}
31a:hover, a:active, a:focus {
32     text-decoration: underline;
33}
34a img, a:link img, a:visited img { 
35     border:none;
36}
37
38h1, h2, h3, h4, h5, h6, p {
39     margin-top: 0;
40     margin-bottom: 1rem;
41}
42h2 {
43     color: #666;
44     font-size: 1.8rem;
45     padding: 0 0 1.8rem;
46     font-weight: normal;
47}
48h2 a:link, h2 a:visited {
49     color: #666;
50     border-color: #000;
51}
52.page-title {
53     color: #d30e60;
54}
55#content > h2 {
56     padding: 0 1.8rem .6rem;
57     margin: 0 -1.8rem 1rem;
58     background: #fff url(bg_h2.png) repeat-x center bottom;
59}
60h3 {
61     color: #575859;
62     font-size: 1.4rem;
63}
64p, div.p {
65     margin: 0 0 1em 0;
66}
67hr {
68     height: 1px;
69     border-width: 1px 0 0;
70     border-color: #999;
71     border-style: solid;
72}
73pre, code {
74     font: 100% "Andale Mono","Courier New",monospace;
75}
76pre {
77     white-space: pre;
78     white-space: -moz-pre-wrap;
79     white-space: -hp-pre-wrap;
80     white-space: -o-pre-wrap;
81     white-space: -pre-wrap;
82     white-space: pre-wrap;
83     white-space: pre-line;
84     word-wrap: break-word;
85}
86abbr {
87     cursor: help;
88}
89
90/* LAYOUT
91-------------------------------------------------------- */
92/* header */
93#header {
94     background: #575859;
95     position: relative;
96     border-bottom: 4px solid #A2CBE9;
97     width: 100%;
98}
99#prelude {
100     line-height: 1.9;
101     margin: 0;
102     padding: 0;
103     overflow: hidden;
104     position: absolute;
105     top: 3em;
106     left: 0;
107     background: #A2CBE9;
108     width: 14.5em;
109     }
110#prelude li {
111     list-style-type: none;
112     margin: 0;
113     background:transparent;
114}
115#prelude li a {
116     padding-left: 1.6rem;
117     background: #A2CBE9;
118     color: #000;
119     border-bottom-color: #A2CBE9;
120}
121#top {
122     margin: 0;
123     padding: 0;
124     width: 14.5em;
125     float: left;
126}
127#top h1 {
128     padding: 0;
129     margin: 0;
130     height: 3.6rem;
131     text-indent: -1000px;
132}
133#top h1 a {
134     position: absolute;
135     top: 0;
136     left: 0;
137     width: 17.4rem;
138     height: 3.6rem;
139     border: none;
140     color: #fff;
141}
142#top h1 a:link {
143     background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 6px;
144}
145#top h1 a:hover, #top h1 a:focus {
146     background: transparent url(dc_logos/b-dotclear120.png) no-repeat 0 -94px; 
147}
148#info-boxes {
149     font-size: 1em;
150     line-height: 3em;
151}
152#info-box1 {
153     margin: 0;
154     padding: 0 3px 0 1.8rem;
155     color: #fff;
156     display: inline-block;
157}
158#info-box2 {
159     margin: 0;
160     padding: 0 1.3em 0 0;
161     color: #fff;
162     float: right;
163     text-align: right;
164}
165#info-box1 p {
166     margin: 0;
167     display: inline;
168}
169#info-box1 select {
170     width: 14.5em;
171}
172#info-box1 a img, #info-box2 a img {
173     vertical-align: middle;
174     padding-left: .3em;
175     }
176#info-boxes a {
177     font-weight: bold;
178     color: #fff;
179     border-bottom-color: #ccc;
180     margin-left: .3em;
181     margin-right: .3em;
182     white-space: nowrap;
183     font-weight: normal;
184}
185#info-box1 a {
186     margin-left: 1.33em;
187}
188#info-box2 a.active {
189     border-bottom-color: #fff;
190     margin: 0;
191     padding: 1.2em .5em;
192     background-color: #fff;
193     color: #333;
194     font-weight: bold;
195}
196#info-box2 span {
197     color: #999;
198}
199/* main blocks */
200#wrapper {
201     width: 100%;
202}
203#main {
204     width: 100%;
205     float: right;
206     margin-left: -14.5em;
207     margin-top: 0;
208     background: #fff url(bg_menu.png);
209}
210#content {
211     margin: 0 0 0 14.5em;
212     padding: .9rem 1.8rem 1.8rem;
213     background: #fff;
214}
215     /* Micro clearfix thx to Nicolas Gallagher */
216     #content:before, #content:after {content:"";display:table;}
217     #content:after {clear:both;}
218/* -------------------------------------------------- layout - multipart */
219.three-cols {
220}
221.three-cols .col {
222     width: 32.3%;
223     float: left;
224     margin-left: 1%;
225}
226.three-cols .col:first-child {
227     width: 33.3%;
228     margin-left: 0;
229}
230.two-cols {
231     position: static;
232}
233.two-cols .col {
234     width: 49%;
235     margin-left: 2%;
236     float: left;
237}
238.two-cols .col:first-child {
239     width: 49%;
240     margin-left: 0;
241}
242.two-cols .col70{
243     width: 69%;
244     margin-left: 0;
245     float: left;
246}
247.two-cols .col30 {
248     width: 28%;
249     margin-left: 2%;
250     float: left;
251}
252/* -------------------------------------------------------------- layout - onglets */
253.part-tabs ul {
254     padding: .5em 0 .3em 1em;
255     border-bottom: 1px solid #ccc;
256}
257.part-tabs li {
258     list-style: none;
259     margin: 0;
260     display: inline;
261}
262.part-tabs li a {
263     padding: .5em 0.5em;
264     margin-right: .5em;
265     border: 1px solid #ccc;
266     border-bottom: none;
267     background: #dfdfdf;
268     text-decoration: none;
269     color: #000;
270     background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #fafafa) );
271     background:-moz-linear-gradient( center top, #dfdfdf 5%, #fafafa 100% );
272     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#fafafa');
273     background-color:#ededed;
274}
275.part-tabs li.part-tabs-link a {
276     background: #ffe;
277}
278.part-tabs li a:hover, .part-tabs li a:focus {
279     color: #000;
280     background: #fff;
281     border-bottom-color: #fff;
282}
283.part-tabs li.part-tabs-active a {
284     background: #fff;
285     border: 1px solid #d30e60;
286     color: #d30e60;
287     font-weight: bold;
288     border-bottom-color: #fff;
289}
290/* ------------------------------------------------------------------ main-menu */
291#main-menu {
292     width: 14.5em;
293     float: left;
294     margin:0;
295     padding-top: .5em;
296     padding-bottom: 1em;
297     background: #f7f7f7;
298}
299#main-menu h3 {
300     margin: 0;
301     padding: 1.2rem 0 1rem 2.2rem;
302     text-indent: -1.6rem;
303     color: #666;
304     font-size: 1.4rem;
305}
306#main-menu h3 img[alt="cacher"] {
307     vertical-align: top;
308}
309#main-menu ul {
310     margin: 0 0 1.8rem 0;
311     padding: 0;
312     list-style: none;
313}
314#main-menu li {
315     display: block;
316     margin: 0.5em 0 0;
317     padding: .3rem 0 0 30px;
318     background-repeat: no-repeat;
319     background-position: 8px .3em;
320}
321#main-menu a {
322     color: #333;
323     border-bottom-color: #ccc;
324}
325#main-menu .active a {
326     border-bottom: none;
327     color: #d30e60;
328}
329#main-menu .active {
330     font-weight: bolder;
331}
332#search-menu {
333     padding: .3rem .4rem 0;
334     font-size: 100%
335}
336#search-menu p {
337     display: inline-block;
338     border: 1px solid #999;
339     border-radius: .6em;
340     position: relative;
341     height: 2rem;
342     overflow: hidden;
343}
344#search-menu #q {
345     width: 12rem;
346     border-bottom-left-radius: .6em;
347     border-top-left-radius: .6em;
348     background: transparent url(search.png) no-repeat 4px center;
349     text-indent: 18px;
350     height: 2rem;
351     padding: 0 2px; 
352     border: none;
353}
354#search-menu input[type="submit"] {
355     padding: 0 0.3rem;
356     background: #dfdfdf;
357     border-color: #999;
358     color: #666;
359     border-bottom-right-radius: .6em;
360     border-top-right-radius: .6em;
361     border-top-left-radius: 0;
362     border-bottom-left-radius: 0;
363     text-shadow: none;
364     height: 2rem;
365     border: none;
366     border-left: 1px solid #aaa;
367     font-size: 1rem;
368}
369#search-menu input[type="submit"]:hover,
370#search-menu input[type="submit"]:focus {
371     background: #575859;
372     color: #fff;
373}
374#favorites-menu, #blog-menu, #system-menu, #plugins-menu {
375     border-bottom: 1px dashed #A2CBE9;
376}
377#favorites-menu h3 {
378     color: #000;
379     font-variant: small-caps;
380}
381#favorites-menu a {
382     color: #333;
383}
384/* ------------------------------------------------------------------ footer */
385#footer {
386     clear: both;
387     padding: .6rem 1.2rem .6rem 0;
388     text-align: right;
389     border-top: .1rem solid #ccc;
390}
391#footer p {
392     margin: 0;
393     padding: 0 1em;
394     font-size: 1em;
395}
396#footer p span.credit {
397     font-size: 1rem;
398     font-weight: normal;
399}
400/* ---------------------------------------------------------------------------- auth.php */
401#login-screen {
402     display: block;
403     width: 18em;
404     margin: 1.5em auto 0;
405     font-size: 1.4rem;
406}
407#login-screen h1 {
408     text-indent: -2000px;
409     background: transparent url(dc_logos/w-dotclear240.png) no-repeat top left;
410     height: 66px;
411     margin-bottom: .5em;
412     margin-left: 0;
413}
414#login-screen fieldset, #login-screen .fieldset {
415     border: 1px solid #A8DC26;
416     padding: 1em 1em 0 1em;
417     border-radius: 4px;
418}
419#login-screen legend {
420     border: 1px solid #A8DC26;
421}
422#login-screen input[type=text], #login-screen input[type=password], #login-screen input[type=submit] {
423     width: 100%;
424}
425#login-screen #issue {
426     margin-left: 1.5rem;
427     font-size: 1.2rem;
428}
429#login-screen #issue strong {font-weight: normal;}
430
431
432/* ------------------------------------------------------------------ dashboard */
433#dashboard-main {
434     float: left;
435     overflow: hidden;
436     padding: 1em 2% 1em 0;
437     width: 70%;
438}
439#dashboard-main.fullwidth {
440     width: 100%;
441     padding: 1em 0;
442     float: none;
443}
444#icons {
445     overflow: hidden;
446     padding-bottom: 1em;
447     text-align: center;
448}
449#icons p {
450     width: 210px;
451     text-align: center;
452     margin: 2em 0;
453     display:inline-block;
454}
455#icons a,
456#icons a:link,
457#icons a:visited,
458#icons a:hover,
459#icons a:focus {
460     border-bottom-width: 0px;
461     text-decoration: none;
462}
463#icons a span {
464     border-bottom: 1px dotted #f90;
465}
466#icons a:focus span, #icons a:hover span {
467     text-decoration: underline;
468}
469#quick {
470     clear: left;
471     margin-top: 2em;
472}
473#quick h3 {
474     margin-bottom: 0.2em;
475     font-size: 1.2em;
476}
477#quick p.qinfo {
478     margin: -.7em -1em 1em;
479     background: #eef url(info.png) no-repeat .2em .2em;
480     border: 1px solid #99f;
481     padding: .2em 1em .1em 24px;
482     color: #666;
483}
484#dashboard-items {
485     float: left;
486     width: 27%;
487     overflow: hidden;
488     padding-bottom: 1em;
489     padding-top: 3em;
490}
491#dashboard-items img {
492     vertical-align: middle;
493}
494#dashboard-items ul {
495     display: block;
496     padding-left: 1.5em;
497     list-style: square;
498}
499#dashboard-items li {
500     margin: 0.25em 0 0 0;
501     color: #666;
502}
503#news dt {
504     font-weight: bold;
505     margin: 0 0 0.4em 0;
506}
507#news dd {
508     margin: 0 0 1em 0;
509}
510#news dd p {
511     margin: 0.2em 0 0 0;
512}
513
514#upg-notify {
515}
516#upg-notify ul {
517     padding-left: 15px;
518}
519#upg-notify li {
520     color: #fff;
521}
522/* ------------------------------------------------------------------ post */
523#entry-wrapper {
524     float: left;
525     width: 100%;
526     margin-right: -18em;
527}
528#entry-content {
529     margin-right: 19em;
530     margin-left: 1.2rem;
531}
532#entry-sidebar {
533     width: 17em;
534     float: right;
535}
536#comments {
537     clear: both;
538}
539.preview_entry a {
540     border: 1px solid #ccc;
541     padding: .2rem .5rem;
542     background: #eef;
543}
544/* ------------------------------------------------------------------ categories */
545#categories {
546     margin: 1em 0 2em;
547}
548#categories ul {
549     list-style: none;
550     margin: 0;
551     padding: 0;
552}
553#categories li {
554     margin: .5em 0;
555     padding: .3em 1.5em;
556     border: 1px solid #ccc;
557     border-left: 1em solid #E5E3DA;
558     border-radius: .3em;
559}
560#categories h4 {
561     margin: 0;
562}
563#categories h4 span {
564     font-weight: normal;
565}
566#categories li p {
567     margin: 0;
568}
569select#del_cat {
570     width: 100%;
571}
572/* ------------------------------------------------------------------ media */
573#media-icon {
574     float: left;
575}
576#media-details {
577     margin-left: 70px;
578}
579#media-details ul {
580     display: block;
581     margin-left: 0;
582     padding: 0;
583}
584#media-details li {
585     list-style: square inside;
586     margin: 0;
587     padding: 0;
588}
589#media-original-image {
590     overflow: auto;
591}
592#media-original-image.overheight {
593     height: 500px;
594}
595#add-file-f {
596     position: relative;
597}
598#add-file-f .more-file {
599     position:absolute;
600     right: 0.5em;
601     background: #999;
602     color: #fff;
603     border: none;
604}
605.media-list {
606     position: static;
607}
608.media-col-0 {
609     clear: left;
610}
611.media-item {
612     position: relative;
613     border-top: 1px solid #ccc;
614     margin-bottom: 1em;
615     padding: 5px 0;
616}
617div.media-list .media-item {
618     width: 49%;
619     float: left;
620     margin-right: 1%;
621}
622a.media-icon {
623     display: block;
624     border-bottom: none;
625     float: left;
626}
627.media-icon img {
628     display: block;
629}
630.media-item ul {
631     display: block;
632     list-style: none;
633     margin: 0 0 0 60px;
634     padding: 0;
635}
636li.media-action {
637     display: block;
638     position: absolute;
639     top: 5px;
640     right: 5px;
641     height: 16px;
642}
643li.media-action a {
644     border: none;
645}
646li.media-action form {
647     display: inline;
648}
649li.media-action input {
650     border: none;
651}
652/* ------------------------------------------------------------------ preferences */
653#my-favs ul {
654     list-style-type: none;
655     margin-left: 0;
656     padding-left: 0;
657     line-height: 1.2;
658}
659#my-favs li {
660     display: block;
661     float: left;
662     width: 164px;
663     margin-top: 1em;
664     margin-bottom: 1.5em;
665}
666#my-favs label {height: 2.5em;width:140px;margin-top:.3em;}
667#my-favs label input {display:inline;}
668#my-favs img {
669     display: block;
670}
671#my-favs input.position {
672     margin: 0 0 .4em .2em;
673}
674#available-favs input, #available-favs label, #available-favs label span {
675     white-space: normal;
676     display: inline;
677}
678#default-favs h3 {
679     margin-top: 2em;
680     margin-bottom: 1em;
681}
682.fav-list {
683     list-style-type: none;
684     margin-left: 0;
685     padding-left: 0;
686}
687.fav-list li {
688     line-height: 2;
689     margin-left: 0;
690     padding-left: 0;
691     position: relative;
692}
693.fav-list img {
694     vertical-align: middle;
695     margin-right: .2em;
696}
697#available-favs label span.zoom {
698     display: none;
699}
700#available-favs li:hover label span.zoom {
701     display: block;
702     position: absolute;
703     bottom: 0;
704     left: 10em;
705     background-color: #f5f5f5;
706     border: 1px solid #ddd;
707     padding: .2em;
708     border-radius: .5em;
709}
710/* -------------------------------------------------------------------- Themes */
711#themes {
712     border-bottom: 1px solid #ccc;
713     margin: 1em 0;
714}
715#themes div.theme-details {
716     clear: left;
717     border-top: 1px solid #ccc;
718     padding: 1em 0;
719}
720#themes div.theme-details:hover {
721     background: #eee;
722}
723#themes div.theme-details div.theme-shot {
724     float: left;
725}
726#themes div.theme-details div.theme-shot img {
727     display: block;
728     width: 57px;
729     height: 50px;
730     border: 1px solid #ccc;
731}
732#themes div.theme-details div.theme-info {
733     margin-left: 67px;
734}
735#themes div.theme-details div.theme-info span.theme-desc {
736     display: block;
737}
738#themes div.theme-details div.theme-info span.theme-version {
739     color: #666;
740}
741#themes div.theme-details div.theme-actions {
742     margin-left: 67px;
743}
744/* Themes list, JS version */
745#themes-wrapper {
746}
747#theme-box {
748     border: 1px solid #999;
749     border-left: none;
750     padding: 5px;
751     float: right;
752     height: 420px;
753     width: 320px;
754     overflow: auto;
755}
756#theme-box div.theme-shot img {
757     display: block;
758     margin: 0 0 0 10px;
759     width: 280px;
760     height: 245px;
761     border: 1px solid #ccc;
762}
763#theme-box div.theme-info {
764     margin: 1em 0 0 10px;
765}
766#theme-box h3 {
767     margin: 0;
768}
769#theme-box div.theme-info span {
770     display: block;
771}
772#theme-box span.theme-version {
773     color: #666;
774}
775#theme-box span.theme-parent-ok {
776     color: #666;
777}
778#theme-box span.theme-parent-missing {
779     color: #c00;
780     font-weight:bold;
781}
782#theme-box div.theme-actions {
783     margin-left: 10px;
784}
785#themes-wrapper #themes {
786     border: 1px solid #999;
787     overflow: auto;
788     height: 420px;
789     padding: 5px;
790     margin: 0;
791}
792#themes div.theme-details-js {
793     float: left;
794     width: 120px;
795     height: 150px;
796     margin: 0 10px 20px;
797     padding: 10px 10px 0;
798     text-align: center;
799     background: #f3f3f3;
800     border: 1px solid #f3f3f3;
801     cursor: pointer;
802     border-radius: 4px;
803}
804#themes div.theme-details-js label {
805     cursor: pointer;
806}
807#themes div.theme-details-js.theme-selected {
808     background: #E5E3DA;
809     border: 1px solid #999;
810}
811#themes div.theme-details-js div.theme-shot img {
812     width: 120px;
813     height: 105px;
814     border: 1px solid #fff;
815}
816#themes div.theme-details-js h3 {
817     font-family: inherit;
818     font-weight: normal;
819     margin: 0;
820     padding: 0;
821}
822/* ----------------------------------------------------------  Plugins list */
823#plugins td.action {
824     vertical-align: middle;
825}
826
827select.l10n option {
828     padding-left: 16px;
829}
830option.avail10n {
831     background: transparent url(../images/check-on.png) no-repeat 0 50%;
832}
833/* ------------------------------------------------------------------ contextual help */
834#help {
835     margin-top: 4em;
836     background: #f5f5f5;
837     z-index: 100;
838}
839#help-button {
840     background: transparent url(../images/page_help.png) no-repeat 6px center;
841     position: absolute;
842     top: 3.6rem;
843     right: 0px;
844     padding: 0 2rem 0 3rem;
845     cursor: pointer;
846     color: #2373A8;
847     line-height: 4.2rem;
848}
849#help-button span {
850     padding: .6rem 0 .1rem 0;
851     border-bottom: 1px solid #2373A8;
852}
853.help-box {
854     display: none;
855}
856.help-box ul {
857     padding-left: 20px;
858     margin-left: 0;
859}
860#content.with-help #help-button {
861     right: 28.2rem;
862     background-color: #f5f5f5;
863     position: fixed;
864     border-top: 2px solid #FFD478;
865     border-left: 2px solid #FFD478;
866     border-bottom: 2px solid #FFD478;
867     border-bottom-left-radius: 1rem;
868     border-top-left-radius: 1rem;
869}
870#content.with-help #help {
871     display: block;
872     position: absolute;
873     top: 3.6rem;
874     right: 0;
875     width: 28rem;
876     border-left: 2px solid #FFD478;
877     border-top: 2px solid #FFD478;
878     margin-top: 0;
879     padding: 10px 0 0 0;
880     overflow: auto;
881}
882#content.with-help .help-content {
883     padding: 0 5px 1em 5px;
884}
885.help-content dt {
886     font-weight: bold;
887     color: #626262;
888     margin: 0;
889}
890.help-content dd {
891     margin: 0.3em 0 1.5em 0;
892}
893/* ------------------------------------------------------------------ popups */
894body.popup #wrapper, body.popup #top {
895     width: 100%;
896     padding: 0;
897}
898body.popup #wrapper {
899     float: none;
900     margin:0;
901     display: block;
902}
903body.popup h1, body.popup #top {
904     margin: 0;
905     border-bottom: 1px solid;
906     font-weight: normal;
907     color: #fff;
908     background: #575859;
909     font-size: 1.5em;
910     text-indent: .6rem;
911     line-height: 1.3em;
912}
913body.popup #main {
914     margin-bottom: 1em 0;
915}
916body.popup #content {
917     margin: 0;
918     padding: .6rem 0 !important;
919}
920body.popup #content h2 {
921     margin: 0 0 1em;
922}
923body.popup #footer p {
924     border: none;
925}
926/* ------------------------------------------------------------------ messages */
927div.error, p.error, 
928div.message, p.message, 
929div.static-msg, p.static-msg {
930     padding: 0.5em 0.5em 0.5em 48px;
931     margin-bottom: 1em;
932     border-radius: 8px;
933}
934p.error, p.message, p.static-msg {
935     padding-top: 1rem;
936     padding-bottom: 1rem;
937}
938div.error, p.error {
939     background: #ffdec8 url(msg-error.png) no-repeat .7em .7em;
940     color: #000;
941}
942div.message, p.message, 
943div.static-msg, p.static-msg {
944     background: #666 url(msg-std.png) no-repeat .7em .7em;
945     color: #fff;
946}
947div.message a, p.message a, 
948div.static-msg a, p.static-msg a {
949     color: #fff;
950}
951#content > .message, #content > .error {
952     margin-right: 14em
953}
954/* ------------------------------------------------------------------ navigation */
955.anchor-nav {
956     background: #575859;
957     color: #fff;
958     padding: .4rem 1.2rem;
959     float: right;
960}
961/* ------------------------------------------------------------------ debug */
962#debug {
963     position: absolute;
964     top: 0;
965     width: 100%;
966     height: 4px;
967     background: #d99;
968}
969#debug div {
970     display: none;
971     padding: 3px 0.5em 2px;
972}
973#debug p {
974     margin: 0.5em 0;
975}
976#debug:hover {
977     height: auto;
978}
979#debug:hover div {
980     display: block;
981}
982/* -------------------------------------------------------------------- CLASSES COMMUNES */
983
984.no-margin {
985     margin: 0;
986}
987
988/* paragraphe pour bouton Nouveau bidule */
989p.top-add {
990     text-align: right;
991     margin: 0;
992     }
993p.top-add a {
994     padding: .3em 1em .3em .5em;
995     font-weight: bold;
996}
997p.top-add a img {
998     padding-right: .3em;
999     vertical-align: middle;
1000}
1001/* Si quelque chose a besoin d'être caché sauf pour les revues d'écran */
1002.hidden {
1003    position: absolute !important;
1004    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
1005    clip: rect(1px, 1px, 1px, 1px);
1006    padding: 0 !important;
1007    border: 0 !important;
1008    height: 1px !important;
1009    width: 1px !important;
1010    overflow: hidden;
1011    }
1012.clear {
1013     clear: both;
1014}
1015.lclear {
1016     clear: left;
1017}
1018div.clearer {
1019     height: 1px;
1020     font-size: 1px;
1021}
1022.hide {
1023     display: none;
1024}
1025.right {
1026     text-align: right;
1027}
1028.frame-shrink {
1029     border: 1px solid #666;
1030     padding: 0.5em;
1031     margin-bottom: 1em;
1032     height: 120px;
1033     overflow: auto;
1034}
1035.grid {
1036     background: transparent repeat url('grid.png') 0 0;
1037}
1038.line p {
1039     margin: 0;
1040}
1041.offline {
1042     color: #666;
1043}
1044ul.nice {
1045     margin: 1em 0;
1046     padding: 0 0 0 2em;
1047     list-style: square;
1048}
1049ul.nice li {
1050     margin:0;
1051     padding: 0;
1052}
1053.zip-dl {
1054     background: transparent url(package.png) no-repeat 0 50%;
1055     padding: 5px 0 5px 20px;
1056}
1057/* pas trouvé dans le code */
1058.comment {
1059     border-top: 2px solid #ccc;
1060     margin-bottom: 1em;
1061     padding: 2em 0 1em 0;
1062     position: relative;
1063}
1064.comment form p {
1065     margin: 0;
1066     position: absolute;
1067     top: 2px;
1068     right: 0;
1069}
1070.distrib img {
1071     display: block;
1072     float: right;
1073     margin-top: -1em;
1074}
1075/* TABLES
1076-------------------------------------------------------- */
1077table {
1078     font-size: 1.2rem;
1079     border-collapse: collapse;
1080     margin: 0 0 1em 0;
1081}
1082tr.line:hover {
1083     background: #f3f3f3;
1084}
1085caption {
1086     color: #333;
1087     font-weight: bold;
1088     text-align: left;
1089     margin-bottom: .5em;
1090}
1091
1092th, td {
1093     border-width: 0 0 1px 0;
1094     border-style: solid;
1095     border-color: #e3e3e3;
1096     padding: .4rem .5rem;
1097     vertical-align: top;
1098}
1099th {
1100     text-align: left;
1101     border-bottom-color: #aaa;
1102}
1103.noborder td, td.noborder, .noborder th, th.noborder {
1104     border-width: 0;
1105}
1106table .maximal, table.maximal {
1107     width: 100%;
1108}
1109table .minimal {
1110     width: 1px;
1111}
1112table .nowrap {
1113     white-space: nowrap;
1114     vertical-align: top;
1115}
1116table.settings, table.prefs {
1117     width: 80%;
1118}
1119table.settings th:first-child, table.prefs th:first-child {
1120     width: 20%;
1121}
1122table.settings th + th, table.prefs th + th {
1123     width: 30%;
1124}
1125table.settings th + th + th, table.prefs th + th + th {
1126     width: 10%;
1127}
1128table.settings th:last-child, table.prefs th:last-child {
1129     width: 40%;
1130}
1131
1132td.status {
1133     vertical-align: middle;
1134}
1135td.status img {
1136     margin-bottom: -2px;
1137}
1138td.status a {
1139     border: none;
1140}
1141
1142tr.line img.expand {
1143     margin-right: 10px;
1144     margin-bottom: -2px;
1145}
1146tr.line input {
1147     vertical-align: middle;
1148}
1149tr.expand td {
1150     border-bottom: none;
1151}
1152td.expand {
1153     padding: 1em;
1154}
1155
1156.dragable {
1157     border-collapse: separate;
1158}
1159.dragable tbody td {
1160
1161}
1162.handle {
1163     padding: 0;
1164}
1165.handler {
1166     cursor: move;
1167     background: transparent url(drag.png) no-repeat 0 50%;
1168     padding-left: 15px;
1169}
1170
1171/* ----------------------------------------------------------------- FORMS */
1172form {
1173     display: block;
1174     margin: 0;
1175     padding: 0;
1176}
1177fieldset, .fieldset {
1178     display: block;
1179     margin: 0 0 1em 0;
1180     padding: 1em 0.5em;
1181     border-width: 1px 0;
1182     border-style: solid;
1183     border-color: #ccc;
1184     background: #f5f5f5;
1185}
1186legend {
1187     font-weight: bold;
1188     padding: 0.2em 0.6em;
1189     border-width: 1px;
1190     border-style: solid;
1191     border-color: #ccc;
1192     background: #f5f5f5;
1193     margin-bottom: 0.5em;
1194}
1195optgroup {
1196     font-weight: bold;
1197     font-style: normal;
1198}
1199option {
1200     font-weight: normal;
1201}
1202input, textarea, select {
1203     background: #f9f9f9;
1204     color: #000;
1205     border-width: 1px;
1206     border-style: solid;
1207     border-color: #666 #ccc #ccc #999;
1208}
1209input.invalid, textarea.invalid, select.invalid {
1210     border: 1px solid red;
1211     background: #fff; 
1212     color: red;
1213     box-shadow: 0 0 0 1px rgba(218, 62, 90, 0.3)
1214}
1215input, textarea, select, option {
1216     font: 100% "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
1217}
1218input[type=text], input[type=password], textarea {
1219     padding: 2px 0;
1220     margin-right: .3em;
1221}
1222textarea {
1223     padding: 2px 0;
1224}
1225input[type=checkbox], input[type=radio], input[type=file] {
1226     border: none;
1227     margin: 0;
1228     padding: 0;
1229     background: transparent;
1230}
1231label {
1232     display: block;
1233}
1234label input, label select, label span {
1235     display: block;
1236}
1237p.form-note {
1238     font-style:italic;
1239     margin-top: -.7em;
1240     color: #666;
1241}
1242span.form-note {
1243     font-style:italic;
1244     font-weight: normal;
1245     color: #666;
1246}
1247p.form-note.warn, p.form-note.info, p.warning {
1248     font-style: normal;
1249     padding: .2em 1em .1em 24px;
1250}
1251p.form-note.warn, p.warning {
1252     background: #ffd url(warning.png) no-repeat .3em .3em;
1253     border: 1px solid #f0c020;
1254}
1255p.form-note.info {
1256     background: #eef url(info.png) no-repeat .3em .2em;
1257     border: 1px solid #99f;
1258}
1259.form-note a {border-bottom: 1px solid #99f;}
1260
1261label.classic {
1262     display: inline;
1263}
1264label.classic input, label span input, label.classic select, label span select {
1265     display: inline;
1266}
1267
1268label.area, p.area {
1269     width: inherit !important;
1270}
1271.area textarea {
1272     display: block;
1273     width: 100%;
1274     resize: vertical;
1275}
1276label.required {
1277     font-weight: bold;
1278}
1279label.required abbr {
1280     color: #dd0000;
1281     font-size: 1.3em;
1282}
1283label.inline {
1284     display: inline;
1285}
1286p.field {
1287     position: relative;
1288     
1289}
1290p.field label {
1291     display: block;
1292     width: 14em;
1293}
1294p.field input, p.field select {
1295     display: inline;
1296     position: absolute;
1297     left: 14.5em;
1298     top: 0;
1299}
1300label .maximal, textarea.maximal, input.maximal {
1301     width: 100%;
1302}
1303textarea.maximal {
1304     resize: vertical;
1305}
1306
1307a.form-control {
1308     display: none;
1309     font-weight: bold;
1310     background: url(magnifier.png) no-repeat 0 0;
1311     color: green;
1312     padding-left: 20px;
1313}
1314.constrained {
1315     margin: 0;
1316     padding: 0;
1317     border: none;
1318     background: transparent;
1319}
1320
1321/* --------------------------------------------------------------- buttons */
1322/* commun */
1323input[type=submit],
1324input[type=reset],
1325input[type=button],
1326a.button,
1327a.back,
1328a.submit {
1329     display: inline-block;
1330     outline: none;
1331     cursor: pointer;
1332     text-align: center;
1333     text-decoration: none;
1334     padding: .1em .5em;
1335     text-shadow: 0 1px 1px rgba(0,0,0,.3);
1336     border-radius: .2em;
1337     margin-bottom: .1em;
1338}
1339/* validation */
1340input[type=submit],
1341input[type=button],
1342a.submit {
1343     color: #fff;
1344     border: 1px solid #2373A8;
1345     background: #2373A8;
1346     background: -webkit-gradient(linear, left top, left bottom, from(#2C8FD1), to(#2373A8));
1347     background: -moz-linear-gradient(top,  #2C8FD1,  #2373A8);
1348}
1349input[type=submit]:hover,
1350input[type=button]:hover,
1351a.submit:hover,
1352input[type=submit]:focus,
1353input[type=button]:focus,
1354a.submit:focus {
1355     background: #2373A8;
1356     background: -webkit-gradient(linear, left top, left bottom, from(#2373A8), to(#2C8FD1));
1357     background: -moz-linear-gradient(top,  #2373A8,  #2C8FD1);
1358     filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#2373A8', endColorstr='#2C8FD1');
1359     border: 1px solid #2C8FD1;
1360}
1361/* suppression et reset */
1362a.button,
1363a.back,
1364input[type=submit].reset,
1365input[type=submit].delete {
1366     border: 1px solid #ccc;
1367     background: #f5f5f5;
1368     color: #000;
1369     background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#dfdfdf));
1370     background: -moz-linear-gradient(top,  #f5f5f5,  #dfdfdf);
1371     text-shadow: none;
1372     }
1373a.button:hover,
1374a.back:hover,
1375input[type=reset]:hover,
1376input[type=submit].reset:hover,
1377input[type=submit].delete:hover,
1378a.button:focus,
1379a.back:focus,
1380input[type=reset]:focus,
1381input[type=submit].reset:focus,
1382input[type=submit].delete:focus {
1383     background: #dfdfdf;
1384     background: -webkit-gradient(linear, left top, left bottom, from(#dfdfdf), to(#f5f5f5));
1385     background: -moz-linear-gradient(top,  #dfdfdf,  #f5f5f5);
1386     filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#e5e5e5', endColorstr='#f5f5f5');
1387     }
1388a.delete,
1389input.delete,
1390input[type=submit].delete {
1391     color: #c00;
1392     padding-bottom: .1em;
1393}
1394#entry-content .delete {
1395     margin-left: 1em;
1396}
1397a.delete:hover,
1398input.delete:hover,
1399input[type=submit].delete:hover,
1400a.delete:focus,
1401input.delete:focus,
1402input[type=submit].delete:focus {
1403     border-color: #c00;
1404}
1405/* finasseries */
1406input[type=button] {
1407     padding: .1em;
1408}
1409#info-box a.button {
1410     padding: 0 .5em;
1411     margin-left: 2em;
1412}
1413a.back:before {
1414     content: "\ab\a0";
1415}
1416.button.add {
1417     background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
1418     background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
1419     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
1420     background-color:#9dce2c;
1421     border:1px solid #83c41a;
1422     padding:.6rem 1.8rem;
1423     text-shadow:1px 1px 0 #689324;
1424     color: #000;
1425     text-shadow: 1px 1px 0 #BBDB58;
1426     font-weight: normal;
1427     font-size: 1.4rem;
1428}
1429.button.add:hover, .button.add:focus {
1430     background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
1431     background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
1432     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
1433     background-color:#8cb82b;
1434     border:1px solid #83c41a;
1435}
1436.button-add:focus {
1437     outline: dotted 1px;
1438}
1439.button.add:active {
1440     position:relative;
1441     top:1px;
1442}
1443
1444/* jQuery Autocomplete plugin */
1445.ac_results {
1446     padding: 0px;
1447     border: 1px dotted #f90;
1448     background-color: white;
1449     overflow: hidden;
1450     z-index: 99999;
1451}
1452.ac_results ul {
1453     width: 100%;
1454     list-style-position: outside;
1455     list-style: none;
1456     padding: 0;
1457     margin: 0;
1458}
1459.ac_results li {
1460     margin: 0px;
1461     padding: 2px 5px;
1462     cursor: default;
1463     display: block;
1464     font: menu;
1465     font-size: 1em;
1466     line-height: 16px;
1467     overflow: hidden;
1468}
1469.ac_loading {
1470     background: transparent url('loader.gif') right center no-repeat;
1471}
1472.ac_over {
1473     background-color: #06c;
1474     color: white;
1475}
1476
1477/* ---------------------------------------------------------------------------
1478     Media queries vite fait en attendant la reprise complète du layout
1479---------------------------------------------------------------------------- */
1480@media screen and (max-width: 920px) {
1481     #top, #top h1 a {width: 42px !important; height:100%; overflow: hidden;}
1482     #top h1 a:link {
1483          background: transparent url(dc_logos/b-dotclear120.png) no-repeat -180px 6px; 
1484          border-right: 1px solid #ccc;
1485     }
1486     #top h1 a:hover, #top h1 a:focus {
1487          background: url(dc_logos/b-dotclear120.png) no-repeat -180px -94px;
1488          border-right: 1px solid #A2CBE9;
1489     }
1490}
1491@media screen and (max-width: 800px) {
1492     #top, #info-boxes, #info-box1, #info-box2 {
1493          display:inline-block;
1494          vertical-align:middle;
1495          margin:0;
1496          padding:0;
1497          line-height: 3.2rem;
1498     }
1499     #info-box1 select {width: 14rem;}
1500     #main-menu, #main, #content, #content h2, #entry-wrapper, #entry-sidebar, #entry-content, .two-cols .col, .two-cols .col:first-child {
1501     display:block;
1502     width: 98%;
1503     margin:0 auto;
1504     padding:0;
1505     float:none;
1506     text-align: left;
1507     clear: both;
1508     }
1509     #content {
1510          width: 100%;
1511          padding-top: .5em;
1512     }
1513}
1514@media screen and (max-width: 720px) {
1515     .smallscreen {display: none;}
1516     #help-button {width:20px; overflow: hidden;}
1517     #info-box1 {margin-left: 1rem;}
1518}
1519@media screen and (max-width: 492px) {
1520     #header {height:3.6rem;}
1521     #wrapper {font-size: 1.6rem;}
1522     .page-title, #info-boxes, .media-item {display: inline-block;}
1523     div.media-list .media-item {width: 90%; float: none}
1524     #info-box1 p.nomobile, label.nomobile {display: none;}
1525     #help-button {height:26px; width:26px; background-color: #A2CBE9; padding: 0; margin:0;font-size: 1rem;line-height: 68px}
1526}
Note: See TracBrowser for help on using the repository browser.

Sites map