Brought back the user icon in personal links
[lhc/web/wiklou.git] / skins / vector / main-ltr.css
1 /* Framework */
2 html,
3 body {
4 height: 100%;
5 margin: 0;
6 padding: 0;
7 font-family: sans-serif;
8 font-size: small;
9 }
10 body {
11 background-image: url(images/page-base.png);
12 }
13 /* Content */
14 div#content {
15 margin-left: 12em;
16 padding: 1em;
17 background-image: url(images/content-base.png);
18 background-position: top left;
19 background-repeat: repeat-y;
20 background-color: white;
21 }
22 /* Head */
23 div#page-base {
24 height: 6em;
25 background-color: white;
26 background-image: url(images/page-fade.png);
27 background-position: bottom left;
28 background-repeat: repeat-x;
29 }
30 div#head-base {
31 margin-top: -6em;
32 margin-left: 12em;
33 height: 6em;
34 background-image: url(images/head-base.png);
35 background-position: bottom left;
36 background-repeat: repeat-x;
37 }
38 div#head {
39 position: absolute;
40 top: 0;
41 right: 0;
42 width: 100%;
43 }
44 div#head ul,
45 div#head li {
46 list-style: none;
47 margin: 0;
48 padding: 0;
49 }
50 div#head h5 {
51 margin: 0;
52 padding: 0;
53 }
54 /* Personal */
55 div#personal {
56 position: absolute;
57 top: 0;
58 right: 0.75em;
59 }
60 div#personal h5 {
61 display: none;
62 }
63 div#personal li {
64 float: left;
65 margin-left: 0.75em;
66 margin-top: 0.5em;
67 font-size: 0.9em;
68 }
69 div#left-navigation {
70 position: absolute;
71 left: 12em;
72 top: 3em;
73 }
74 div#right-navigation {
75 float: right;
76 margin-top: 3em;
77 }
78 /* Navigation Labels */
79 div#namespaces h5,
80 div#variants h5,
81 div#views h5,
82 div#actions h5 span,
83 div#search h5 {
84 display: none;
85 }
86 /* Namespaces and Views */
87 div#namespaces,
88 div#views {
89 float: left;
90 background-image: url(images/tab-break.png);
91 background-position: bottom left;
92 background-repeat: no-repeat;
93 padding-left: 1px;
94 }
95 div#namespaces ul,
96 div#views ul {
97 float: left;
98 height: 100%;
99 }
100 /* OVERRIDDEN BY COMPLIANT BROWSERS */
101 div#namespaces ul li,
102 div#views ul li {
103 display: inline-block;
104 float: left;
105 height: 100%;
106 background-image: url(images/tab-normal-fade.png);
107 background-position: bottom left;
108 background-repeat: repeat-x;
109 }
110 /* IGNORED BY IE6 */
111 div#namespaces ul > li,
112 div#views ul > li {
113 display: block;
114 }
115 div#namespaces li.selected,
116 div#views li.selected {
117 background-image: url(images/tab-current-fade.png);
118 }
119 /* OVERRIDDEN BY COMPLIANT BROWSERS */
120 div#namespaces li a,
121 div#views li a {
122 display: inline-block;
123 height: 3em;
124 padding-left: 0.5em;
125 padding-right: 0.5em;
126 background-image: url(images/tab-break.png);
127 background-position: bottom right;
128 background-repeat: no-repeat;
129 }
130 /* IGNORED BY IE6 */
131 div#namespaces li > a,
132 div#views li > a {
133 display: block;
134 }
135 /* OVERRIDDEN BY COMPLIANT BROWSERS */
136 div#namespaces a span,
137 div#views a span {
138 color: #0645ad;
139 display: inline-block;
140 padding-top: 1.25em;
141 cursor: pointer;
142 }
143 /* IGNORED BY IE6 */
144 div#namespaces a > span,
145 div#views a > span {
146 float: left;
147 display: block;
148 }
149 div#namespaces li.selected a span,
150 div#views li.selected a:visited span {
151 color: #333333;
152 cursor: default;
153 text-decoration: none;
154 }
155 div#namespaces li.new a span,
156 div#namespaces li.new a:visited span{
157 color: #a55858;
158 }
159 /* Variants and Actions */
160 div#variants,
161 div#actions {
162 float: left;
163 background-image: url(images/arrow-down-icon.png);
164 background-position: center center;
165 background-repeat: no-repeat;
166 }
167 div#variants h5,
168 div#actions h5 {
169 float: left;
170 }
171 /* OVERRIDDEN BY COMPLIANT BROWSERS */
172 div#variants h5 a,
173 div#actions h5 a {
174 display: inline-block;
175 width: 24px;
176 height: 3em;
177 text-decoration: none;
178 background-image: url(images/tab-break.png);
179 background-position: bottom right;
180 background-repeat: no-repeat;
181 }
182 /* IGNORED BY IE6 */
183 div#variants h5 > a,
184 div#actions h5 > a {
185 display: block;
186 }
187 div#variants div.menu,
188 div#actions div.menu {
189 display: none;
190 clear: both;
191 }
192 div#variants:hover div.menu,
193 div#actions:hover div.menu {
194 display: block;
195 }
196 div#variants ul,
197 div#actions ul {
198 position: absolute;
199 background-color: white;
200 border: solid 1px silver;
201 border-top-width: 0;
202 padding: 0;
203 margin: 0;
204 margin-left: -1px;
205 }
206 /* OVERRIDDEN BY COMPLIANT BROWSERS */
207 div#variants:hover li a,
208 div#actions li a {
209 display: inline-block;
210 padding: 0.5em;
211 }
212 /* IGNORED BY IE6 */
213 div#variants:hover li > a,
214 div#actions li > a {
215 display: block;
216 }
217 /* Search */
218 div#search {
219 float: left;
220 margin-right: 0.75em;
221 }
222 div#search form,
223 div#search input {
224 float: left;
225 margin-top: 0.4em;
226 margin-left: 0.25em;
227 }
228 /* Panel */
229 div#panel {
230 position: absolute;
231 top: 12em;
232 width: 12em;
233 left: 0;
234 }
235 div#panel div.portal {
236 padding-top: 1.5em;
237 }
238 div#panel div.portal h5 {
239 font-weight: normal;
240 color: #666666;
241 padding: 0.5em;
242 padding-top: 0;
243 padding-left: 1.25em;
244 cursor: default;
245 }
246 div#panel div.portal div.body {
247 margin-top: 0.25em;
248 padding-top: 0.5em;
249 margin-left: 1.25em;
250 background-image: url(images/portal-break-ltr.png);
251 background-repeat: no-repeat;
252 background-position: top left;
253 }
254 div#panel div.portal div.body ul {
255 list-style: none;
256 padding: 0;
257 margin: 0;
258 }
259 div#panel div.portal div.body ul li {
260 padding: 0;
261 padding-bottom: 0.5em;
262 margin: 0;
263 overflow: hidden;
264 }
265 div#panel div.portal div.body ul li a {
266 color: #0645ad;
267 }
268 div#panel div.portal div.body ul li a:visited {
269 color: #0b0080;
270 }
271 /* Foot */
272 div#foot {
273 margin-left: 12em;
274 margin-top: 0;
275 padding: 0.75em;
276 background-image: url(images/foot-base.png);
277 background-position: top left;
278 background-repeat: repeat-x;
279 }
280 div#foot ul {
281 list-style: none;
282 margin: 0;
283 padding: 0;
284 }
285 div#foot ul li {
286 margin: 0;
287 padding: 0;
288 padding-top: 0.5em;
289 padding-bottom: 0.5em;
290 color: #333333;
291 font-size: 0.9em;
292 }
293 div#foot ul#foot-icons {
294 float: right;
295 }
296 div#foot ul#foot-places {
297 float: left;
298 }
299 div#foot ul#foot-info li {
300 line-height: 1.4em;
301 }
302 div#foot ul#foot-icons li {
303 float: left;
304 margin-left: 0.5em;
305 line-height: 2em;
306 }
307 div#foot ul#foot-places li {
308 float: left;
309 margin-right: 1em;
310 line-height: 2em;
311 }
312 /* Logo */
313 div#logo {
314 position: absolute;
315 top: 0;
316 left: 0;
317 height: 12em;
318 width: 12em;
319 }
320 div#logo a {
321 display: block;
322 width: 12em;
323 height: 12em;
324 background-repeat: no-repeat;
325 background-position: 50% 50%;
326 text-decoration: none;
327 }
328
329 /*
330 *
331 * The following code is highly modified from monobook. It would be nice if the
332 * preftoc id was more human readable like preferences-toc for instance,
333 * howerver this would require backporting the other skins.
334 */
335
336 /* Preferences */
337 #preftoc {
338 /* Tabs */
339 float: left;
340 clear: both;
341 margin: 0 !important;
342 padding: 0 !important;
343 height: 2.25em;
344 background-image: url(images/preferences-break.png);
345 background-position: bottom left;
346 background-repeat: no-repeat;
347 }
348 #preftoc li {
349 /* Tab */
350 float: left;
351 margin: 0;
352 padding: 0;
353 padding-right: 1px;
354 height: 2.25em;
355 white-space: nowrap;
356 list-style-type: none;
357 list-style-image: none;
358 background-image: url(images/preferences-break.png);
359 background-position: bottom right;
360 background-repeat: no-repeat;
361 }
362 /* IGNORED BY IE6 */
363 #preftoc li:first-child {
364 margin-left: 1px;
365 }
366 #preftoc a,
367 #preftoc a:active {
368 display: inline-block;
369 position: relative;
370 color: #0645ad;
371 padding: 0.5em;
372 text-decoration: none;
373 background-image: none;
374 }
375 #preftoc a:hover {
376 text-decoration: underline;
377 }
378 #preftoc li.selected a {
379 cursor: default;
380 background-image: url(images/preferences-fade.png);
381 background-position: bottom;
382 background-repeat: repeat-x;
383 color: #333333;
384 cursor: default;
385 text-decoration: none;
386 }
387 #preferences {
388 float: left;
389 zoom: 1;
390 width: 100%;
391 margin: 0;
392 clear: both;
393 border: solid 1px #cccccc;
394 background-color: #f9f9f9;
395 background-image: url(images/preferences-base.png);
396 }
397 #preferences fieldset.prefsection {
398 border: none;
399 padding: 0;
400 margin: 1em;
401 }
402 #preferences fieldset.prefsection fieldset {
403 border: none;
404 border-top: solid 1px #cccccc;
405 }
406 #preferences legend {
407 color: #666666;
408 }
409 #preferences fieldset.prefsection legend.mainLegend {
410 display: none;
411 }
412 #preferences td {
413 padding-left: 0.5em;
414 padding-right: 0.5em;
415 }
416 #preferences td.htmlform-tip {
417 font-size: x-small;
418 padding: .2em 2em;
419 color: #666666;
420 }
421 #preferences div.mw-prefs-buttons {
422 padding: 1em;
423 }
424 #preferences div.mw-prefs-buttons input {
425 margin-right: 0.25em;
426 }
427
428 /*
429 *
430 * The following code is slightly modified from monobook
431 *
432 */
433
434 /* Links */
435 a {
436 text-decoration: none;
437 color: #0645ad;
438 background: none;
439 }
440 a:visited {
441 color: #0b0080;
442 }
443 a:active {
444 color: #faa700;
445 }
446 a:hover {
447 text-decoration: underline;
448 }
449 a.stub {
450 color: #772233;
451 }
452 a.new, #p-personal a.new {
453 color: #ba0000;
454 }
455 a.new:visited, #p-personal a.new:visited {
456 color: #a55858;
457 }
458
459 /* Inline Elements */
460 img {
461 border: none;
462 vertical-align: middle;
463 }
464 hr {
465 height: 1px;
466 color: #aaa;
467 background-color: #aaa;
468 border: 0;
469 margin: .2em 0 .2em 0;
470 }
471
472 /* Structural Elements */
473 h1,
474 h2,
475 h3,
476 h4,
477 h5,
478 h6 {
479 color: black;
480 background: none;
481 font-weight: normal;
482 margin: 0;
483 padding-top: .5em;
484 padding-bottom: .17em;
485 border-bottom: 1px solid #aaa;
486 width: auto;
487 }
488 h1 { font-size: 188%; }
489 h1 .editsection { font-size: 53%; }
490 h2 { font-size: 150%; }
491 h2 .editsection { font-size: 67%; }
492 h3,
493 h4,
494 h5,
495 h6 {
496 border-bottom: none;
497 font-weight: bold;
498 }
499 h3 { font-size: 132%; }
500 h3 .editsection { font-size: 76%; font-weight: normal; }
501 h4 { font-size: 116%; }
502 h4 .editsection { font-size: 86%; font-weight: normal; }
503 h5 { font-size: 100%; }
504 h5 .editsection { font-weight: normal; }
505 h6 { font-size: 80%; }
506 h6 .editsection { font-size: 125%; font-weight: normal; }
507 p {
508 margin: .4em 0 .5em 0;
509 line-height: 1.5em;
510 }
511 p img {
512 margin: 0;
513 }
514 abbr,
515 acronym,
516 .explain {
517 border-bottom: 1px dotted black;
518 color: black;
519 background: none;
520 cursor: help;
521 }
522 q {
523 font-family: Times, "Times New Roman", serif;
524 font-style: italic;
525 }
526 /* Disabled for now
527 blockquote {
528 font-family: Times, "Times New Roman", serif;
529 font-style: italic;
530 }*/
531 code {
532 background-color: #f9f9f9;
533 }
534 pre {
535 padding: 1em;
536 border: 1px dashed #2f6fab;
537 color: black;
538 background-color: #f9f9f9;
539 line-height: 1.1em;
540 }
541 div#content ul {
542 line-height: 1.5em;
543 list-style-type: square;
544 margin: .3em 0 0 1.5em;
545 padding: 0;
546 list-style-image: url(images/bullet-icon.png);
547 }
548 div#content ol {
549 line-height: 1.5em;
550 margin: .3em 0 0 3.2em;
551 padding: 0;
552 list-style-image: none;
553 }
554 div#content li {
555 margin-bottom: .1em;
556 }
557 div#content dt {
558 font-weight: bold;
559 margin-bottom: .1em;
560 }
561 div#content dl {
562 margin-top: .2em;
563 margin-bottom: .5em;
564 }
565 div#content dd {
566 line-height: 1.5em;
567 margin-left: 2em;
568 margin-bottom: .1em;
569 }
570 /* Tables */
571 div#content table {
572 font-size: 100%;
573 color: black;
574 /* we don't want the bottom borders of <h2>s to be visible through
575 * floated tables */
576 background-color: white;
577 }
578 div#content fieldset table {
579 /* but keep table layouts in forms clean... */
580 background: none;
581 }
582 /* Forms */
583 div#content fieldset {
584 border: 1px solid #2f6fab;
585 margin: 1em 0 1em 0;
586 padding: 0 1em 1em;
587 line-height: 1.5em;
588 }
589 fieldset.nested {
590 margin: 0 0 0.5em 0;
591 padding: 0 0.5em 0.5em;
592 }
593 div#content legend {
594 padding: .5em;
595 font-size: 95%;
596 }
597 div#content form {
598 border: none;
599 margin: 0;
600 }
601 div#content textarea {
602 width: 100%;
603 padding: .1em;
604 }
605 div#content select {
606 vertical-align: top;
607 }
608 /* Table of Contents */
609 #toc,
610 .toc,
611 .mw-warning {
612 border: 1px solid #aaa;
613 background-color: #f9f9f9;
614 padding: 5px;
615 font-size: 95%;
616 }
617 #toc h2,
618 .toc h2 {
619 display: inline;
620 border: none;
621 padding: 0;
622 font-size: 100%;
623 font-weight: bold;
624 }
625 #toc #toctitle,
626 .toc #toctitle,
627 #toc .toctitle,
628 .toc .toctitle {
629 text-align: center;
630 }
631 #toc ul,
632 .toc ul {
633 list-style-type: none;
634 list-style-image: none;
635 margin-left: 0;
636 padding-left: 0;
637 text-align: left;
638 }
639 #toc ul ul,
640 .toc ul ul {
641 margin: 0 0 0 2em;
642 }
643 #toc .toctoggle,
644 .toc .toctoggle {
645 font-size: 94%;
646 }
647 /* Images */
648 div.floatright, table.floatright {
649 clear: right;
650 float: right;
651 position: relative;
652 margin: 0 0 .5em .5em;
653 border: 0;
654 }
655 div.floatright p { font-style: italic; }
656 div.floatleft, table.floatleft {
657 float: left;
658 clear: left;
659 position: relative;
660 margin: 0 .5em .5em 0;
661 border: 0;
662 }
663 div.floatleft p { font-style: italic; }
664 /* Thumbnails */
665 div.thumb {
666 margin-bottom: .5em;
667 border-style: solid;
668 border-color: white;
669 width: auto;
670 }
671 div.thumbinner {
672 border: 1px solid #ccc;
673 padding: 3px !important;
674 background-color: #f9f9f9;
675 font-size: 94%;
676 text-align: center;
677 overflow: hidden;
678 }
679 html .thumbimage {
680 border: 1px solid #ccc;
681 }
682 html .thumbcaption {
683 border: none;
684 text-align: left;
685 line-height: 1.4em;
686 padding: 3px !important;
687 font-size: 94%;
688 }
689 div.magnify {
690 float: right;
691 border: none !important;
692 background: none !important;
693 }
694 div.magnify a, div.magnify img {
695 display: block;
696 border: none !important;
697 background: none !important;
698 }
699 div.tright {
700 clear: right;
701 float: right;
702 border-width: .5em 0 .8em 1.4em;
703 }
704 div.tleft {
705 float: left;
706 clear: left;
707 margin-right: .5em;
708 border-width: .5em 1.4em .8em 0;
709 }
710 img.thumbborder {
711 border: 1px solid #dddddd;
712 }
713 .hiddenStructure {
714 display: none;
715 }
716 /* Warning */
717 .mw-warning {
718 margin-left: 50px;
719 margin-right: 50px;
720 text-align: center;
721 }
722 /* User Message */
723 .usermessage {
724 background-color: #ffce7b;
725 border: 1px solid #ffa500;
726 color: black;
727 font-weight: bold;
728 margin: 2em 0 1em;
729 padding: .5em 1em;
730 vertical-align: middle;
731 }
732 /* Site Notice */
733 #siteNotice {
734 text-align: center;
735 font-size: 95%;
736 padding-top: 0.9em;
737 }
738 #siteNotice p {
739 margin: 0;
740 padding: 0;
741 }
742 /* Categories */
743 .catlinks {
744 border: 1px solid #aaa;
745 background-color: #f9f9f9;
746 padding: 5px;
747 margin-top: 1em;
748 clear: both;
749 }
750 /* Sub-navigation */
751 #siteSub {
752 display: none;
753 }
754 #jump-to-nav {
755 display: none;
756 }
757 #contentSub, #contentSub2 {
758 font-size: 84%;
759 line-height: 1.2em;
760 margin: 0 0 1.4em 1em;
761 color: #7d7d7d;
762 width: auto;
763 }
764 span.subpages {
765 display: block;
766 }
767 /* Emulate Center */
768 .center {
769 width: 100%;
770 text-align: center;
771 }
772 *.center * {
773 margin-left: auto;
774 margin-right: auto;
775 }
776 /* Small for tables and similar */
777 .small, .small * {
778 font-size: 94%;
779 }
780 table.small {
781 font-size: 100%;
782 }
783 /* Edge Cases for Content */
784 #content h1, #content h2 {
785 margin-bottom: .6em;
786 }
787 #content h3, #content h4, #content h5 {
788 margin-bottom: .3em;
789 }
790 h1#firstHeading {
791 padding-top: 0;
792 margin-top: 0;
793 padding-top: 0;
794 margin-bottom: 0.1em;
795 line-height: 1.2em;
796 padding-bottom: 0;
797 }
798 #content a.external,
799 #content a[href ^="gopher://"] {
800 background: url(images/external-link-ltr-icon.png) center right no-repeat;
801 padding: 0 13px 0 0;
802 }
803 #content a[href ^="https://"],
804 .link-https {
805 background: url(images/lock-icon.png) center right no-repeat;
806 padding: 0 18px 0 0;
807 }
808 #content a[href ^="mailto:"],
809 .link-mailto {
810 background: url(images/mail-icon.png) center right no-repeat;
811 padding: 0 18px 0 0;
812 }
813 #content a[href ^="news://"] {
814 background: url(images/news-icon.png) center right no-repeat;
815 padding: 0 18px 0 0;
816 }
817 #content a[href ^="ftp://"],
818 .link-ftp {
819 background: url(images/file-icon.png) center right no-repeat;
820 padding: 0 18px 0 0;
821 }
822 #content a[href ^="irc://"],
823 #content a.extiw[href ^="irc://"],
824 .link-irc {
825 background: url(images/talk-icon.png) center right no-repeat;
826 padding: 0 18px 0 0;
827 }
828 #content a.external[href $=".ogg"], #content a.external[href $=".OGG"],
829 #content a.external[href $=".mid"], #content a.external[href $=".MID"],
830 #content a.external[href $=".midi"], #content a.external[href $=".MIDI"],
831 #content a.external[href $=".mp3"], #content a.external[href $=".MP3"],
832 #content a.external[href $=".wav"], #content a.external[href $=".WAV"],
833 #content a.external[href $=".wma"], #content a.external[href $=".WMA"],
834 .link-audio {
835 background: url("images/audio-icon.png") center right no-repeat;
836 padding: 0 18px 0 0;
837 }
838 #content a.external[href $=".ogm"], #content a.external[href $=".OGM"],
839 #content a.external[href $=".avi"], #content a.external[href $=".AVI"],
840 #content a.external[href $=".mpeg"], #content a.external[href $=".MPEG"],
841 #content a.external[href $=".mpg"], #content a.external[href $=".MPG"],
842 .link-video {
843 background: url("images/video-icon.png") center right no-repeat;
844 padding: 0 18px 0 0;
845 }
846 #content a.external[href $=".pdf"], #content a.external[href $=".PDF"],
847 #content a.external[href *=".pdf#"], #content a.external[href *=".PDF#"],
848 #content a.external[href *=".pdf?"], #content a.external[href *=".PDF?"],
849 .link-document {
850 background: url("images/document-icon.png") center right no-repeat;
851 padding: 0 18px 0 0;
852 }
853 /* Interwiki Styling (Disabled) */
854 #content a.extiw,
855 #content a.extiw:active {
856 color: #36b;
857 background: none;
858 padding: 0;
859 }
860 #content a.external {
861 color: #36b;
862 }
863 #content .plainlinks a {
864 /* this can be used in the content area to switch off special external link
865 * styling */
866 background: none !important;
867 padding: 0 !important;
868 }
869 #content .printfooter {
870 display: none;
871 }
872
873
874 li#pt-userpage,
875 li#pt-anonuserpage,
876 li#pt-login {
877 background: url(images/user-icon.png) left top no-repeat;
878 padding-left: 15px !important;
879 text-transform: none;
880 }