Merge "Align "What's this" vertically"
[lhc/web/wiklou.git] / resources / src / mediawiki.legacy / commonPrint.css
index b4418e5..8ff0634 100644 (file)
@@ -8,19 +8,26 @@
 
 /**
  * Hide all the elements irrelevant for printing
+ * Skins however can and should override.
  */
+/* General hide-in-print class, please only use sparely */
 .noprint,
-#jump-to-nav,
+/* Various content classes, in alphabetical order */
+.catlinks,
+.magnify,
+.mw-cite-backlink,
 .mw-jump,
-#column-one,
 .mw-editsection,
 .mw-editsection-like,
-#footer-places,
 .mw-hidden-catlinks,
-.usermessage,
+.mw-indicators,
+.mw-redirectedfrom,
 .patrollink,
-.ns-0 .mw-redirectedfrom,
-.magnify,
+.usermessage,
+/* Various content ids, in alphabetical order */
+#column-one,
+#footer-places,
+#jump-to-nav,
 #mw-navigation,
 #siteNotice,
 /* Deprecated, changed in core */
@@ -43,6 +50,42 @@ body {
        padding: 0;
 }
 
+/* Links */
+a {
+       background: none !important; /* stylelint-disable-line declaration-no-important */
+       padding: 0 !important; /* stylelint-disable-line declaration-no-important */
+}
+
+a,
+a.external,
+a.new,
+a.stub {
+       /* IE 6 & 7 don't understand `inherit` */
+       color: #000 !important; /* stylelint-disable-line declaration-no-important */
+       text-decoration: none !important; /* stylelint-disable-line declaration-no-important */
+       /* Modern browser will apply this, IE 6 & 7 ignore the unknown */
+       color: inherit !important; /* stylelint-disable-line declaration-block-no-duplicate-properties, declaration-no-important */
+       text-decoration: inherit !important; /* stylelint-disable-line declaration-block-no-duplicate-properties, declaration-no-important */
+}
+
+/* Expand URLs for printing */
+.mw-body-content a.external.text:after,
+.mw-body-content a.external.autonumber:after {
+       content: ' (' attr( href ) ')';
+       word-break: break-all;
+       word-wrap: break-word;
+}
+
+/* Expand protocol-relative URLs for printing */
+.mw-body-content a.external.text[href^='//']:after,
+.mw-body-content a.external.autonumber[href^='//']:after {
+       content: ' (https:' attr( href ) ')';
+}
+
+dt {
+       font-weight: bold;
+}
+
 h1,
 h2,
 h3,
@@ -52,24 +95,30 @@ h6 {
        font-weight: bold;
        /* Pagination */
        page-break-after: avoid;
-}
-
-dt {
-       font-weight: bold;
-}
-
-ul {
-       list-style-type: square;
+       page-break-before: avoid;
 }
 
 p {
        margin: 1em 0;
-       line-height: 1.2em;
+       line-height: 1.2;
        /* Pagination */
        orphans: 3;
        widows: 3;
 }
 
+img,
+figure,
+.wikitable,
+.thumb {
+       /* Pagination */
+       page-break-inside: avoid;
+}
+
+img {
+       border: 0;
+       vertical-align: middle;
+}
+
 pre,
 .mw-code {
        background: #fff;
@@ -82,17 +131,14 @@ pre,
        overflow: auto;
 }
 
