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