8ba4cea0768d81058b3b2923dbb2e5834e6112d7
[lhc/web/wiklou.git] / skins / common / shared.css
1 /**
2 * CSS in this file is used by *all* skins (that have any CSS at all). Be
3 * careful what you put in here, since what looks good in one skin may not in
4 * another, but don't ignore the poor pre-Monobook users either.
5 */
6
7 /* GENERAL CLASSES FOR DIRECTIONALITY SUPPORT */
8
9 /**
10 * These classes should be used for text depending on the content direction.
11 * Content stuff like editsection, ul/ol and TOC depend on this.
12 */
13 .mw-content-ltr {
14 /* @noflip */
15 direction: ltr;
16 }
17 .mw-content-rtl {
18 /* @noflip */
19 direction: rtl;
20 }
21
22 /* Most input fields should be in site direction */
23 .sitedir-ltr textarea,
24 .sitedir-ltr input {
25 /* @noflip */
26 direction: ltr;
27 }
28 .sitedir-rtl textarea,
29 .sitedir-rtl input {
30 /* @noflip */
31 direction: rtl;
32 }
33
34 /* Input types that should follow user direction, like buttons */
35 /* TODO: What about buttons in wikipage content ? */
36 input[type="submit"],
37 input[type="button"],
38 input[type="reset"],
39 input[type="file"] {
40 direction: ltr;
41 }
42
43 /* Override default values */
44 textarea[dir="ltr"],
45 input[dir="ltr"] {
46 /* @noflip */
47 direction: ltr;
48 }
49 textarea[dir="rtl"],
50 input[dir="rtl"] {
51 /* @noflip */
52 direction: rtl;
53 }
54
55 .mw-float-start { float: left; }
56 .mw-float-end { float: right; }
57 .mw-align-start { text-align: left; }
58 .mw-align-end { text-align: right; }
59
60 /* The scripts of these languages are very hard to read with underlines */
61 [lang="ar"] a,
62 [lang="ckb"] a,
63 [lang="fa"] a,
64 [lang="kk-arab"] a,
65 [lang="mzn"] a,
66 [lang="ps"] a,
67 [lang="ur"] a {
68 text-decoration: none;
69 }
70
71 /* Default style for semantic tags */
72 abbr,
73 acronym,
74 .explain {
75 border-bottom: 1px dotted black;
76 cursor: help;
77 }
78
79 /* Colored watchlist and recent changes numbers */
80 .mw-plusminus-pos {
81 color: #006400; /* dark green */
82 }
83 .mw-plusminus-neg {
84 color: #8b0000; /* dark red */
85 }
86 .mw-plusminus-null {
87 color: #aaa; /* gray */
88 }
89
90 /**
91 * Links to redirects appear italicized on [[Special:AllPages]], [[Special:PrefixIndex]],
92 * [[Special:Watchlist/edit]] and in category listings.
93 */
94 .allpagesredirect,
95 .redirect-in-category,
96 .watchlistredir {
97 font-style: italic;
98 }
99
100 /* Comment and username portions of RC entries */
101 span.comment {
102 font-style: italic;
103 }
104
105 span.changedby {
106 font-size: 95%;
107 }
108
109 /* Math */
110 .texvc {
111 direction: ltr;
112 unicode-bidi: embed;
113 }
114 img.tex {
115 vertical-align: middle;
116 }
117 span.texhtml {
118 font-family: serif;
119 }
120
121 /**
122 * Add a bit of margin space between the preview and the toolbar.
123 * This replaces the ugly <p><br /></p> we used to insert into the page source
124 */
125 #wikiPreview.ontop {
126 margin-bottom: 1em;
127 }
128
129 /* Stop floats from intruding into edit area in previews */
130 #editform,
131 #toolbar,
132 #wpTextbox1 {
133 clear: both;
134 }
135 #toolbar img {
136 cursor: pointer;
137 }
138 div#mw-js-message {
139 margin: 1em 5%;
140 padding: 0.5em 2.5%;
141 border: solid 1px #ddd;
142 background-color: #fcfcfc;
143 }
144
145 /* Edit section links */
146 .editsection {
147 float: right;
148 margin-left: 5px;
149 unicode-bidi: embed;
150 }
151 /* Correct directionality when page dir is different from site/user dir */
152 .mw-content-ltr .editsection,
153 .mw-content-rtl .mw-content-ltr .editsection {
154 /* @noflip */
155 float: right;
156 }
157 .mw-content-rtl .editsection,
158 .mw-content-ltr .mw-content-rtl .editsection {
159 /* @noflip */
160 float: left;
161 }
162
163 /**
164 * File histories
165 */
166 h2#filehistory {
167 clear: both;
168 }
169
170 table.filehistory th,
171 table.filehistory td {
172 vertical-align: top;
173 }
174 table.filehistory th {
175 text-align: left;
176 }
177 table.filehistory td.mw-imagepage-filesize,
178 table.filehistory th.mw-imagepage-filesize {
179 white-space: nowrap;
180 }
181
182 table.filehistory td.filehistory-selected {
183 font-weight: bold;
184 }
185
186 /**
187 * rev_deleted stuff
188 */
189 li span.deleted,
190 span.history-deleted {
191 text-decoration: line-through;
192 color: #888;
193 font-style: italic;
194 }
195
196 /**
197 * Patrol stuff
198 */
199 .not-patrolled {
200 background-color: #ffa;
201 }
202
203 .unpatrolled {
204 font-weight: bold;
205 color: red;
206 }
207
208 div.patrollink {
209 font-size: 75%;
210 text-align: right;
211 }
212
213 /**
214 * Forms
215 */
216 td.mw-label {
217 text-align: right;
218 }
219 td.mw-input {
220 text-align: left;
221 }
222 td.mw-submit {
223 text-align: left;
224 }
225
226 td.mw-label {
227 vertical-align: top;
228 }
229 .prefsection td.mw-label {
230 width: 20%;
231 }
232 .prefsection table {
233 width: 100%;
234 }
235 td.mw-submit {
236 white-space: nowrap;
237 }
238
239 table.mw-htmlform-nolabel td.mw-label {
240 width: 0 !important;
241 }
242
243 tr.mw-htmlform-vertical-label td.mw-label {
244 text-align: left !important;
245 }
246
247 .mw-htmlform-invalid-input td.mw-input input {
248 border-color: red;
249 }
250 .mw-htmlform-multiselect-flatlist div.mw-htmlform-multiselect-item {
251 display: inline;
252 margin-right: 1em;
253 white-space: nowrap;
254 }
255
256 input#wpSummary {
257 width: 80%;
258 }
259
260 /**
261 * Image captions
262 */
263 .thumbcaption {
264 text-align: left;
265 }
266 .magnify {
267 float: right;
268 }
269
270 /**
271 * Categories
272 */
273 #catlinks ul {
274 display: inline;
275 margin: 0px;
276 list-style: none;
277 list-style-type: none;
278 list-style-image: none;
279 vertical-align: middle !ie;
280 }
281
282 #catlinks li {
283 display: inline-block;
284 line-height: 1.35em;
285 padding: 0 .7em;
286 border-left: 1px solid #AAA;
287 margin: 0.3em 0;
288 zoom: 1;
289 display: inline !ie;
290 }
291
292 #catlinks li:first-child {
293 padding-left: .4em;
294 border-left: none;
295 }
296 /**
297 * Hidden categories
298 */
299 .mw-hidden-cats-hidden {
300 display: none;
301 }
302 .catlinks-allhidden {
303 display: none;
304 }
305
306 /* Convenience links to edit block, delete and protect reasons */
307 p.mw-ipb-conveniencelinks,
308 p.mw-protect-editreasons,
309 p.mw-filedelete-editreasons,
310 p.mw-delete-editreasons,
311 p.mw-revdel-editreasons {
312 font-size: 90%;
313 text-align: right;
314 }
315
316 /**
317 * OpenSearch ajax suggestions
318 */
319 .os-suggest {
320 overflow: auto;
321 overflow-x: hidden;
322 position: absolute;
323 top: 0px;
324 left: 0px;
325 width: 0px;
326 background-color: white;
327 background-color: Window;
328 border-style: solid;
329 border-color: #AAAAAA;
330 border-width: 1px;
331 z-index:99;
332 font-size:95%;
333 }
334
335 table.os-suggest-results {
336 font-size: 95%;
337 cursor: pointer;
338 border: 0;
339 border-collapse: collapse;
340 width: 100%;
341 }
342
343 .os-suggest-result,
344 .os-suggest-result-hl {
345 white-space: nowrap;
346 background-color: white;
347 background-color: Window;
348 color: black;
349 color: WindowText;
350 padding: 2px;
351 }
352 .os-suggest-result-hl,
353 .os-suggest-result-hl-webkit {
354 background-color: #4C59A6;
355 color: white;
356 }
357 .os-suggest-result-hl {
358 /* System colors are misimplemented in Safari 3.0 and earlier,
359 * making highlighted text illegible...
360 */
361 background-color: Highlight;
362 color: HighlightText;
363 }
364
365 .os-suggest-toggle {
366 position: relative;
367 left: 1ex;
368 font-size: 65%;
369 }
370 .os-suggest-toggle-def {
371 position: absolute;
372 top: 0px;
373 left: 0px;
374 font-size: 65%;
375 visibility: hidden;
376 }
377
378 /* Page history styling */
379
380 /* The auto-generated edit comments */
381 .autocomment {
382 color: gray;
383 }
384 #pagehistory .history-user {
385 margin-left: 0.4em;
386 margin-right: 0.2em;
387 }
388 #pagehistory span.minor {
389 font-weight: bold;
390 }
391 #pagehistory li {
392 border: 1px solid white;
393 }
394 #pagehistory li.selected {
395 background-color: #f9f9f9;
396 border: 1px dashed #aaa;
397 }
398
399 /** Generic minor/bot/newpage styling (recent changes) */
400 .newpage,
401 .minor,
402 .bot {
403 font-weight: bold;
404 }
405
406 #shared-image-dup,
407 #shared-image-conflict {
408 font-style: italic;
409 }
410
411 /**
412 * Recreating deleted page warning
413 * Reupload file warning
414 * Page protection warning
415 * incl. log entries for these warnings
416 */
417 div.mw-warning-with-logexcerpt {
418 padding: 3px;
419 margin-bottom: 3px;
420 border: 2px solid #2F6FAB;
421 clear: both;
422 }
423 div.mw-warning-with-logexcerpt ul li {
424 font-size: 90%;
425 }
426
427 /* (show/hide) revision deletion links */
428 span.mw-revdelundel-link,
429 strong.mw-revdelundel-link {
430 font-size: 90%;
431 }
432 span.mw-revdelundel-hidden,
433 input.mw-revdelundel-hidden {
434 visibility: hidden;
435 }
436
437 td.mw-revdel-checkbox,
438 th.mw-revdel-checkbox {
439 padding-right: 10px;
440 text-align: center;
441 }
442
443 /* feed links */
444 a.feedlink {
445 /* @embed */
446 background: url("images/feed-icon.png") center left no-repeat;
447 padding-left: 16px;
448 }
449
450 /* Plainlinks - this can be used to switch
451 * off special external link styling */
452 .plainlinks a {
453 background: none !important;
454 padding: 0 !important;
455 }
456 /* External URLs should always be treated as LTR (bug 4330) */
457 /* @noflip */ .rtl a.external.free,
458 .rtl a.external.autonumber {
459 direction: ltr;
460 unicode-bidi: embed;
461 }
462
463 /* wikitable class for skinning normal tables
464 * keep on sync with commonPrint.css
465 */
466 table.wikitable {
467 margin: 1em 1em 1em 0;
468 background: #f9f9f9;
469 border: 1px #aaa solid;
470 border-collapse: collapse;
471 color: black;
472 }
473 .wikitable th,
474 .wikitable td {
475 border: 1px #aaa solid;
476 padding: 0.2em;
477 }
478 .wikitable th {
479 background: #f2f2f2;
480 text-align: center;
481 }
482 .wikitable caption {
483 font-weight: bold;
484 }
485
486 /* hide initially collapsed collapsable tables */
487 table.collapsed tr.collapsable {
488 display: none;
489 }
490
491 /* success and error messages */
492 .success {
493 color: green;
494 font-size: larger;
495 }
496 .warning {
497 color: #FFA500; /* orange */
498 font-size: larger;
499 }
500 .error {
501 color: red;
502 font-size: larger;
503 }
504 .errorbox,
505 .warningbox,
506 .successbox {
507 font-size: larger;
508 border: 2px solid;
509 padding: .5em 1em;
510 float: left;
511 margin-bottom: 2em;
512 color: #000;
513 }
514 .errorbox {
515 border-color: red;
516 background-color: #fff2f2;
517 }
518 .warningbox {
519 border-color: #FF8C00; /* darkorange */
520 background-color: #FFFFC0;
521 }
522 .successbox {
523 border-color: green;
524 background-color: #dfd;
525 }
526 .errorbox h2,
527 .warningbox h2,
528 .successbox h2 {
529 font-size: 1em;
530 font-weight: bold;
531 display: inline;
532 margin: 0 .5em 0 0;
533 border: none;
534 }
535
536 /* general info/warning box for SP */
537 .mw-infobox {
538 border: 2px solid #ff7f00;
539 margin: 0.5em;
540 clear: left;
541 overflow: hidden;
542 }
543
544 .mw-infobox-left {
545 margin: 7px;
546 float: left;
547 width: 35px;
548 }
549
550 .mw-infobox-right {
551 margin: 0.5em 0.5em 0.5em 49px;
552 }
553
554 /* Note on preview page */
555 .previewnote {
556 color: #c00;
557 margin-bottom: 1em;
558 }
559
560 .previewnote p {
561 text-indent: 3em;
562 margin: 0.8em 0;
563 }
564
565 .visualClear {
566 clear: both;
567 }
568
569 #mw_trackbacks {
570 border: solid 1px #bbbbff;
571 background-color: #eeeeff;
572 padding: 0.2em;
573 }
574
575 /**
576 * Table pager (e.g. Special:ListFiles)
577 * - remove underlines from the navigation link
578 * - collapse borders
579 * - set the borders to outsets (similar to Special:AllMessages)
580 * - remove line wrapping for all td and th, set background color
581 * - restore line wrapping for the last two table cells (description and size)
582 */
583 .TablePager {
584 min-width: 80%;
585 border-collapse: collapse;
586 }
587 .TablePager_nav {
588 margin: 0 auto;
589 }
590 .TablePager_nav td {
591 padding: 3px;
592 text-align: center;
593 }
594 .TablePager_nav a {
595 text-decoration: none;
596 }
597 .TablePager,
598 .TablePager td,
599 .TablePager th {
600 border: 1px solid #aaaaaa;
601 padding: 0 0.15em 0 0.15em;
602 }
603 .TablePager th {
604 background-color: #eeeeff;
605 }
606 .TablePager td {
607 background-color: #ffffff;
608 }
609 .TablePager tr:hover td {
610 background-color: #eeeeff;
611 }
612
613 .imagelist td,
614 .imagelist th {
615 white-space: nowrap;
616 }
617 .imagelist .TablePager_col_links {
618 background-color: #eeeeff;
619 }
620 .imagelist .TablePager_col_img_description {
621 white-space: normal;
622 }
623 .imagelist th.TablePager_sort {
624 background-color: #ccccff;
625 }
626
627 /* filetoc */
628 ul#filetoc {
629 text-align: center;
630 border: 1px solid #aaaaaa;
631 background-color: #f9f9f9;
632 padding: 5px;
633 font-size: 95%;
634 margin-bottom: 0.5em;
635 margin-left: 0;
636 margin-right: 0;
637 }
638
639 #filetoc li {
640 display: inline;
641 list-style-type: none;
642 padding-right: 2em;
643 }
644
645 /* Classes for EXIF data display */
646 table.mw_metadata {
647 font-size: 0.8em;
648 margin-left: 0.5em;
649 margin-bottom: 0.5em;
650 width: 400px;
651 }
652
653 table.mw_metadata caption {
654 font-weight: bold;
655 }
656
657 table.mw_metadata th {
658 font-weight: normal;
659 }
660
661 table.mw_metadata td {
662 padding: 0.1em;
663 }
664
665 table.mw_metadata {
666 border: none;
667 border-collapse: collapse;
668 }
669
670 table.mw_metadata td,
671 table.mw_metadata th {
672 text-align: center;
673 border: 1px solid #aaaaaa;
674 padding-left: 5px;
675 padding-right: 5px;
676 }
677
678 table.mw_metadata th {
679 background-color: #f9f9f9;
680 }
681
682 table.mw_metadata td {
683 background-color: #fcfcfc;
684 }
685
686 table.mw_metadata ul.metadata-langlist {
687 list-style-type: none;
688 list-style-image: none;
689 padding-right: 5px;
690 padding-left: 5px;
691 margin: 0;
692 }
693
694 /* Correct directionality when page dir is different from site/user dir */
695 .mw-content-ltr ul,
696 .mw-content-rtl .mw-content-ltr ul {
697 /* @noflip */
698 margin: 0.3em 0 0 1.5em;
699 }
700 .mw-content-rtl ul,
701 .mw-content-ltr .mw-content-rtl ul {
702 /* @noflip */
703 margin: 0.3em 1.5em 0 0;
704 }
705 .mw-content-ltr ol,
706 .mw-content-rtl .mw-content-ltr ol {
707 /* @noflip */
708 margin: 0.3em 0 0 3.2em;
709 }
710 .mw-content-rtl ol,
711 .mw-content-ltr .mw-content-rtl ol {
712 /* @noflip */
713 margin: 0.3em 3.2em 0 0;
714 }
715
716 /* Galleries */
717 /* These display attributes look nonsensical, but are needed to support IE and FF2 */
718 /* Don't forget to update commonPrint.css */
719 li.gallerybox {
720 vertical-align: top;
721 border: solid 2px white;
722 display: -moz-inline-box;
723 display: inline-block;
724 }
725
726 ul.gallery {
727 margin: 2px;
728 padding: 2px;
729 display: inline-block;
730 }
731
732 ul.gallery,
733 li.gallerybox {
734 zoom: 1;
735 display: inline !ie;
736 }
737
738 li.gallerycaption {
739 font-weight: bold;
740 text-align: center;
741 display: block;
742 word-wrap: break-word;
743 }
744
745 li.gallerybox div.thumb {
746 text-align: center;
747 border: 1px solid #ccc;
748 background-color: #f9f9f9;
749 margin: 2px;
750 }
751
752 li.gallerybox div.thumb img {
753 display: block;
754 margin: 0 auto;
755 }
756
757 div.gallerytext {
758 overflow: hidden;
759 font-size: 94%;
760 padding: 2px 4px;
761 word-wrap: break-word;
762 }
763
764 .mw-ajax-loader {
765 /* @embed */
766 background-image: url(images/ajax-loader.gif);
767 background-position: center center;
768 background-repeat: no-repeat;
769 padding: 16px;
770 position: relative;
771 top: -16px;
772 }
773
774 .mw-small-spinner {
775 padding: 10px !important;
776 margin-right: 0.6em;
777 /* @embed */
778 background-image: url(images/spinner.gif);
779 background-position: center center;
780 background-repeat: no-repeat;
781 }
782
783 /* Localised ordered list numbering for some languages */
784 ol:lang(bcc) li,
785 ol:lang(bqi) li,
786 ol:lang(fa) li,
787 ol:lang(glk) li,
788 ol:lang(kk-arab) li,
789 ol:lang(mzn) li {
790 list-style-type: -moz-persian;
791 list-style-type: persian;
792 }
793
794 ol:lang(ckb) li {
795 list-style-type: -moz-arabic-indic;
796 list-style-type: arabic-indic;
797 }
798
799 ol:lang(bn) li {
800 list-style-type: -moz-bengali;
801 list-style-type: bengali;
802 }
803
804 ol:lang(or) li {
805 list-style-type: -moz-oriya;
806 list-style-type: oriya;
807 }
808
809 /* Correct directionality when page dir is different from site/user dir */
810 /* @noflip */ .mw-content-ltr .toc ul,
811 .mw-content-ltr #toc ul,
812 .mw-content-rtl .mw-content-ltr .toc ul,
813 .mw-content-rtl .mw-content-ltr #toc ul {
814 text-align: left;
815 margin-left: 0;
816 }
817 /* @noflip */ .mw-content-rtl .toc ul,
818 .mw-content-rtl #toc ul,
819 .mw-content-ltr .mw-content-rtl .toc ul,
820 .mw-content-ltr .mw-content-rtl #toc ul {
821 text-align: right;
822 margin-right: 0;
823 }
824 /* @noflip */ .mw-content-ltr .toc ul ul,
825 .mw-content-ltr #toc ul ul,
826 .mw-content-rtl .mw-content-ltr .toc ul ul,
827 .mw-content-rtl .mw-content-ltr #toc ul ul {
828 margin: 0 0 0 2em;
829 }
830 /* @noflip */ .mw-content-rtl .toc ul ul,
831 .mw-content-rtl #toc ul ul,
832 .mw-content-ltr .mw-content-rtl .toc ul ul,
833 .mw-content-ltr .mw-content-rtl #toc ul ul {
834 margin: 0 2em 0 0;
835 }
836
837 /* tooltip styles */
838 .mw-help-field-hint {
839 display: none;
840 margin-left: 2px;
841 margin-bottom: -8px;
842 padding: 0px 0px 0px 15px;
843 /* @embed */
844 background-image: url('images/help-question.gif');
845 background-position: left center;
846 background-repeat: no-repeat;
847 cursor: pointer;
848 font-size: .8em;
849 text-decoration: underline;
850 color: #0645ad;
851 }
852 .mw-help-field-hint:hover {
853 /* @embed */
854 background-image: url('images/help-question-hover.gif');
855 }
856 .mw-help-field-data {
857 display: block;
858 background-color: #d6f3ff;
859 padding:5px 8px 4px 8px;
860 border: 1px solid #5dc9f4;
861 margin-left: 20px;
862 }
863 .tipsy {
864 padding: 5px 5px 10px;
865 font-size: 12px;
866 position: absolute;
867 z-index: 100000;
868 overflow: visible;
869 }
870 .tipsy-inner {
871 padding: 5px 8px 4px 8px;
872 background-color: #d6f3ff;
873 color: black;
874 border: 1px solid #5dc9f4;
875 max-width: 300px;
876 text-align: left;
877 }
878 .tipsy-arrow {
879 position: absolute;
880 /* @embed */
881 background: url(images/tipsy-arrow.gif) no-repeat top left;
882 width: 13px;
883 height: 13px;
884 }
885 .tipsy-se .tipsy-arrow {
886 bottom: -2px;
887 right: 10px;
888 background-position: 0% 100%;
889 }
890 /* Table Sorting */
891 th.headerSort {
892 background-image: url(images/sort_both.gif);
893 cursor: pointer;
894 background-repeat: no-repeat;
895 background-position: center right;
896 padding-right: 21px;
897 }
898 th.headerSortUp {
899 background-image: url(images/sort_up.gif);
900 }
901 th.headerSortDown {
902 background-image: url(images/sort_down.gif);
903 }
904
905 /* LTR content in RTL layout */
906 .ltr {
907 /* @noflip */
908 direction: ltr;
909 unicode-bidi: embed;
910 }
911
912 #mw-clearyourcache,
913 #mw-sitecsspreview,
914 #mw-sitejspreview,
915 #mw-usercsspreview,
916 #mw-userjspreview {
917 direction: ltr;
918 unicode-bidi: embed;
919 }
920
921 /* Correct user & content directionality when viewing a diff */
922 .diff-currentversion-title,
923 .diff {
924 direction: ltr;
925 unicode-bidi: embed;
926 }
927 /* @noflip */ .diff-contentalign-right td {
928 direction: rtl;
929 unicode-bidi: embed;
930 }
931 /* @noflip */ .diff-contentalign-left td {
932 direction: ltr;
933 unicode-bidi: embed;
934 }
935 .diff-otitle,
936 .diff-ntitle,
937 .diff-lineno {
938 direction: ltr !important;
939 unicode-bidi: embed;
940 }
941
942 #mw-revision-info,
943 #mw-revision-nav {
944 direction: ltr;
945 }
946
947 /* Images */
948
949 /* @noflip */ div.tright,
950 div.floatright,
951 table.floatright {
952 clear: right;
953 float: right;
954 }
955 /* @noflip */ div.tleft,
956 div.floatleft,
957 table.floatleft {
958 float: left;
959 clear: left;
960 }
961 div.floatright,
962 table.floatright,
963 div.floatleft,
964 table.floatleft {
965 position: relative;
966 }
967
968 /* bug 12205 */
969 #mw-credits a {
970 unicode-bidi: embed;
971 }