Dotclear

source: admin/style/default.css @ 0:54703be25dd6

Revision 0:54703be25dd6, 17.2 KB checked in by Dsls <dsls@…>, 14 years ago (diff)

2.3 branch (trunk) first checkin

Line 
1/*
2# -- BEGIN LICENSE BLOCK ---------------------------------------
3#
4# This file is part of Dotclear 2.
5#
6# Copyright (c) 2003-2010 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*/
13body {
14     font: 62.5%/1.5em "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
15     color : #000;
16     background : #fff;
17     margin : 0;
18     padding : 0;
19}
20body.auth {
21     background-image: none;
22}
23
24a img,:link img,:visited img { border:none }
25
26a, a:link, a:visited {
27     color : #06c;
28     text-decoration : none;
29     border-bottom : 1px dotted #f90;
30}
31a:hover, a:active, a:focus {
32     
33}
34
35h1, h2, h3, h4, h5, h6, p {
36     margin-top : 0;
37     margin-bottom: 0.6em;
38}
39
40h2 {
41     font-family : Arial,Helvetica,sans-serif;
42     color : #069;
43     font-size : 1.4em;
44     padding: 4px 0;
45}
46
47h3 {
48     font-family : Arial,Helvetica,sans-serif;
49     color : #333;
50     font-size : 1.2em;
51}
52
53p, div.p {
54     margin : 0 0 1em 0;
55}
56
57hr {
58     height : 1px;
59     border-width : 1px 0 0 0;
60     border-color : #999;
61     border-style : solid;
62}
63
64pre, code {
65     font: 100% "Andale Mono","Courier New",monospace;
66}
67pre {
68     white-space: pre;
69     white-space: -moz-pre-wrap;
70     white-space: -hp-pre-wrap;
71     white-space: -o-pre-wrap;
72     white-space: -pre-wrap;
73     white-space: pre-wrap;
74     white-space: pre-line;
75     word-wrap: break-word;
76}
77
78
79/* LAYOUT
80-------------------------------------------------------- */
81/* General font-size */
82#top, #info-box, #main, #main-menu, #footer {
83     font-size: 1.1em;
84}
85
86#top {
87     margin : 0;
88     padding : 0;
89     background : transparent url(head-bg.png) repeat-x;
90}
91#top h1 {
92     padding : 0;
93     margin : 0;
94     height : 58px;
95     text-indent : -1000px;
96     background : transparent url(head-logo.png) no-repeat 0 0;
97}
98#top h1 a {
99     position: absolute;
100     top: 3px;
101     left: 0;
102     width: 130px;
103     height: 35px;
104     border: none;
105     outline: none;
106}
107
108#info-box {
109     position : absolute;
110     right : 10px;
111     top : 3px;
112     margin : 0;
113     padding : 3px 3px 4px 15px;
114     color: #fff;
115}
116#info-box div {
117     margin: 0; padding: 0;
118}
119#info-box div div {
120     display: inline;
121}
122#info-box>form>div {
123     line-height: 18px;
124}
125#info-box select {
126     width : 160px;
127}
128#info-box a.logout {
129     font-weight : bold;
130     color: #fff;
131}
132
133#wrapper {
134     background: transparent url(page-bg.png) repeat-y top left;
135     width: 100%;
136}
137#main {
138     width : 100%;
139     float : right;
140     margin-left : -155px;
141     margin-top : 0;
142}
143
144#content {
145     margin-left : 155px;
146     margin-bottom : 10px;
147     padding-top : 1px;
148     margin-right : 15px;
149}
150
151#main-menu {
152     width : 135px;
153     float : left;
154     margin-top : 0;
155     margin-bottom : 10px;
156}
157#main-menu h3 {
158     margin : 0 0 0.5em 0;
159     padding : 0 0 0 5px;
160     text-transform: uppercase;
161     color: #7e7d77;
162}
163#main-menu ul {
164     margin : 0 0 1em 4px;
165     padding : 0;
166     list-style : none;
167}
168#main-menu li {
169     display : block;
170     margin : 0.5em 0 0 5px;
171     padding : 2px 0 1px 20px;
172     background-repeat: no-repeat;
173     background-position: 0 0;
174}
175#main-menu a {
176     font-weight : bold;
177}
178#main-menu .active a {
179     border-bottom-style: solid;
180}
181#main-menu #dashboard-menu li {
182     margin-left: 0;
183}
184#main-menu #menu-new-post a {
185     padding : 2px;
186     background: #7e7d77;
187     color: #fff;
188     border: 1px solid #7e7d77;
189     -moz-border-radius: 3px;
190     -webkit-border-radius: 3px;
191}
192#main-menu #menu-new-post a:hover, #main-menu #menu-new-post a:focus {
193     background: #666;
194}
195
196#footer {
197     clear : both;
198     margin: 0;
199     padding: 40px 0 0 0;
200     background: #fff url(footer-bg.png) no-repeat top left;
201}
202#footer p * {
203     vertical-align: bottom;
204}
205#footer p {
206     margin: 0 15px 0 155px;;
207     padding: 3px 0 20px 0;
208     border-top: 1px solid #dedcd1;
209     color: #93928a;
210     text-align: right;
211     font-size: 1.1em;
212}
213
214#debug {
215     position: absolute;
216     top: 0;
217     width: 100%;
218     height: 4px;
219     background: #d99;
220}
221#debug div {
222     display: none;
223     padding: 3px 0.5em 2px;
224}
225#debug p {
226     margin : 0.5em 0;
227}
228#debug:hover {
229     height: auto;
230}
231#debug:hover div {
232     display: block;
233}
234
235/* DASHBOARD */
236#dashboard-main {
237     float: left;
238     overflow: hidden;
239     padding-bottom: 1em;
240     width: 66%;
241}
242#dashboard-main #icons {
243     overflow: hidden;
244     padding-bottom: 1em;
245}
246#dashboard-main #icons p {
247     float: left;
248     width: 32%;
249     text-align: center;
250     margin: 2em 0 0 0;
251}
252#dashboard-main #icons span {
253     display: block;
254}
255#dashboard-main #icons a {
256     border-bottom-width: 0;
257}
258#dashboard-main #icons span a {
259     border-bottom-width: 1px;
260}
261
262#dashboard-main #quick {
263     clear: left;
264     margin-top: 2em;
265}
266#dashboard-main #quick h3 {
267     margin-bottom: 0.2em;
268     font-size: 1.4em;
269}
270#dashboard-main #quick p.qinfo {
271     margin: -1em -1em 1em;
272     padding: 1em;
273     background: #ebeadd;
274}
275
276#dashboard-items {
277     float: left;
278     width: 31%;
279     overflow: hidden;
280     margin-left: 2%;
281     padding-bottom: 1em;
282     font-size: 1.2em;
283}
284#dashboard-items p img {
285     vertical-align: middle;
286}
287#dashboard-items ul {
288     display: block;
289     padding-left: 1.5em;
290     list-style: square;
291}
292#dashboard-items li {
293     margin: 0.25em 0 0 0;
294     color: #666;
295}
296#dashboard-items #news dt {
297     font-weight: bold;
298     margin: 0 0 0.4em 0;
299}
300#dashboard-items #news dd {
301     font-size: 0.9em;
302     margin: 0 0 1em 0;
303}
304#dashboard-items #news dd p {
305     margin: 0.2em 0 0 0;
306}
307#upg-notify {
308     font-size: 0.9em;
309}
310#upg-notify ul {
311     padding-left: 15px;
312}
313#upg-notify li {
314     color: #fff;
315}
316
317/* POST */
318#entry-sidebar {
319     width : 200px;
320     float : right;
321}
322#entry-content {
323     margin-right : 220px;
324}
325#comments {
326     clear : both;
327}
328
329/* CATEGORIES */
330#categories {
331     margin: 1em 0 2em;
332}
333#categories ul {
334     list-style: none;
335     margin: 0 0 0 0;
336     padding: 0 0 0 0;
337}
338#categories ul li {
339     margin: 1em 0 0 0;
340     padding: 5px 10px 1em 30px;
341     border: 1px solid #ccc;
342     background: transparent url(cat-bg.png) repeat-y top left;
343     -moz-border-radius: 4px;
344     -webkit-border-radius: 4px;
345}
346#categories ul li h4 {
347     margin: 0;
348}
349#categories ul li h4 span {
350     font-weight: normal;
351}
352#categories ul li p {
353     margin: 0;
354}
355select#del_cat {
356     width: 100%;
357}
358
359/* MEDIA */
360#media-icon {
361     float: left;
362}
363#media-details {
364     margin-left: 70px;
365}
366#media-details ul {
367     display: block;
368     margin-left: 0;
369     padding: 0;
370}
371#media-details li {
372     list-style: square inside;
373     margin: 0;
374     padding: 0;
375}
376#media-original-image {
377     overflow: auto;
378}
379#media-original-image.overheight {
380     height: 500px;
381}
382
383#add-file-f {
384     position: relative;
385}
386#add-file-f .more-file {
387     position:absolute;
388     right: 0.5em;
389     background: #999;
390     color: #fff;
391     border: none;
392}
393
394/* Help */
395#help {
396     margin-top: 2em;
397     background: #d6dde5;
398}
399#help-button {
400     position: absolute;
401     top: 50px;
402     right: 0px;
403     cursor: pointer;
404     background: #06c;
405     -moz-border-radius: 8px 0 0 8px;
406     -webkit-border-top-left-radius: 8px;
407     -webkit-border-bottom-left-radius: 8px;
408}
409.help-box {
410     display: none;
411}
412.help-box ul {
413     padding-left: 20px;
414     margin-left: 0;
415}
416#content.with-help #help-button {
417     right: 280px;
418}
419#content.with-help #help {
420     display: block;
421     position: absolute;
422     top: 40px;
423     right: 0;
424     width: 280px;
425     border-left: 1px solid #ccc;
426     margin-top: 0;
427     padding: 10px 0 0 0;
428     overflow: auto;
429}
430#content.with-help .help-content {
431     padding: 0 5px 1em 5px;
432}
433
434/* POPUP */
435body.popup #wrapper {
436     background-position : -130px 0;
437}
438body.popup #top h1 {
439     background-position : -130px 0;
440}
441body.popup #main {
442     margin-left : -35px;
443}
444body.popup #content {
445     margin-left : 35px;
446}
447body.popup #footer {
448     background-position: -130px 0;
449}
450body.popup #footer p {
451     margin-left: 35px;
452     border: none;
453}
454
455/* CLASSES
456-------------------------------------------------------- */
457a.button, a.back {
458     padding : 2px;
459     background: #e2dfca;
460     border: 1px solid #e2dfca;
461     -moz-border-radius: 3px;
462     -webkit-border-radius: 3px;
463     cursor: pointer;
464     outline: none;
465}
466a.button:hover, a.button:focus, a.back:hover, a.back:focus {
467     border-color: #ccc;
468}
469h2 a.button {
470     color: #333;
471     font-weight: normal;
472}
473a.back:before {
474     content: "\ab\a0";
475}
476
477.help-content dt {
478     font-weight: bold;
479     color: #666;
480     margin: 0;
481}
482.help-content dd {
483     margin: 0.3em 0 1.5em 0;
484}
485
486.clear {
487     clear : both;
488}
489.lclear {
490     clear : left;
491}
492div.clearer {
493     height : 1px;
494     font-size : 1px;
495}
496
497.hide {
498     display : none;
499}
500
501.right {
502     text-align : right;
503}
504
505.frame-shrink {
506     border: 1px solid #666;
507     padding: 0.5em;
508     margin-bottom: 1em;
509     height: 120px;
510     overflow: auto;
511}
512
513.grid {
514     background: transparent repeat url('grid.png') 0 0;
515}
516
517.line p {
518     margin : 0;
519}
520
521div.error, p.error, div.message, p.message, div.static-msg, p.static-msg {
522     padding: 0.5em 0.5em 0.5em 40px;
523     margin-bottom: 1em;
524     -moz-border-radius: 8px;
525     -webkit-border-radius: 8px;
526}
527p.error, p.message, p.static-msg {
528     padding-top: 1em;
529     padding-bottom: 1em;
530}
531div.error, p.error {
532     background: #e5bfbf url(msg-error.png) no-repeat 5px 5px;
533     color: #600;
534}
535div.message, p.message, div.static-msg, p.static-msg {
536     background: #666 url(msg-std.png) no-repeat 5px 5px;
537     color: #fff;
538}
539div.message a, p.message a, div.static-msg a, p.static-msg a {
540     color: #fff;
541}
542
543.offline {
544     color : #666;
545}
546
547ul.nice {
548     margin: 1em 0;
549     padding: 0 0 0 2em;
550     list-style: square;
551}
552ul.nice li {
553     margin:0;
554     padding: 0;
555}
556
557.three-cols {
558}
559.three-cols .col {
560     width : 32.3%;
561     float : left;
562     margin-left : 1%;
563}
564.three-cols .col:first-child {
565     width : 33.3%;
566     margin-left : 0;
567}
568
569.two-cols {
570     position : static;
571}
572.two-cols .col {
573     width : 49%;
574     margin-left : 1%;
575     float : left;
576}
577.two-cols .col:first-child {
578     width : 50%;
579     margin-left : 0;
580}
581
582.comment {
583     border-top : 2px solid #ccc;
584     margin-bottom : 1em;
585     padding : 2em 0 1em 0;
586     position : relative;
587}
588.comment form p {
589     margin : 0;
590     position : absolute;
591     top : 2px;
592     right : 0;
593}
594
595
596.part-tabs {
597     float: left;
598     width: 100%;
599     background: transparent url(tab-bg.png) repeat-x bottom;
600     margin-bottom: 2em;
601}
602.part-tabs ul {
603     margin: 0;
604     padding: 10px 10px 0;
605     list-style: none;
606}
607.part-tabs li {
608     float: left;
609     background: transparent url(tab-n-l.png) no-repeat top left;
610     margin: 0 3px 0 0;
611     padding: 0 0 0 5px;
612}
613.part-tabs a {
614     display: block;
615     background: transparent url(tab-n-r.png) no-repeat top right;
616     padding: 1px 10px 1px 5px;
617     border: none;
618     outline: none;
619}
620.part-tabs li.part-tabs-active {
621     background-image: url(tab-c-l.png);
622}
623.part-tabs li.part-tabs-active a {
624     background-image: url(tab-c-r.png);
625     padding-bottom: 2px;
626     font-weight : bold;
627}
628.part-tabs li.part-tabs-link {
629     background-image: url(tab-l-l.png);
630}
631.part-tabs li.part-tabs-link a {
632     background-image: url(tab-l-r.png);
633}
634
635/* Themes list */
636#themes {
637     border-bottom: 1px solid #ccc;
638     margin: 1em 0;
639}
640#themes div.theme-details {
641     clear: left;
642     border-top: 1px solid #ccc;
643     padding: 1em 0;
644}
645#themes div.theme-details:hover {
646     background: #eee;
647}
648#themes div.theme-details div.theme-shot {
649     float: left;
650}
651#themes div.theme-details div.theme-shot img {
652     display: block;
653     width: 57px;
654     height: 50px;
655     border: 1px solid #ccc;
656}
657#themes div.theme-details div.theme-info {
658     margin-left: 67px;
659}
660#themes div.theme-details div.theme-info span.theme-desc {
661     display: block;
662}
663#themes div.theme-details div.theme-info span.theme-version {
664     color: #666;
665}
666#themes div.theme-details div.theme-actions {
667     margin-left: 67px;
668}
669/* Themes list, JS version */
670#themes-wrapper {
671}
672#theme-box {
673     border: 1px solid #999;
674     border-left: none;
675     padding: 5px;
676     float: right;
677     height: 400px;
678     width: 300px;
679     overflow: auto;
680}
681#theme-box div.theme-shot img {
682     display: block;
683     margin: 0 0 0 10px;
684     width: 280px;
685     height: 245px;
686     border: 1px solid #ccc;
687}
688#theme-box div.theme-info {
689     margin: 1em 0 0 10px;
690}
691#theme-box h3 {
692     margin: 0;
693}
694#theme-box div.theme-info span {
695     display: block;
696}
697#theme-box span.theme-version {
698     color: #666;
699}
700#theme-box span.theme-parent-ok {
701     color: #666;
702}
703#theme-box span.theme-parent-missing {
704     color: #c00;
705     font-weight:bold;
706}
707#theme-box div.theme-actions {
708     margin-left: 10px;
709}
710#themes-wrapper #themes {
711     border: 1px solid #999;
712     overflow: auto;
713     height: 400px;
714     padding: 5px;
715     margin: 0;
716}
717#themes div.theme-details-js {
718     float: left;
719     width: 120px;
720     height: 150px;
721     margin: 0 10px 20px;
722     padding: 10px 10px 0;
723     text-align: center;
724     background: #f3f3f3;
725     border: 1px solid #f3f3f3;
726     cursor: pointer;
727     -moz-border-radius: 4px;
728     -webkit-border-radius: 4px;
729}
730#themes div.theme-details-js label {
731     cursor: pointer;
732}
733#themes div.theme-details-js.theme-selected {
734     background: #ebe9dd;
735     border: 1px solid #999;
736}
737#themes div.theme-details-js div.theme-shot img {
738     width: 120px;
739     height: 105px;
740     border: 1px solid #fff;
741}
742#themes div.theme-details-js h3 {
743     font-size: 90%;
744     font-family: inherit;
745     font-weight: normal;
746     margin: 0;
747     padding: 0;
748}
749
750/* Plugins list */
751#plugins td.action {
752     vertical-align: middle;
753}
754#plugins td form input.activate, table.plugins form input.delete {
755     padding: 1px;
756     background: none;
757     font-weight: normal;
758     border-color: #f90;
759}
760#plugins td form input.delete {
761     font-weight: bold;
762     color: #c00;
763}
764
765.media-list {
766     position : static;
767}
768.media-col-0 {
769     clear: left;
770}
771.media-item {
772     position: relative;
773     border-top: 1px solid #ccc;
774     margin-bottom: 1em;
775     padding: 5px 0;
776}
777div.media-list .media-item {
778     width: 49%;
779     float: left;
780     margin-right: 1%;
781}
782a.media-icon {
783     display: block;
784     border-bottom: none;
785     float: left;
786}
787.media-icon img {
788     display: block;
789}
790.media-item ul {
791     display: block;
792     list-style: none;
793     margin: 0 0 0 60px;
794     padding: 0;
795}
796li.media-action {
797     display: block;
798     position: absolute;
799     top: 5px;
800     right: 5px;
801     height: 16px;
802}
803li.media-action a {
804     border: none;
805}
806li.media-action form {
807     display: inline;
808}
809li.media-action input {
810     border: none;
811}
812
813.zip-dl {
814     background: transparent url(package.png) no-repeat 0 50%;
815     padding: 5px 0 5px 20px;
816}
817
818select.l10n option {
819     padding-left: 16px;
820}
821option.avail10n {
822     background: transparent url(../images/check-on.png) no-repeat 0 50%;
823}
824
825/* TABLES
826-------------------------------------------------------- */
827table {
828     font-size : 1em;
829     border-collapse : collapse;
830     margin : 0 0 1em 0;
831}
832tr.line:hover {
833     background : #ddd;
834}
835th, td {
836     border-width : 0 0 1px 0;
837     border-style : solid;
838     border-color : #ccc;
839     padding : 3px 5px;
840     vertical-align : top;
841}
842th {
843     text-align : left;
844     border-bottom-color : #666;
845}
846
847.noborder td, td.noborder, .noborder th, th.noborder {
848     border-width : 0;
849}
850
851table .maximal, table.maximal {
852     width : 100%;
853}
854table .minimal {
855     width : 1px;
856}
857
858table .nowrap {
859     white-space : nowrap;
860}
861
862td.status {
863     vertical-align: middle;
864}
865td.status img {
866     margin-bottom: -2px;
867}
868td.status a {
869     border: none;
870}
871
872tr.line img.expand {
873     margin-right: 10px;
874     margin-bottom: -2px;
875}
876tr.line input {
877     vertical-align: top;
878}
879tr.expand td {
880     border-bottom: none;
881}
882td.expand {
883     padding: 1em;
884}
885
886.dragable {
887     border-collapse: separate;
888}
889.dragable tbody td {
890     
891}
892.handle {
893     padding : 0;
894}
895.handler {
896     cursor : move;
897     background : transparent url(drag.png) no-repeat 0 50%;
898     padding-left : 15px;
899}
900
901/* FORMS
902-------------------------------------------------------- */
903form {
904     display : block;
905     margin : 0;
906     padding : 0;
907}
908
909fieldset {
910     display : block;
911     margin : 0 0 1em 0;
912     padding : 1em 0.5em;
913     border-width : 1px 0;
914     border-style: solid;
915     border-color: #ccc;
916     background: #fbfbfb;
917}
918legend {
919     font-weight : bold;
920     padding: 0.2em 0.6em;
921     border-width: 1px;
922     border-style: solid;
923     border-color: #ccc;
924     background: #fbfbfb;
925     margin-bottom: 0.5em;
926}
927optgroup {
928     font-weight : bold;
929     font-style : normal;
930}
931option {
932     font-weight : normal;
933}
934
935input, textarea, select {
936     background : #f9f9f9;
937     color : #000;
938     border-width : 1px;
939     border-style : solid;
940     border-color : #000 #ccc #ccc #000;
941}
942input, textarea, select, option {
943     font: 1em "DejaVu Sans","Lucida Grande","Lucida Sans Unicode",Arial,sans-serif;
944}
945input[type=text], input[type=password], textarea {
946     padding : 2px 0;
947}
948input[type=checkbox], input[type=radio] {
949     border: none;
950}
951textarea {
952     padding : 2px 0;
953}
954/*input[type=text]:focus, input[type=password]:focus, textarea:focus, option {
955     background : #dfdcc7;
956} can't select text with opera */
957input[type=submit], input[type=reset], input[type=button], input.submit {
958     padding : 2px 2px;
959     background: #e2dfca;
960     border: 1px solid #e2dfca;
961     color: #333;
962     -moz-border-radius: 3px;
963     -webkit-border-radius: 3px;
964     cursor: pointer;
965}
966input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover, input.submit:hover {
967     border-color: #ccc;
968     color: #06c;
969}
970
971input[type=submit], input.submit {
972     font-weight : bold;
973}
974
975input[type=checkbox], input[type=radio] {
976     margin : 0;
977     padding : 0;
978     background : transparent;
979}
980
981label {
982     display : block;
983}
984label input, label select, label span {
985     display : block;
986}
987p.form-note {
988     margin-top : -1em;
989     color : #f60;
990}
991
992label.classic {
993     display : inline;
994}
995label.classic input, label span input, label.classic select, label span select {
996     display : inline;
997}
998
999label.area, p.area {
1000     width: inherit !important;
1001}
1002.area textarea {
1003     display : block;
1004     width : 100%;
1005}
1006
1007label.required {
1008     font-weight : bold;
1009}
1010label.required:before {
1011     content : '* ';
1012     color : #c00;
1013}
1014
1015p.field {
1016     position: relative;
1017     
1018}
1019p.field label {
1020     display: block;
1021     width: 14em;
1022}
1023p.field input, p.field select {
1024     display: inline;
1025     position: absolute;
1026     left: 15em;
1027     top: 0;
1028}
1029
1030label .maximal, textarea.maximal, input.maximal {
1031     width : 100%;
1032}
1033
1034a.form-control {
1035     display : none;
1036     font-weight: bold;
1037     background: url(magnifier.png) no-repeat 0 0;
1038     color: green;
1039     padding-left: 20px;
1040}
1041
1042fieldset.constrained {
1043     margin: 0;
1044     padding: 0;
1045     border: none;
1046     background: transparent;
1047}
1048
1049#login-screen {
1050     display: block;
1051     width : 180px;
1052     margin : 30px auto 0;
1053     font-size: 1.1em;
1054}
1055#login-screen h1 {
1056     text-indent: -2000px;
1057     background: transparent url(dotclear-logo.png) no-repeat top left;
1058     height: 46px;
1059}
1060#login-screen fieldset {
1061     border: 1px solid #999;
1062     padding: 1em 10px;
1063     -moz-border-radius: 4px;
1064     -webkit-border-radius: 4px;
1065}
1066#login-screen input[type=text], #login-screen input[type=password] {
1067     width: 100%;
1068}
Note: See TracBrowser for help on using the repository browser.

Sites map