Dotclear

source: admin/style/default.css @ 1383:7e9ddde15415

Revision 1383:7e9ddde15415, 29.5 KB checked in by Anne Kozlika <kozlika@…>, 11 years ago (diff)

Poils de c[arotte] dans les CSS

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

Sites map