-img,
-figure,
-.wikitable,
-.thumb {
-       /* Pagination */
-       page-break-inside: avoid;
+/* Prevent citations and subscripts from interfering with the line-height */
+sup,
+sub {
+       line-height: 1;
 }
 
-img {
-       border: 0;
-       vertical-align: middle;
+ul {
+       list-style-type: square;
 }
 
 /**
@@ -129,13 +175,13 @@ img {
        display: table;
 }
 
-/* Separate columns for tocnumber and toctext */
+/* Separate columns for `.tocnumber` and `.toctext` */
 .tocnumber,
 .toctext {
        display: table-cell;
 }
 
-/* Space between the columns for tocnumber and toctext */
+/* Space between those columns */
 .tocnumber {
        padding-left: 0;
        padding-right: 0.5em;
@@ -153,72 +199,53 @@ img {
        padding-right: 0;
 }
 
-#footer {
-       background: #fff;
-       color: #000;
-       margin-top: 1em;
-       border-top: 1pt solid #aaa;
-       direction: ltr;
-}
-
 /**
- * Links
+ * Floating divs (and thumbnails)
  */
-a {
-       background: none !important; /* stylelint-disable-line declaration-no-important */
-       padding: 0 !important; /* stylelint-disable-line declaration-no-important */
+/* @noflip */
+table.floatright,
+div.floatright,
+div.tright {
+       float: right;
+       clear: right;
+       position: relative;
 }
 
-/* Expand URLs for printing */
-.mw-body-content a.external.text:after,
-.mw-body-content a.external.autonumber:after {
-       content: ' (' attr( href ) ')';
-       word-break: break-all;
-       word-wrap: break-word;
+/* @noflip */
+table.floatleft,
+div.floatleft,
+div.tleft {
+       float: left;
+       clear: left;
+       position: relative;
 }
 
-/* Expand protocol-relative URLs for printing */
-.mw-body-content a.external.text[href^='//']:after,
-.mw-body-content a.external.autonumber[href^='//']:after {
-       content: ' (https:' attr( href ) ')';
+/* @noflip */
+div.tleft {
+       margin: 0.5em 1.4em 1.3em 0;
 }
 
-a,
-a.external,
-a.new,
-a.stub {
-       /* IE 6 & 7 don't understand `inherit` */
-       color: #000 !important; /* stylelint-disable-line declaration-no-important */
-       text-decoration: none !important; /* stylelint-disable-line declaration-no-important */
-       /* Modern browser will apply this, IE 6 & 7 ignore the unknown */
-       color: inherit !important; /* stylelint-disable-line declaration-block-no-duplicate-properties, declaration-no-important */
-       text-decoration: inherit !important; /* stylelint-disable-line declaration-block-no-duplicate-properties, declaration-no-important */
+/* @noflip */
+div.tright {
+       margin: 0.5em 0 1.3em 1.4em;
 }
 
-/**
- * Floating divs
- */
 /* @noflip */
+table.floatright,
 div.floatright {
-       float: right;
-       clear: right;
-       position: relative;
-       margin: 0.5em 0 0.8em 1.4em;
-}
-
-div.floatright p {
-       font-style: italic;
+       margin: 0 0 0.5em 0.5em;
+       border: 0;
 }
 
 /* @noflip */
+table.floatleft,
 div.floatleft {
-       float: left;
-       clear: left;
-       position: relative;
-       margin: 0.5em 1.4em 0.8em 0;
+       margin: 0 0.5em 0.5em 0;
+       border: 0;
 }
 
-div.floatleft p {
+div.floatleft p,
+div.floatright p {
        font-style: italic;
 }
 
@@ -231,47 +258,31 @@ div.floatleft p {
  */
 div.thumb {
        background-color: transparent;
-       border: 0;
        width: auto;
-       margin-top: 0.5em;
-       margin-bottom: 0.8em;
+}
+
+div.thumb a {
+       border-bottom: 0;
 }
 
 div.thumbinner {
        background-color: #fff;
-       border: 1pt solid #ccc;
-       padding: 3px;
-       font-size: 94%;
+       border: 0;
+       border-radius: 2px;
+       padding: 5px;
+       font-size: 10pt;
+       color: #666;
        text-align: center;
        /* new block formatting context,
         * to clear background from floating content  */
        overflow: hidden;
-}
-
-html .thumbimage {
-       border: 1pt solid #ccc;
+       min-width: 100px;
 }
 
 html .thumbcaption {
-       border: 0;
        text-align: left;
-       line-height: 1.4em;
+       line-height: 1.4;
        padding: 3px;
-       font-size: 94%;
-}
-
-/* @noflip */
-div.tright {
-       float: right;
-       clear: right;
-       margin: 0.5em 0 0.8em 1.4em;
-}
-
-/* @noflip */
-div.tleft {
-       float: left;
-       clear: left;
-       margin: 0.5em 1.4em 0.8em 0;
 }
 
 img.thumbborder {
@@ -280,14 +291,21 @@ img.thumbborder {
 
 /**
  * Table rendering
- * As on shared.css but with white background.
  */
+/* Compare `table.wikitable` in shared.css */
 table.wikitable,
-table.mw_metadata {
+.mw_metadata {
        background: #fff;
        margin: 1em 0;
        border: 1pt solid #aaa;
        border-collapse: collapse;
+       font-size: 10pt;
+}
+
+table.wikitable > caption,
+.mw_metadata caption {
+       padding: 5px;
+       font-size: 10pt;
 }
 
 table.wikitable > tr > th,
@@ -296,23 +314,20 @@ table.wikitable > * > tr > th,
 table.wikitable > * > tr > td,
 .mw_metadata th,
 .mw_metadata td {
+       /* Important is required to override any inline styles provided by editors */
+       background: #fff !important; /* stylelint-disable-line declaration-no-important */
+       /* We need to also set color in case editors applied a light text color */
+       color: #000 !important; /* stylelint-disable-line declaration-no-important */
        border: 1pt solid #aaa;
-       padding: 0.2em;
+       padding: 0.4em 0.6em;
 }
 
 table.wikitable > tr > th,
 table.wikitable > * > tr > th,
 .mw_metadata th {
-       background: #fff;
-       font-weight: bold;
        text-align: center;
 }
 
-table.wikitable > caption,
-.mw_metadata caption {
-       font-weight: bold;
-}
-
 table.listing,
 table.listing td {
        border: 1pt solid #000;
@@ -330,17 +345,29 @@ table.listing td {
 
 .catlinks li {
        display: inline-block;
-       line-height: 1.15em;
-       padding: 0 0.4em;
-       border-left: 1pt solid #aaa;
+       line-height: 1.15;
        margin: 0.1em 0;
+       border-left: 1pt solid #aaa;
+       padding: 0 0.4em;
 }
 
 .catlinks li:first-child {
-       padding-left: 0.2em;
        border-left: 0;
+       padding-left: 0.2em;
 }
 
+/**
+ * Footer
+ */
 .printfooter {
        padding: 1em 0;
 }
+
+#footer {
+       background: #fff;
+       color: #000;
+       margin-top: 1em;
+       border-top: 1pt solid #aaa;
+       padding-top: 5px;
+       direction: ltr;
+}