Dotclear

source: admin/style/default.css @ 1547:22dcc292b34d

Revision 1547:22dcc292b34d, 34.2 KB checked in by Anne Kozlika <kozlika@…>, 12 years ago (diff)

Categories page: work in progress with nikrou

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

Sites map