build: Enable selector-list-comma-newline-after stylelint rule
[lhc/web/wiklou.git] / resources / src / mediawiki.legacy / 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 * NOTE: The images which are referenced in this file are no longer in use in
7 * essential interface components. They should NOT be embedded, because that
8 * optimizes for the uncommon case at the cost of bloating the size of render-
9 * blocking CSS common to all pages.
10 */
11
12 /* GENERAL CLASSES FOR DIRECTIONALITY SUPPORT */
13
14 /**
15 * These classes should be used for text depending on the content direction.
16 * Content stuff like editsection, ul/ol and TOC depend on this.
17 */
18 .mw-content-ltr {
19 /* @noflip */
20 direction: ltr;
21 }
22
23 .mw-content-rtl {
24 /* @noflip */
25 direction: rtl;
26 }
27
28 /* Most input fields should be in site direction */
29 .sitedir-ltr textarea,
30 .sitedir-ltr input {
31 /* @noflip */
32 direction: ltr;
33 }
34
35 .sitedir-rtl textarea,
36 .sitedir-rtl input {
37 /* @noflip */
38 direction: rtl;
39 }
40
41 .mw-userlink {
42 unicode-bidi: embed;
43 }
44
45 /* User-Agent styles for new HTML5 elements */
46 mark {
47 background-color: #ff0;
48 color: #000;
49 }
50
51 /* Helper for wbr element on IE 8+; in HTML5, but not supported by default as of IE 11. */
52 /* Note canonical HTML5 styles recommend "content: \u200B", but this doesn't work as of IE 11. */
53 wbr {
54 display: inline-block;
55 }
56
57 /* Input types that should follow user direction, like buttons */
58 /* TODO: What about buttons in wikipage content ? */
59 input[type="submit"],
60 input[type="button"],
61 input[type="reset"],
62 input[type="file"] {
63 direction: ltr;
64 }
65
66 /* Override default values */
67 textarea[dir="ltr"],
68 input[dir="ltr"] {
69 /* @noflip */
70 direction: ltr;
71 }
72
73 textarea[dir="rtl"],
74 input[dir="rtl"] {
75 /* @noflip */
76 direction: rtl;
77 }
78
79 /* Default style for semantic tags */
80 abbr[title],
81 .explain[title] {
82 border-bottom: 1px dotted;
83 cursor: help;
84 }
85
86 @supports ( text-decoration: underline dotted ) {
87 abbr[title],
88 .explain[title] {
89 border-bottom: 0;
90 text-decoration: underline dotted;
91 }
92 }
93
94 /* Comment portions of RC entries */
95 span.comment {
96 font-style: italic;
97 unicode-bidi: -moz-isolate;
98 unicode-bidi: isolate;
99 }
100
101 /* Stop floats from intruding into edit area in previews */
102 #editform,
103 #toolbar,
104 #wpTextbox1 {
105 clear: both;
106 }
107
108 /* Edit font preference */
109 /* TODO: for 'default' on non-textareas we could compute the default font of textarea in the client */
110 .mw-editfont-default:not( textarea ) {
111 font-family: monospace;
112 }
113
114 /* Keep this rule separate from the :not rule above so it still works in older browsers */
115 .mw-editfont-monospace {
116 font-family: monospace;
117 }
118
119 .mw-editfont-sans-serif {
120 font-family: sans-serif;
121 }
122
123 .mw-editfont-serif {
124 font-family: serif;
125 }
126
127 /* Underline preference */
128
129 .mw-underline-always a {
130 text-decoration: underline;
131 }
132
133 .mw-underline-never a {
134 text-decoration: none;
135 }
136
137 /**
138 * rev_deleted stuff
139 */
140 li span.deleted,
141 span.history-deleted {
142 text-decoration: line-through;
143 color: #888;
144 font-style: italic;
145 }
146
147 /**
148 * Patrol stuff
149 */
150 .not-patrolled {
151 background-color: #ffa;
152 }
153
154 .unpatrolled {
155 font-weight: bold;
156 color: #f00;
157 }
158
159 div.patrollink {
160 font-size: 75%;
161 text-align: right;
162 }
163
164 /**
165 * Forms
166 */
167 td.mw-label {
168 text-align: right;
169 }
170
171 td.mw-input {
172 text-align: left;
173 }
174
175 td.mw-submit {
176 text-align: left;
177 }
178
179 td.mw-label {
180 vertical-align: middle;
181 }
182
183 td.mw-submit {
184 white-space: nowrap;
185 }
186
187 input#wpSummary {
188 background-color: #fff;
189 color: #000;
190 width: 80%;
191 margin-bottom: 1em;
192 padding: 0.625em 0.546875em 0.546875em;
193 border: 1px solid #a2a9b1;
194 border-radius: 2px;
195 box-shadow: inset 0 0 0 1px #fff;
196 font-family: inherit;
197 font-size: inherit;
198 -webkit-transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 );
199 -moz-transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 );
200 transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 );
201 }
202
203 input#wpSummary:focus,
204 input#wpSummary:active {
205 outline: 0;
206 border-color: #36c;
207 box-shadow: inset 0 0 0 1px #36c;
208 }
209
210 .mw-input-with-label {
211 white-space: nowrap;
212 display: inline-block;
213 }
214
215 /**
216 * Image captions.
217 *
218 * This is only meant to provide the most basic of styles, visual settings shouldn't be added here.
219 */
220
221 /* @noflip */
222 .mw-content-ltr .thumbcaption {
223 text-align: left;
224 }
225
226 /* @noflip */
227 .mw-content-ltr .magnify {
228 float: right;
229 }
230
231 /* @noflip */
232 .mw-content-rtl .thumbcaption {
233 text-align: right;
234 }
235
236 /* @noflip */
237 .mw-content-rtl .magnify {
238 float: left;
239 }
240
241 /**
242 * Categories
243 */
244 #catlinks {
245 /**
246 * Overrides text justification (user preference)
247 * See T33990
248 */
249 text-align: left;
250 }
251
252 .catlinks ul {
253 display: inline;
254 margin: 0;
255 padding: 0;
256 list-style: none;
257 list-style-type: none;
258 list-style-image: none;
259 vertical-align: middle !ie;
260 }
261
262 .catlinks li {
263 display: inline-block;
264 line-height: 1.25em;
265 border-left: 1px solid #a2a9b1;
266 margin: 0.125em 0;
267 padding: 0 0.5em;
268 zoom: 1;
269 display: inline !ie; /* stylelint-disable-line declaration-block-no-duplicate-properties */
270 }
271
272 .catlinks li:first-child {
273 padding-left: 0.25em;
274 border-left: 0;
275 }
276
277 /* (T7346) make category redirects italic */
278 .catlinks li a.mw-redirect {
279 font-style: italic;
280 }
281
282 /**
283 * Hidden categories
284 */
285 .mw-hidden-cats-hidden {
286 display: none;
287 }
288
289 .catlinks-allhidden {
290 display: none;
291 }
292
293 /**
294 * Convenience links to edit delete and protect reasons
295 */
296 p.mw-protect-editreasons,
297 p.mw-filedelete-editreasons,
298 p.mw-delete-editreasons {
299 font-size: 90%;
300 text-align: right;
301 }
302
303 /* The auto-generated edit comments */
304 .autocomment {
305 color: #808080;
306 }
307
308 /** Generic minor/bot/newpage styling (recent changes) */
309 .newpage,
310 .minoredit,
311 .botedit {
312 font-weight: bold;
313 }
314
315 /**
316 * Recreating deleted page warning
317 * Reupload file warning
318 * Page protection warning
319 * incl. log entries for these warnings
320 */
321 div.mw-warning-with-logexcerpt {
322 padding: 3px;
323 margin-bottom: 3px;
324 border: 2px solid #2a4b8d;
325 clear: both;
326 }
327
328 div.mw-warning-with-logexcerpt ul li {
329 font-size: 90%;
330 }
331
332 /* (show/hide) revision deletion links */
333 span.mw-revdelundel-link,
334 strong.mw-revdelundel-link {
335 font-size: 90%;
336 }
337
338 span.mw-revdelundel-hidden,
339 input.mw-revdelundel-hidden {
340 visibility: hidden;
341 }
342
343 td.mw-revdel-checkbox,
344 th.mw-revdel-checkbox {
345 padding-right: 10px;
346 text-align: center;
347 }
348
349 /* red links; see T38276 */
350 a.new {
351 color: #ba0000;
352 }
353
354 /* Plainlinks - this can be used to switch
355 * off special external link styling */
356 .plainlinks a.external {
357 background: none !important;
358 padding: 0 !important;
359 }
360
361 /* External URLs should always be treated as LTR (T6330) */
362 /* @noflip */ .rtl a.external.free,
363 .rtl a.external.autonumber {
364 direction: ltr;
365 unicode-bidi: embed;
366 }
367
368 /**
369 * wikitable class for skinning normal tables
370 * keep in sync with commonPrint.css
371 */
372 table.wikitable {
373 margin: 1em 0;
374 background-color: #f8f9fa;
375 border: 1px solid #a2a9b1;
376 border-collapse: collapse;
377 color: #000;
378 }
379
380 table.wikitable > tr > th,
381 table.wikitable > tr > td,
382 table.wikitable > * > tr > th,
383 table.wikitable > * > tr > td {
384 border: 1px solid #a2a9b1;
385 padding: 0.2em 0.4em;
386 }
387
388 table.wikitable > tr > th,
389 table.wikitable > * > tr > th {
390 background-color: #eaecf0;
391 text-align: center;
392 }
393
394 table.wikitable > caption {
395 font-weight: bold;
396 }
397
398 /* success and error messages */
399 .error,
400 .warning,
401 .success {
402 font-size: larger;
403 }
404
405 .error {
406 color: #c00;
407 }
408
409 .warning {
410 color: #705000;
411 }
412
413 .success {
414 color: #009000;
415 }
416
417 .errorbox,
418 .warningbox,
419 .successbox {
420 border: 1px solid;
421 padding: 0.5em 1em;
422 margin-bottom: 1em;
423 display: inline-block;
424 zoom: 1;
425 *display: inline; /* stylelint-disable-line declaration-block-no-duplicate-properties */
426 }
427
428 .errorbox h2,
429 .warningbox h2,
430 .successbox h2 {
431 font-size: 1em;
432 color: inherit;
433 font-weight: bold;
434 display: inline;
435 margin: 0 0.5em 0 0;
436 border: 0;
437 }
438
439 .errorbox {
440 color: #c00;
441 border-color: #fac5c5;
442 background-color: #fae3e3;
443 }
444
445 .warningbox {
446 color: #705000;
447 border-color: #fde29b;
448 background-color: #fdf1d1;
449 }
450
451 .successbox {
452 color: #008000;
453 border-color: #b7fdb5;
454 background-color: #e1fddf;
455 }
456
457 /* general info/warning box for SP */
458 .mw-infobox {
459 border: 2px solid #ff7f00;
460 margin: 0.5em;
461 clear: left;
462 overflow: hidden;
463 }
464
465 .mw-infobox-left {
466 margin: 7px;
467 float: left;
468 width: 35px;
469 }
470
471 .mw-infobox-right {
472 margin: 0.5em 0.5em 0.5em 49px;
473 }
474
475 /* Note on preview page */
476 .previewnote {
477 color: #c00;
478 margin-bottom: 1em;
479 }
480
481 .previewnote p {
482 text-indent: 3em;
483 margin: 0.8em 0;
484 }
485
486 .visualClear {
487 clear: both;
488 }
489
490 /**
491 * Data table style
492 *
493 * Transparent table with suddle borders
494 * and blue row-highlighting.
495 */
496 .mw-datatable {
497 border-collapse: collapse;
498 }
499
500 .mw-datatable,
501 .mw-datatable td,
502 .mw-datatable th {
503 border: 1px solid #a2a9b1;
504 padding: 0 0.15em 0 0.15em;
505 }
506
507 .mw-datatable th {
508 background-color: #ddf;
509 }
510
511 .mw-datatable td {
512 background-color: #fff;
513 }
514
515 .mw-datatable tr:hover td {
516 background-color: #eaf3ff;
517 }
518
519 /* Correct directionality when page dir is different from site/user dir */
520 .mw-content-ltr ul,
521 .mw-content-rtl .mw-content-ltr ul {
522 /* @noflip */
523 margin: 0.3em 0 0 1.6em;
524 padding: 0;
525 }
526
527 .mw-content-rtl ul,
528 .mw-content-ltr .mw-content-rtl ul {
529 /* @noflip */
530 margin: 0.3em 1.6em 0 0;
531 padding: 0;
532 }
533
534 .mw-content-ltr ol,
535 .mw-content-rtl .mw-content-ltr ol {
536 /* @noflip */
537 margin: 0.3em 0 0 3.2em;
538 padding: 0;
539 }
540
541 .mw-content-rtl ol,
542 .mw-content-ltr .mw-content-rtl ol {
543 /* @noflip */
544 margin: 0.3em 3.2em 0 0;
545 padding: 0;
546 }
547
548 /* @noflip */
549 .mw-content-ltr dd,
550 .mw-content-rtl .mw-content-ltr dd {
551 margin-left: 1.6em;
552 margin-right: 0;
553 }
554
555 /* @noflip */
556 .mw-content-rtl dd,
557 .mw-content-ltr .mw-content-rtl dd {
558 margin-right: 1.6em;
559 margin-left: 0;
560 }
561
562 .mw-ajax-loader {
563 background-image: url( images/ajax-loader.gif );
564 background-position: center center;
565 background-repeat: no-repeat;
566 padding: 16px;
567 position: relative;
568 top: -16px;
569 }
570
571 .mw-small-spinner {
572 padding: 10px !important;
573 margin-right: 0.6em;
574 background-image: url( images/spinner.gif );
575 background-position: center center;
576 background-repeat: no-repeat;
577 }
578
579 /* Language specific height correction for titles. Ref T31405 and T32809 */
580 /* Languages like hi or ml require slightly more vertical space to show diacritics properly */
581 h1:lang( anp ),
582 h1:lang( as ),
583 h1:lang( bh ), /* Macrolanguage, used on bh.wikipedia.org, should be removed one day */
584 h1:lang( bho ),
585 h1:lang( bn ),
586 h1:lang( gu ),
587 h1:lang( hi ),
588 h1:lang( kn ),
589 h1:lang( ks ),
590 h1:lang( ml ),
591 h1:lang( mr ),
592 h1:lang( my ),
593 h1:lang( mai ),
594 h1:lang( ne ),
595 h1:lang( new ),
596 h1:lang( or ),
597 h1:lang( pa ),
598 h1:lang( pi ),
599 h1:lang( sa ),
600 h1:lang( ta ),
601 h1:lang( te ) {
602 line-height: 1.6em !important;
603 }
604
605 /* stylelint-disable selector-list-comma-newline-after */
606 h2:lang( anp ), h3:lang( anp ), h4:lang( anp ), h5:lang( anp ), h6:lang( anp ),
607 h2:lang( as ), h3:lang( as ), h4:lang( as ), h5:lang( as ), h6:lang( as ),
608 h2:lang( bho ), h3:lang( bho ), h4:lang( bho ), h5:lang( bho ), h6:lang( bho ),
609 h2:lang( bh ), h3:lang( bh ), h4:lang( bh ), h5:lang( bh ), h6:lang( bh ),
610 h2:lang( bn ), h3:lang( bn ), h4:lang( bn ), h5:lang( bn ), h6:lang( bn ),
611 h2:lang( gu ), h3:lang( gu ), h4:lang( gu ), h5:lang( gu ), h6:lang( gu ),
612 h2:lang( hi ), h3:lang( hi ), h4:lang( hi ), h5:lang( hi ), h6:lang( hi ),
613 h2:lang( kn ), h3:lang( kn ), h4:lang( kn ), h5:lang( kn ), h6:lang( kn ),
614 h2:lang( ks ), h3:lang( ks ), h4:lang( ks ), h5:lang( ks ), h6:lang( ks ),
615 h2:lang( ml ), h3:lang( ml ), h4:lang( ml ), h5:lang( ml ), h6:lang( ml ),
616 h2:lang( mr ), h3:lang( mr ), h4:lang( mr ), h5:lang( mr ), h6:lang( mr ),
617 h2:lang( my ), h3:lang( my ), h4:lang( my ), h5:lang( my ), h6:lang( my ),
618 h2:lang( mai ), h3:lang( mai ), h4:lang( mai ), h5:lang( mai ), h6:lang( mai ),
619 h2:lang( ne ), h3:lang( ne ), h4:lang( ne ), h5:lang( ne ), h6:lang( ne ),
620 h2:lang( new ), h3:lang( new ), h4:lang( new ), h5:lang( new ), h6:lang( new ),
621 h2:lang( or ), h3:lang( or ), h4:lang( or ), h5:lang( or ), h6:lang( or ),
622 h2:lang( pa ), h3:lang( pa ), h4:lang( pa ), h5:lang( pa ), h6:lang( pa ),
623 h2:lang( pi ), h3:lang( pi ), h4:lang( pi ), h5:lang( pi ), h6:lang( pi ),
624 h2:lang( sa ), h3:lang( sa ), h4:lang( sa ), h5:lang( sa ), h6:lang( sa ),
625 h2:lang( ta ), h3:lang( ta ), h4:lang( ta ), h5:lang( ta ), h6:lang( ta ),
626 h2:lang( te ), h3:lang( te ), h4:lang( te ), h5:lang( te ), h6:lang( te ) {
627 line-height: 1.2em;
628 }
629 /* stylelint-enable selector-list-comma-newline-after */
630
631 /* Localised ordered list numbering for some languages */
632 ol:lang( azb ) li,
633 ol:lang( bcc ) li,
634 ol:lang( bgn ) li,
635 ol:lang( bqi ) li,
636 ol:lang( fa ) li,
637 ol:lang( glk ) li,
638 ol:lang( kk-arab ) li,
639 ol:lang( lrc ) li,
640 ol:lang( luz ) li,
641 ol:lang( mzn ) li {
642 list-style-type: -moz-persian;
643 list-style-type: persian;
644 }
645
646 ol:lang( ckb ) li,
647 ol:lang( sdh ) li {
648 list-style-type: -moz-arabic-indic;
649 list-style-type: arabic-indic;
650 }
651
652 ol:lang( hi ) li,
653 ol:lang( mr ) li {
654 list-style-type: -moz-devanagari;
655 list-style-type: devanagari;
656 }
657
658 ol:lang( as ) li,
659 ol:lang( bn ) li {
660 list-style-type: -moz-bengali;
661 list-style-type: bengali;
662 }
663
664 ol:lang( or ) li {
665 list-style-type: -moz-oriya;
666 list-style-type: oriya;
667 }
668
669 #toc ul,
670 .toc ul {
671 margin: 0.3em 0;
672 }
673
674 /* Correct directionality when page dir is different from site/user dir */
675 /* @noflip */ .mw-content-ltr .toc ul,
676 .mw-content-ltr #toc ul,
677 .mw-content-rtl .mw-content-ltr .toc ul,
678 .mw-content-rtl .mw-content-ltr #toc ul {
679 text-align: left;
680 }
681
682 /* @noflip */ .mw-content-rtl .toc ul,
683 .mw-content-rtl #toc ul,
684 .mw-content-ltr .mw-content-rtl .toc ul,
685 .mw-content-ltr .mw-content-rtl #toc ul {
686 text-align: right;
687 }
688
689 /* @noflip */ .mw-content-ltr .toc ul ul,
690 .mw-content-ltr #toc ul ul,
691 .mw-content-rtl .mw-content-ltr .toc ul ul,
692 .mw-content-rtl .mw-content-ltr #toc ul ul {
693 margin: 0 0 0 2em;
694 }
695
696 /* @noflip */ .mw-content-rtl .toc ul ul,
697 .mw-content-rtl #toc ul ul,
698 .mw-content-ltr .mw-content-rtl .toc ul ul,
699 .mw-content-ltr .mw-content-rtl #toc ul ul {
700 margin: 0 2em 0 0;
701 }
702
703 #toc #toctitle,
704 .toc #toctitle,
705 #toc .toctitle,
706 .toc .toctitle {
707 direction: ltr;
708 }
709
710 #mw-clearyourcache,
711 #mw-sitecsspreview,
712 #mw-sitejspreview,
713 #mw-usercsspreview,
714 #mw-userjspreview {
715 direction: ltr;
716 unicode-bidi: embed;
717 }
718
719 #mw-revision-info,
720 #mw-revision-info-current,
721 #mw-revision-nav {
722 direction: ltr;
723 }
724
725 /* Images */
726
727 /* @noflip */ div.tright,
728 div.floatright,
729 table.floatright {
730 clear: right;
731 float: right;
732 }
733
734 /* @noflip */ div.tleft,
735 div.floatleft,
736 table.floatleft {
737 float: left;
738 clear: left;
739 }
740
741 div.floatright,
742 table.floatright,
743 div.floatleft,
744 table.floatleft {
745 position: relative;
746 }
747
748 /* T14205 */
749 #mw-credits a {
750 unicode-bidi: embed;
751 }
752
753 /* Accessibility */
754 .mw-jump,
755 #jump-to-nav {
756 overflow: hidden;
757 height: 0;
758 zoom: 1; /* http://webaim.org/techniques/skipnav/#iequirk */
759 }
760
761 /* Print footer should be hidden by default in screen. */
762 .printfooter {
763 display: none;
764 }
765
766 /* For developers */
767 .xdebug-error {
768 position: absolute;
769 z-index: 99;
770 }
771
772 .mw-editsection,
773 #jump-to-nav {
774 -moz-user-select: none;
775 -webkit-user-select: none;
776 -ms-user-select: none;
777 user-select: none;
778 }
779
780 /* Display editsection links smaller and next to headings */
781 .mw-editsection,
782 .mw-editsection-like {
783 font-size: small;
784 font-weight: normal;
785 margin-left: 1em;
786 vertical-align: baseline;
787 /* Reset line-height; headings tend to have it set to larger values */
788 line-height: 1em;
789 /* As .mw-editsection is a <span> (inline element), it is treated as part */
790 /* of the heading content when selecting text by multiple clicks and thus */
791 /* selected together with heading content, despite the user-select: none; */
792 /* rule set above. This enforces non-selection without changing the look. */
793 display: inline-block;
794 }
795
796 /* Correct directionality when page dir is different from site/user dir */
797 /* @noflip */
798 .mw-content-ltr .mw-editsection,
799 .mw-content-rtl .mw-content-ltr .mw-editsection {
800 margin-left: 1em;
801 }
802
803 /* @noflip */
804 .mw-content-rtl .mw-editsection,
805 .mw-content-ltr .mw-content-rtl .mw-editsection {
806 margin-right: 1em;
807 }
808
809 /* Prevent citations and subscripts from interfering with the line-height */
810 sup,
811 sub {
812 line-height: 1;
813 }