Changed cursor behavior so that selected tabs no longer use the arrow cursor since...
[mediawiki.git] / skins / vector / main-ltr.css
blob69b831590b411f09c02ea49f40212d5e9bc91184
1 /*
2 * main-rtl.css is automatically generated using CSSJanus, a python script for
3 * creating RTL versions of otherwise LTR stylesheets.
4 *
5 * You may download the tool to rebuild this stylesheet
6 * http://code.google.com/p/cssjanus/
7 *
8 * An online version of this tool can be used at:
9 * http://cssjanus.commoner.com/
11 * The following command is used to generate the RTL version of this file
12 * ./cssjanus.py --swap_ltr_rtl_in_url < main-ltr.css > main-rtl.css
14 * Any rules which should not be flipped should be prepended with @noflip in
15 * a comment block.
17 /* Framework */
18 html,
19 body {
20 height: 100%;
21 margin: 0;
22 padding: 0;
23 font-family: sans-serif;
24 font-size: 9.75pt;
26 body {
27 background-color: #f3f3f3;
28 background-image: url(images/page-base.png);
30 /* Content */
31 div#content {
32 margin-left: 12em;
33 padding: 1em;
34 background-image: url(images/border.png);
35 background-position: top left;
36 background-repeat: repeat-y;
37 background-color: white;
39 /* Head */
40 div#page-base {
41 height: 6em;
42 background-color: white;
43 background-image: url(images/page-fade.png);
44 background-position: bottom left;
45 background-repeat: repeat-x;
47 div#head-base {
48 margin-top: -6em;
49 margin-left: 12em;
50 height: 6em;
51 background-image: url(images/border.png);
52 background-position: bottom left;
53 background-repeat: repeat-x;
55 div#head {
56 position: absolute;
57 top: 0;
58 right: 0;
59 width: 100%;
61 div#head h5 {
62 margin: 0;
63 padding: 0;
65 /* Personal */
66 div#p-personal {
67 position: absolute;
68 top: 0;
69 right: 0.75em;
71 div#p-personal h5 {
72 display: none;
74 div#p-personal ul {
75 list-style: none;
76 margin: 0;
77 padding: 0;
79 /* @noflip */
80 div#p-personal li {
81 float: left;
83 div#p-personal li {
84 margin-left: 0.75em;
85 margin-top: 0.5em;
86 font-size: 0.9em;
88 /* Navigation Containers */
89 div#left-navigation {
90 position: absolute;
91 left: 12em;
92 top: 3em;
94 div#right-navigation {
95 float: right;
96 margin-top: 3em;
98 /* Navigation Labels */
99 div.vectorTabs h5,
100 div.vectorMenu h5 span {
101 display: none;
103 /* Namespaces and Views */
104 /* @noflip */
105 div.vectorTabs {
106 float: left;
108 div.vectorTabs {
109 background-image: url(images/tab-break.png);
110 background-position: bottom left;
111 background-repeat: no-repeat;
112 padding-left: 1px;
114 /* @noflip */
115 div.vectorTabs ul {
116 float: left;
118 div.vectorTabs ul {
119 height: 100%;
120 list-style: none;
121 margin: 0;
122 padding: 0;
124 /* @noflip */
125 div.vectorTabs ul li {
126 float: left;
128 /* OVERRIDDEN BY COMPLIANT BROWSERS */
129 div.vectorTabs ul li {
130 display: inline-block;
131 height: 100%;
132 margin: 0;
133 padding: 0;
134 background-color: #f3f3f3;
135 background-image: url(images/tab-normal-fade.png);
136 background-position: bottom left;
137 background-repeat: repeat-x;
139 /* IGNORED BY IE6 */
140 div.vectorTabs ul > li {
141 display: block;
143 div.vectorTabs li.selected {
144 background-image: url(images/tab-current-fade.png);
146 /* OVERRIDDEN BY COMPLIANT BROWSERS */
147 div.vectorTabs li a {
148 display: inline-block;
149 height: 3em;
150 padding-left: 0.5em;
151 padding-right: 0.5em;
152 background-image: url(images/tab-break.png);
153 background-position: bottom right;
154 background-repeat: no-repeat;
156 div.vectorTabs li a,
157 div.vectorTabs li a span {
158 color: #0645ad;
159 cursor: pointer;
161 /* IGNORED BY IE6 */
162 div.vectorTabs li > a {
163 display: block;
165 /* OVERRIDDEN BY COMPLIANT BROWSERS */
166 div.vectorTabs a span {
167 display: inline-block;
168 padding-top: 1.25em;
170 /* IGNORED BY IE6 */
171 /* @noflip */
172 div.vectorTabs a > span {
173 float: left;
174 display: block;
176 div.vectorTabs li.selected a,
177 div.vectorTabs li.selected a span,
178 div.vectorTabs li.selected a:visited
179 div.vectorTabs li.selected a:visited span {
180 color: #333333;
181 text-decoration: none;
183 div.vectorTabs li.new a,
184 div.vectorTabs li.new a span,
185 div.vectorTabs li.new a:visited,
186 div.vectorTabs li.new a:visited span {
187 color: #a55858;
189 /* Variants and Actions */
190 /* @noflip */
191 div.vectorMenu {
192 direction: ltr;
193 float: left;
194 background-image: url(images/arrow-down-icon.png);
195 background-position: center center;
196 background-repeat: no-repeat;
198 body.rtl div.vectorMenu {
199 direction: rtl;
201 /* @noflip */
202 div.vectorMenu h5 {
203 float: left;
205 /* OVERRIDDEN BY COMPLIANT BROWSERS */
206 div.vectorMenu h5 a {
207 display: inline-block;
208 width: 24px;
209 height: 3em;
210 text-decoration: none;
211 background-image: url(images/tab-break.png);
212 background-position: bottom right;
213 background-repeat: no-repeat;
215 /* IGNORED BY IE6 */
216 div.vectorMenu h5 > a {
217 display: block;
219 div.vectorMenu div.menu {
220 position: relative;
221 display: none;
222 clear: both;
223 text-align: left;
225 /* OVERRIDDEN BY COMPLIANT BROWSERS */
226 body.rtl div.vectorMenu div.menu {
227 margin-right: 24px;
229 /* IGNORED BY IE6 */
230 body.rtl div.vectorMenu > div.menu {
231 margin-right: auto;
233 /* Fixes old versions of FireFox */
234 body.rtl div.vectorMenu > div.menu,
235 x:-moz-any-link {
236 margin-right: 24px;
238 div.vectorMenu:hover div.menu {
239 display: block;
241 div.vectorMenu ul {
242 position: absolute;
243 background-color: white;
244 border: solid 1px silver;
245 border-top-width: 0;
246 list-style: none;
247 padding: 0;
248 margin: 0;
249 margin-left: -1px;
250 text-align: left;
252 /* Fixes old versions of FireFox */
253 div.vectorMenu ul,
254 x:-moz-any-link {
255 min-width: 6em;
257 /* Returns things back to normal in modern versions of FireFox */
258 div.vectorMenu ul,
259 x:-moz-any-link,
260 x:default {
261 min-width: 0;
263 div.vectorMenu li {
264 padding: 0;
265 margin: 0;
266 text-align: left;
268 /* OVERRIDDEN BY COMPLIANT BROWSERS */
269 div.vectorMenu li a {
270 display: inline-block;
271 padding: 0.5em;
273 /* IGNORED BY IE6 */
274 div.vectorMenu li > a {
275 display: block;
277 /* Search */
278 div#p-search h5 {
279 display: none;
281 /* @noflip */
282 div#p-search {
283 float: left;
285 div#p-search {
286 margin-right: 0.5em;
287 margin-left: 0.5em;
289 div#p-search form,
290 div#p-search input {
291 margin: 0;
292 margin-top: 0.4em;
294 div#p-search div#simpleSearch {
295 margin-top: 0.75em;
296 position: relative;
297 border: solid 1px #AAAAAA;
298 background-color: white;
299 background-image: url(images/search-fade.png);
300 background-position: top left;
301 background-repeat: repeat-x;
303 div#p-search div#simpleSearch input#searchInput {
304 margin: 0;
305 border-width: 0;
306 padding: 0.25em;
307 line-height: 1em;
308 font-size: 9.75pt;
309 width: 10em;
310 background-color: transparent;
312 /* OVERRIDDEN BY COMPLIANT BROWSERS */
313 div#p-search div#simpleSearch button#searchButton {
314 position: absolute;
315 top: 0;
316 right: 0;
317 margin: 0;
318 padding: 0;
319 width: 1.75em;
320 height: 2em;
321 border: none;
322 cursor: pointer;
323 background-color: transparent;
324 background-image: url(images/search.png);
325 background-position: center center;
326 background-repeat: no-repeat;
328 /* IGNORED BY IE6 */
329 div#p-search div#simpleSearch > button#searchButton {
330 height: 100%;
332 /* Panel */
333 div#panel {
334 position: absolute;
335 top: 12em;
336 width: 12em;
337 left: 0;
339 div#panel div.portal {
340 padding-top: 1.5em;
342 div#panel div.portal h5 {
343 font-weight: normal;
344 color: #444444;
345 padding: 0.5em;
346 padding-top: 0;
347 padding-left: 1.25em;
348 cursor: default;
349 border: none;
350 font-size: 0.9em;
352 div#panel div.portal div.body {
353 margin: 0;
354 padding-top: 0.5em;
355 margin-left: 1.25em;
356 background-image: url(images/portal-break-ltr.png);
357 background-repeat: no-repeat;
358 background-position: top left;
360 div#panel div.portal div.body ul {
361 list-style: none;
362 padding: 0;
363 margin: 0;
365 div#panel div.portal div.body ul li {
366 padding: 0;
367 padding-bottom: 0.5em;
368 margin: 0;
369 overflow: hidden;
370 font-size: 0.9em;
372 div#panel div.portal div.body ul li a {
373 color: #0645ad;
375 div#panel div.portal div.body ul li a:visited {
376 color: #0b0080;
378 /* Foot */
379 div#foot {
380 margin-left: 12em;
381 margin-top: 0;
382 padding: 0.75em;
383 background-image: url(images/border.png);
384 background-position: top left;
385 background-repeat: repeat-x;
387 div#foot ul {
388 list-style: none;
389 margin: 0;
390 padding: 0;
392 div#foot ul li {
393 margin: 0;
394 padding: 0;
395 padding-top: 0.5em;
396 padding-bottom: 0.5em;
397 color: #333333;
398 font-size: 0.9em;
400 div#foot ul#foot-icons {
401 float: right;
403 div#foot ul#foot-places {
404 float: left;
406 div#foot ul#foot-info li {
407 line-height: 1.4em;
409 div#foot ul#foot-icons li {
410 float: left;
411 margin-left: 0.5em;
412 line-height: 2em;
414 div#foot ul#foot-places li {
415 float: left;
416 margin-right: 1em;
417 line-height: 2em;
419 /* Logo */
420 #p-logo {
421 position: absolute;
422 top: 0;
423 left: 0;
424 height: 12em;
425 width: 12em;
427 #p-logo a {
428 display: block;
429 width: 12em;
430 height: 12em;
431 background-repeat: no-repeat;
432 background-position: 50% 50%;
433 text-decoration: none;
438 * The following code is highly modified from monobook. It would be nice if the
439 * preftoc id was more human readable like preferences-toc for instance,
440 * howerver this would require backporting the other skins.
443 /* Preferences */
444 #preftoc {
445 /* Tabs */
446 width: 100%;
447 float: left;
448 clear: both;
449 margin: 0 !important;
450 padding: 0 !important;
451 background-image: url(images/preferences-break.png);
452 background-position: bottom left;
453 background-repeat: no-repeat;
455 #preftoc li {
456 /* Tab */
457 float: left;
458 margin: 0;
459 padding: 0;
460 padding-right: 1px;
461 height: 2.25em;
462 white-space: nowrap;
463 list-style-type: none;
464 list-style-image: none;
465 background-image: url(images/preferences-break.png);
466 background-position: bottom right;
467 background-repeat: no-repeat;
469 /* IGNORED BY IE6 */
470 #preftoc li:first-child {
471 margin-left: 1px;
473 #preftoc a,
474 #preftoc a:active {
475 display: inline-block;
476 position: relative;
477 color: #0645ad;
478 padding: 0.5em;
479 text-decoration: none;
480 background-image: none;
481 font-size: 0.9em;
483 #preftoc a:hover {
484 text-decoration: underline;
486 #preftoc li.selected a {
487 background-image: url(images/preferences-fade.png);
488 background-position: bottom;
489 background-repeat: repeat-x;
490 color: #333333;
491 text-decoration: none;
493 #preferences {
494 float: left;
495 width: 100%;
496 margin: 0;
497 margin-top: -2px;
498 clear: both;
499 border: solid 1px #cccccc;
500 background-color: #f9f9f9;
501 background-image: url(images/preferences-base.png);
503 #preferences fieldset.prefsection {
504 border: none;
505 padding: 0;
506 margin: 1em;
508 #preferences fieldset.prefsection fieldset {
509 border: none;
510 border-top: solid 1px #cccccc;
512 #preferences legend {
513 color: #666666;
515 #preferences fieldset.prefsection legend.mainLegend {
516 display: none;
518 #preferences td {
519 padding-left: 0.5em;
520 padding-right: 0.5em;
522 #preferences td.htmlform-tip {
523 font-size: x-small;
524 padding: .2em 2em;
525 color: #666666;
527 #preferences div.mw-prefs-buttons {
528 padding: 1em;
530 #preferences div.mw-prefs-buttons input {
531 margin-right: 0.25em;
536 * The following code is slightly modified from monobook
539 #content {
540 line-height: 1.5em;
542 /* Links */
544 text-decoration: none;
545 color: #0645ad;
546 background: none;
548 a:visited {
549 color: #0b0080;
551 a:active {
552 color: #faa700;
554 a:hover {
555 text-decoration: underline;
557 a.stub {
558 color: #772233;
560 a.new, #p-personal a.new {
561 color: #ba0000;
563 a.new:visited, #p-personal a.new:visited {
564 color: #a55858;
567 /* Inline Elements */
568 img {
569 border: none;
570 vertical-align: middle;
572 hr {
573 height: 1px;
574 color: #aaa;
575 background-color: #aaa;
576 border: 0;
577 margin: .2em 0 .2em 0;
580 /* Structural Elements */
586 h6 {
587 color: black;
588 background: none;
589 font-weight: normal;
590 margin: 0;
591 padding-top: .5em;
592 padding-bottom: .17em;
593 border-bottom: 1px solid #aaa;
594 width: auto;
596 h1 { font-size: 188%; }
597 h1 .editsection { font-size: 53%; }
598 h2 { font-size: 150%; }
599 h2 .editsection { font-size: 67%; }
603 h6 {
604 border-bottom: none;
605 font-weight: bold;
607 h3 { font-size: 132%; }
608 h3 .editsection { font-size: 76%; font-weight: normal; }
609 h4 { font-size: 116%; }
610 h4 .editsection { font-size: 86%; font-weight: normal; }
611 h5 { font-size: 100%; }
612 h5 .editsection { font-weight: normal; }
613 h6 { font-size: 80%; }
614 h6 .editsection { font-size: 125%; font-weight: normal; }
616 margin: .4em 0 .5em 0;
617 line-height: 1.5em;
619 p img {
620 margin: 0;
622 abbr,
623 acronym,
624 .explain {
625 border-bottom: 1px dotted black;
626 color: black;
627 background: none;
628 cursor: help;
631 font-family: Times, "Times New Roman", serif;
632 font-style: italic;
634 /* Disabled for now
635 blockquote {
636 font-family: Times, "Times New Roman", serif;
637 font-style: italic;
639 code {
640 background-color: #f9f9f9;
642 pre {
643 padding: 1em;
644 border: 1px dashed #2f6fab;
645 color: black;
646 background-color: #f9f9f9;
647 line-height: 1.1em;
649 div#content ul {
650 line-height: 1.5em;
651 list-style-type: square;
652 margin: .3em 0 0 1.5em;
653 padding: 0;
654 list-style-image: url(images/bullet-icon.png);
656 div#content ol {
657 line-height: 1.5em;
658 margin: .3em 0 0 3.2em;
659 padding: 0;
660 list-style-image: none;
662 div#content li {
663 margin-bottom: .1em;
665 div#content dt {
666 font-weight: bold;
667 margin-bottom: .1em;
669 div#content dl {
670 margin-top: .2em;
671 margin-bottom: .5em;
673 div#content dd {
674 line-height: 1.5em;
675 margin-left: 2em;
676 margin-bottom: .1em;
678 /* Tables */
679 table {
680 font-size: 100%;
681 color: black;
682 /* we don't want the bottom borders of <h2>s to be visible through
683 * floated tables */
684 background-color: white;
686 div#content fieldset table {
687 /* but keep table layouts in forms clean... */
688 background: none;
690 /* Forms */
691 div#content fieldset {
692 border: 1px solid #2f6fab;
693 margin: 1em 0 1em 0;
694 padding: 0 1em 1em;
695 line-height: 1.5em;
697 fieldset.nested {
698 margin: 0 0 0.5em 0;
699 padding: 0 0.5em 0.5em;
701 div#content legend {
702 padding: .5em;
703 font-size: 95%;
705 div#content form {
706 border: none;
707 margin: 0;
709 div#content textarea {
710 width: 100%;
711 padding: .1em;
713 div#content select {
714 vertical-align: top;
716 /* Table of Contents */
717 #toc,
718 .toc,
719 .mw-warning {
720 border: 1px solid #aaa;
721 background-color: #f9f9f9;
722 padding: 5px;
723 font-size: 95%;
725 #toc h2,
726 .toc h2 {
727 display: inline;
728 border: none;
729 padding: 0;
730 font-size: 100%;
731 font-weight: bold;
733 #toc #toctitle,
734 .toc #toctitle,
735 #toc .toctitle,
736 .toc .toctitle {
737 text-align: center;
739 div#content #toc ul,
740 div#content .toc ul {
741 list-style-type: none;
742 list-style-image: none;
743 margin-left: 0;
744 padding-left: 0;
745 text-align: left;
747 #toc ul ul,
748 .toc ul ul {
749 margin: 0 0 0 2em;
751 #toc .toctoggle,
752 .toc .toctoggle {
753 font-size: 94%;
755 /* Images */
756 div.floatright, table.floatright {
757 clear: right;
758 float: right;
759 position: relative;
760 margin: 0 0 .5em .5em;
761 border: 0;
763 div.floatright p { font-style: italic; }
764 div.floatleft, table.floatleft {
765 float: left;
766 clear: left;
767 position: relative;
768 margin: 0 .5em .5em 0;
769 border: 0;
771 div.floatleft p { font-style: italic; }
772 /* Thumbnails */
773 div.thumb {
774 margin-bottom: .5em;
775 border-style: solid;
776 border-color: white;
777 width: auto;
779 div.thumbinner {
780 border: 1px solid #ccc;
781 padding: 3px !important;
782 background-color: #f9f9f9;
783 font-size: 94%;
784 text-align: center;
785 overflow: hidden;
787 html .thumbimage {
788 border: 1px solid #ccc;
790 html .thumbcaption {
791 border: none;
792 text-align: left;
793 line-height: 1.4em;
794 padding: 3px !important;
795 font-size: 94%;
797 div.magnify {
798 float: right;
799 border: none !important;
800 background: none !important;
802 div.magnify a, div.magnify img {
803 display: block;
804 border: none !important;
805 background: none !important;
807 div.tright {
808 clear: right;
809 float: right;
810 border-width: .5em 0 .8em 1.4em;
812 div.tleft {
813 float: left;
814 clear: left;
815 margin-right: .5em;
816 border-width: .5em 1.4em .8em 0;
818 img.thumbborder {
819 border: 1px solid #dddddd;
821 .hiddenStructure {
822 display: none;
824 /* Warning */
825 .mw-warning {
826 margin-left: 50px;
827 margin-right: 50px;
828 text-align: center;
830 /* User Message */
831 .usermessage {
832 background-color: #ffce7b;
833 border: 1px solid #ffa500;
834 color: black;
835 font-weight: bold;
836 margin: 2em 0 1em;
837 padding: .5em 1em;
838 vertical-align: middle;
840 /* Site Notice */
841 #siteNotice {
842 text-align: center;
843 font-size: 95%;
844 margin-bottom: 0.9em;
846 #siteNotice p {
847 margin: 0;
848 padding: 0;
850 /* Categories */
851 .catlinks {
852 border: 1px solid #aaa;
853 background-color: #f9f9f9;
854 padding: 5px;
855 margin-top: 1em;
856 clear: both;
858 /* Sub-navigation */
859 #siteSub {
860 display: none;
862 #jump-to-nav {
863 display: none;
865 #contentSub, #contentSub2 {
866 font-size: 84%;
867 line-height: 1.2em;
868 margin: 0 0 1.4em 1em;
869 color: #7d7d7d;
870 width: auto;
872 span.subpages {
873 display: block;
875 /* Emulate Center */
876 .center {
877 width: 100%;
878 text-align: center;
880 *.center * {
881 margin-left: auto;
882 margin-right: auto;
884 /* Small for tables and similar */
885 .small, .small * {
886 font-size: 94%;
888 table.small {
889 font-size: 100%;
891 /* Edge Cases for Content */
892 #content h1, #content h2 {
893 margin-bottom: .6em;
895 #content h3, #content h4, #content h5 {
896 margin-bottom: .3em;
898 h1#firstHeading {
899 padding-top: 0;
900 margin-top: 0;
901 padding-top: 0;
902 margin-bottom: 0.1em;
903 line-height: 1.2em;
904 padding-bottom: 0;
906 #content a.external,
907 #content a[href ^="gopher://"] {
908 background: url(images/external-link-ltr-icon.png) center right no-repeat;
909 padding: 0 13px 0 0;
911 #content a[href ^="https://"],
912 .link-https {
913 background: url(images/lock-icon.png) center right no-repeat;
914 padding: 0 18px 0 0;
916 #content a[href ^="mailto:"],
917 .link-mailto {
918 background: url(images/mail-icon.png) center right no-repeat;
919 padding: 0 18px 0 0;
921 #content a[href ^="news://"] {
922 background: url(images/news-icon.png) center right no-repeat;
923 padding: 0 18px 0 0;
925 #content a[href ^="ftp://"],
926 .link-ftp {
927 background: url(images/file-icon.png) center right no-repeat;
928 padding: 0 18px 0 0;
930 #content a[href ^="irc://"],
931 #content a.extiw[href ^="irc://"],
932 .link-irc {
933 background: url(images/talk-icon.png) center right no-repeat;
934 padding: 0 18px 0 0;
936 #content a.external[href $=".ogg"], #content a.external[href $=".OGG"],
937 #content a.external[href $=".mid"], #content a.external[href $=".MID"],
938 #content a.external[href $=".midi"], #content a.external[href $=".MIDI"],
939 #content a.external[href $=".mp3"], #content a.external[href $=".MP3"],
940 #content a.external[href $=".wav"], #content a.external[href $=".WAV"],
941 #content a.external[href $=".wma"], #content a.external[href $=".WMA"],
942 .link-audio {
943 background: url("images/audio-icon.png") center right no-repeat;
944 padding: 0 18px 0 0;
946 #content a.external[href $=".ogm"], #content a.external[href $=".OGM"],
947 #content a.external[href $=".avi"], #content a.external[href $=".AVI"],
948 #content a.external[href $=".mpeg"], #content a.external[href $=".MPEG"],
949 #content a.external[href $=".mpg"], #content a.external[href $=".MPG"],
950 .link-video {
951 background: url("images/video-icon.png") center right no-repeat;
952 padding: 0 18px 0 0;
954 #content a.external[href $=".pdf"], #content a.external[href $=".PDF"],
955 #content a.external[href *=".pdf#"], #content a.external[href *=".PDF#"],
956 #content a.external[href *=".pdf?"], #content a.external[href *=".PDF?"],
957 .link-document {
958 background: url("images/document-icon.png") center right no-repeat;
959 padding: 0 18px 0 0;
961 /* Interwiki Styling (Disabled) */
962 #content a.extiw,
963 #content a.extiw:active {
964 color: #36b;
965 background: none;
966 padding: 0;
968 #content a.external {
969 color: #36b;
971 #content .printfooter {
972 display: none;
976 li#pt-userpage,
977 li#pt-anonuserpage,
978 li#pt-login {
979 background: url(images/user-icon.png) left top no-repeat;
980 padding-left: 15px !important;
981 text-transform: none;
984 span.newpage, span.minor, span.bot {
985 font-weight: bold;
988 .toccolours {
989 border: 1px solid #aaa;
990 background-color: #f9f9f9;
991 padding: 5px;
992 font-size: 95%;
995 div#bodyContent {
996 position: relative;
997 width: 100%;