|
|
| Line 221: |
Line 221: |
| body:not(.ns-0):not(.ns-2):not(.ns-100) .gallerybox .thumb img { | | body:not(.ns-0):not(.ns-2):not(.ns-100) .gallerybox .thumb img { |
| background: #fff url(//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png) repeat; | | background: #fff url(//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png) repeat; |
| | } |
| | |
| | /* Display "From Wikipedia, the free encyclopedia" in skins that support it, |
| | do not apply to print mode */ |
| | #siteSub { |
| | display: block; |
| } | | } |
| | | |
| Line 410: |
Line 416: |
| * comment above. | | * comment above. |
| */ | | */ |
|
| |
|
| |
| /* Reset user agent styles. We don't reset small or blockquote here deliberately */
| |
| cite,
| |
| dfn {
| |
| font-style: inherit;
| |
| }
| |
|
| |
| q {
| |
| quotes: '"' '"' "'" "'";
| |
| }
| |
|
| |
| /* Hide stuff meant for accounts with special permissions. Made visible again in
| |
| [[MediaWiki:Group-sysop.css]] and so on for other groups. */
| |
| .checkuser-show,
| |
| .sysop-show,
| |
| .user-show,
| |
| .templateeditor-show,
| |
| .extendedmover-show,
| |
| .patroller-show,
| |
| .extendedconfirmed-show,
| |
| .autoconfirmed-show {
| |
| display: none;
| |
| }
| |
|
| |
| /* Prevent flags in tables from collapsing
| |
| Fix for [[phab:T116318]]
| |
| */
| |
| .flagicon img {
| |
| min-width: 23px;
| |
| }
| |
|
| |
| /* Prevent unnecessary margin at the bottom of centralnotices */
| |
| .cnotice {
| |
| margin-bottom: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * BELOW HERE THERE BE SOONTOBE TEMPLATESTYLES THINGS;
| |
| * SEE [[MediaWiki talk:Common.css/to do]]
| |
| */
| |
| .mw-parser-output .infobox-header,
| |
| .mw-parser-output .infobox-subheader,
| |
| .mw-parser-output .infobox-above,
| |
| .mw-parser-output .infobox-title,
| |
| .mw-parser-output .infobox-image,
| |
| .mw-parser-output .infobox-full-data,
| |
| .mw-parser-output .infobox-below {
| |
| text-align: center;
| |
| }
| |
|
| |
| /* Prevent line breaks in silly places:
| |
| 1) Where desired
| |
| 2) Links when we don't want them to
| |
| */
| |
| .mw-parser-output .nowrap,
| |
| .nowraplinks a {
| |
| white-space: nowrap;
| |
| }
| |
| .mw-parser-output .infobox .nowrap {
| |
| white-space: normal !important;
| |
| }
| |
| /* But allow wrapping where desired: */
| |
| .wrap,
| |
| .wraplinks a {
| |
| white-space: normal;
| |
| }
| |
|
| |
| /* Generic class texhtml class for inline math */
| |
| span.texhtml {
| |
| font-family: serif;
| |
| white-space: nowrap;
| |
| }
| |
|
| |
| /* Normal font styling for wikitable row headers with scope="row" tag */
| |
| .wikitable.plainrowheaders th[scope=row],
| |
| .wikitable.plainrowheaders th[scope=rowgroup] {
| |
| font-weight: normal;
| |
| /* @noflip */
| |
| text-align: left;
| |
| }
| |
|
| |
| /********* General fixes for night mode - please sync any changes here with [[MediaWiki:Vector.css]] *********/
| |
|
| |
| @media screen {
| |
| html.skin-theme-clientpref-night .navbox a:not(.new):not(.mw-selflink):link,
| |
| html.skin-theme-clientpref-night .infobox a:not(.new):not(.mw-selflink):link {
| |
| color: var( --color-progressive ) !important;
| |
| }
| |
| /* T370074 */
| |
| html.skin-theme-clientpref-night .mw-parser-output section > figure img,
| |
| html.skin-theme-clientpref-night .mw-parser-output section > div > figure img,
| |
| html.skin-theme-clientpref-night .mw-parser-output > figure img {
| |
| background: var( --background-color-disabled-fixed, #C8CCD1 );
| |
| }
| |
| }
| |
|
| |
| @media screen and (prefers-color-scheme: dark) {
| |
| html.skin-theme-clientpref-os .navbox a:not(.new):not(.mw-selflink):link,
| |
| html.skin-theme-clientpref-os .infobox a:not(.new):not(.mw-selflink):link {
| |
| color: var( --color-progressive ) !important;
| |
| }
| |
| /* T370074 */
| |
| html.skin-theme-clientpref-os .mw-parser-output section > figure img,
| |
| html.skin-theme-clientpref-os .mw-parser-output section > div > figure img,
| |
| html.skin-theme-clientpref-os .mw-parser-output > figure img {
| |
| background: var( --background-color-disabled-fixed, #C8CCD1 );
| |
| }
| |
| }
| |
|
| |
| /* [[phab:T201233]] */
| |
| @media ( max-width: 719px /* @max-width-breakpoint-tablet */) {
| |
| span.mwe-math-element-block,
| |
| dd .mwe-math-element-inline {
| |
| overflow-x: scroll;
| |
| display: inline-block;
| |
| vertical-align: middle;
| |
| width: 100%;
| |
| }
| |
| }
| |
|
| |
| /**
| |
| * Ambox classes are nested in a top-level class
| |
| * This class is appended to the DOM via JS
| |
| * THESE RULES ONLY APPLY TO MINERVA skin.
| |
| **/
| |
| 8px: 8px;
| |
| 32px: 8px * 4;
| |
| 1.65: 1.65;
| |
|
| |
| /* Be more specific than .content table styles in Minerva */
| |
| display: block;
| |
| margin: 0;
| |
| }
| |
|
| |
| cursor: pointer;
| |
| width: auto;
| |
| // !important needed to override core ambox styles
| |
| background: #f8f9fa !important;
| |
| color: #6c757d;
| |
| margin-bottom: 1px;
| |
|
| |
| tbody {
| |
| display: table;
| |
| width: 100%;
| |
| }
| |
|
| |
| // Assuming that most ambox templates wrap content in this element.
| |
| // See https://en.wikipedia.org/w/index.php?title=Module:Message_box&action=raw (search for 'mbox-text-span').
| |
| // https://phabricator.wikimedia.org/T206887 suggests .mbox-text-div is also needed.
| |
| .mbox-text-div,
| |
| .mbox-text-span {
| |
| display: block;
| |
| max-height: 1.65 * 2em;
| |
| // All will have this height (approx 2 lines) even if a single line e.g. {{dictdef}} when on mobile.
| |
| // Overriden later in tablet styles.
| |
| height: 1.65 * 2em;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| // Wrestle with inline styles that editors may place on elements inside the ambox
| |
| div {
| |
| // e.g. on mw-collapsible inside Multiple issues template
| |
| margin: 0 !important;
| |
| // e.g. on Template:Expand Russian
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| td,
| |
| div.mbox-text {
| |
| position: relative;
| |
| // Override !important above if this is a div
| |
| padding: 8px 8px 8px 32px !important;
| |
|
| |
| > div,
| |
| > span {
| |
| font-size: unit( ( 13 / 16 ), rem );
| |
| }
| |
| }
| |
|
| |
| // All text should be treated the same
| |
| b {
| |
| font-weight: inherit;
| |
| }
| |
|
| |
| // Hide links in new treatment
| |
| a {
| |
| color: inherit !important;
| |
| -webkit-tap-highlight-color: rgba( 0, 0, 0, 0 ) !important;
| |
|
| |
| &:hover,
| |
| &:focus {
| |
| text-decoration: none;
| |
| outline: inherit;
| |
| }
| |
| }
| |
|
| |
| small,
| |
| .hide-when-compact,
| |
| /* Template:Expand Russian */
| |
| .mw-collapsible-content,
| |
| /* Remove empty leftmost column when present (.mbox-empty-cell)
| |
| * and .verbose and any hr tags that might be present in the ambox
| |
| * See https://en.wikipedia.org/w/index.php?
| |
| * title=Special:WhatLinksHere/Template:Proposed_deletion_notify
| |
| * (https://phabricator.wikimedia.org/T197265) */
| |
| .mbox-empty-cell,
| |
| hr,
| |
| .verbose,
| |
| /* Nested amboxes (multiple issues) */
| |
| table,
| |
| .mbox-image {
| |
| display: none;
| |
| }
| |
|
| |
| .minerva-ambox-icon {
| |
| position: absolute;
| |
| left: 8px;
| |
| top: 11px;
| |
| }
| |
|
| |
| .ambox-learn-more {
| |
| color: #36c;
| |
| position: absolute;
| |
| right: 8px;
| |
| bottom: 8px;
| |
| z-index: 1;
| |
| line-height: 1.65; // sets height for fade & aligns "learn more" to ambox text.
| |
|
| |
| /* creates a fade under the "learn more" button to avoid overlapping text. */
| |
| &::before {
| |
| content: '';
| |
| position: absolute;
| |
| z-index: 0;
| |
| bottom: 0;
| |
| right: 0;
| |
| width: 100%; // width & height defined by length of "learn more".
| |
| height: 100%;
| |
| box-sizing: content-box; // explicitly setting box-sizing so padding extends beyond 100%.
| |
| padding-left: 4em;
| |
| background: linear-gradient( to right, transparent 0, #f8f9fa 3em );
| |
| }
| |
| }
| |
|
| |
| @media screen and ( min-width: 720px ) {
| |
| .mbox-text-div,
| |
| .mbox-text-span {
| |
| height: auto;
| |
| margin-bottom: 8px * 3 !important; // important offsets `.ambox div { margin:0!important}` which offsets inline styles.
| |
| }
| |
|
| |
| .ambox-learn-more {
| |
| left: 32px;
| |
| right: 0;
| |
| background: none;
| |
|
| |
| // Move blur to far right last line
| |
| // https://phabricator.wikimedia.org/T197931#4475197
| |
| &::before {
| |
| top: unit( -1.65, em );
| |
| width: 10px;
| |
| }
| |
| }
| |
| }
| |
| }
| |
|
| |
| // or limited to the Minerva skin via a skinStyle.
| |
| .hatnote,
| |
| .dablink,
| |
| .rellink {
| |
| padding: 5px 7px;
| |
| color: #6c757d;
| |
| font-size: unit( ( 13 / 16 ), rem );
| |
| background-color: #f8f9fa;
| |
| margin-bottom: 1px;
| |
| overflow: hidden;
| |
|
| |
| a {
| |
| color: #36c;
| |
| }
| |
| }
| |
| }
| |
|
| |
| // and/or appropriate bits limited to the Minerva skin via a skinStyle.
| |
| .infobox {
| |
| // Unfloat tables and infoboxes:;
| |
| // A lot of templates introduce floating and horizontal margins inline styles
| |
| float: none !important;
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
| font-size: 90%;
| |
| position: relative;
| |
| border: 1px solid #a2a9b1;
| |
| margin-bottom: 2em;
| |
| color: #202122;
| |
| background-color: #f8f9fa;
| |
| display: flex;
| |
| flex: 1 1 100%;
| |
| flex-flow: column nowrap;
| |
| width: 100% !important;
| |
| max-width: 100% !important;
| |
| text-align: start;
| |
|
| |
| caption {
| |
| padding: 10px 10px 0;
| |
| text-align: center;
| |
| }
| |
|
| |
| th,
| |
| td {
| |
| vertical-align: top;
| |
| border: 0;
| |
| border-bottom: 1px solid #a2a9b1;
| |
| padding: 7px 10px;
| |
| }
| |
|
| |
| tbody > tr > td,
| |
| tbody > tr > th {
| |
| flex: 1 0;
| |
| }
| |
|
| |
| td:only-child,
| |
| th:only-child {
| |
| width: 100%;
| |
| }
| |
|
| |
| tr:last-child th,
| |
| tr:last-child td {
| |
| border: 0;
| |
| }
| |
|
| |
| & > tbody,
| |
| & > caption {
| |
| display: flex;
| |
| flex-flow: column nowrap;
| |
| }
| |
|
| |
| & > tbody > tr {
| |
| min-width: 100%;
| |
| display: flex;
| |
| flex-flow: row nowrap;
| |
| }
| |
| }
| |
| }
| |
|
| |
| /* Tablet specific styling */
| |
| @media all and ( min-width: 720px ) {
| |
| // Float infoboxes to the right of the page
| |
| .infobox {
| |
| margin: 0.5em 0 1em 35px !important;
| |
| // Note this is fixed to ensure that we leave enough space for the sections to the infoboxes left
| |
| // FIXME [Templates]: Inline styles force us to use !important
| |
| max-width: 320px !important;
| |
| width: auto !important;
| |
| float: right !important;
| |
| clear: right !important;
| |
| }
| |
| }
| |
| }
| |
|
| |
| /** This mixin should only be used where it's safe to do so. It should not be applied
| |
| to content which may have important information. */
| |
| background: inherit !important;
| |
| color: inherit !important;
| |
| /* If a border is defined retain it but make it black. If no border this won't do anything. */
| |
| border-color: #a2a9b1 !important;
| |
| }
| |
|
| |
| @media screen {
| |
| .skin-theme-clientpref-night .page-Main_Page {
| |
| .mw-parser-output :not( .notheme ):not( a ) {
| |
| }
| |
| }
| |
| }
| |
|
| |
| @media screen and ( prefers-color-scheme: dark ) {
| |
| .skin-theme-clientpref-os .page-Main_Page {
| |
| .mw-parser-output :not( .notheme ):not( a ) {
| |
| }
| |
| }
| |
| }
| |
|
| |
| @media screen {
| |
| .skin-theme-clientpref-night .ns-100 {
| |
| .mw-parser-output :not( .notheme ):not( a ) {
| |
| }
| |
| }
| |
| }
| |
|
| |
| @media screen and ( prefers-color-scheme: dark ) {
| |
| .skin-theme-clientpref-os .ns-100 {
| |
| .mw-parser-output :not( .notheme ):not( a ) {
| |
| }
| |
| }
| |
| }
| |
|
| |
| /* TODO: Check matches https://github.com/wikimedia/mediawiki-skins-MinervaNeue/blob/master/resources/skins.minerva.base.styles/content/hacks.less#L188 onwards
| |
| before merging. */
| |
|
| |
| /* T358385 */
| |
| [ bgcolor ] {
| |
| // Important: this should correspond with the light mode theme version of color-base
| |
| color: #333;
| |
| }
| |
|
| |
| @selector-inline-style-color: ~'[style*="background"]:not( [style*="transparent"] ):not( [style*="inherit"] )';
| |
|
| |
| /* Limited to article namespace. This should not be added to namespaces which reset colors e.g. Portal (100) */
| |
| body.ns-0:not( .page-Main_Page ) .mw-parser-output table:not( .infobox ):not( .navbox-inner ):not( .navbox ) {
| |
| [bgcolor],
| |
| &[style*="background"]:not([style*="transparent"]):not([style*="inherit"]),
| |
| th@{selector-inline-style-color},
| |
| td@{selector-inline-style-color},
| |
| tr@{selector-inline-style-color} td {
| |
| a:not( .mw-selflink ) {
| |
| color: var( --color-base-fixed, #202122 );
| |
| text-decoration: underline;
| |
| }
| |
|
| |
| // For red links use a wavy underline, to distinguish them from standard links.
| |
| a.new {
| |
| text-decoration-style: wavy;
| |
| }
| |
| }
| |
| }
| |
| }
| |
|
| |
| @media screen {
| |
| html.skin-theme-clientpref-night {
| |
| // These colors become !important in night mode to avoid color contrast issues.
| |
| .hatnote:not( .notheme ),
| |
| .dablink:not( .notheme ),
| |
| .rellink:not( .notheme ),
| |
| .infobox:not( .notheme ) {
| |
| color: #202122 !important;
| |
| background-color: #f8f9fa !important;
| |
| }
| |
|
| |
| /* T357453 - attempt to strip colors from the majority of infoboxes in night mode (unless notheme specified) */
| |
| // please forgive me for bypassing the linter there is no easy way to keep all of the infobox classes grouped without
| |
| .infobox td,
| |
| .infobox th,
| |
| .infobox-above,
| |
| /* T359644 */
| |
| .infobox p,
| |
| .infobox > div,
| |
| .infobox caption,
| |
| /* frwiki T359644 */
| |
| .infobox--frwiki td,
| |
| .infobox--frwiki th,
| |
| .infobox--frwiki p,
| |
| .infobox--frwiki > div,
| |
| .infobox--frwiki caption,
| |
| /* itwiki */
| |
| .sinottico th,
| |
| .infobox-header,
| |
| /* T358164 General case that templates/extensions can opt into */
| |
| .skin-nightmode-reset-color,
| |
| .navigation-box,
| |
| .metadata,
| |
| /* T357735 */
| |
| .quotebox,
| |
| /* T357726 */
| |
| .side-box,
| |
| .side-box div,
| |
| /* T358012 */
| |
| .navbox,
| |
| .navbox-subgroup,
| |
| .navbox-group,
| |
| .navbox-even,
| |
| .navbox-abovebelow,
| |
| .navbox-title {
| |
| &:not( .notheme ) {
| |
| }
| |
| }
| |
|
| |
| // T358797 - if a background color is specified, assume they wanted the day mode font color
| |
| .mw-parser-output [ style*='background' ] {
| |
| /* #202122 */
| |
| color: #202122; // not !important so that if a color is also specified it will take priority
| |
| }
| |
|
| |
| }
| |
| }
| |
|
| |
| @media screen and ( prefers-color-scheme: dark ) {
| |
| html.skin-theme-clientpref-os {
| |
| /* T357453 */
| |
| .infobox td,
| |
| .infobox th,
| |
| .infobox-above,
| |
| /* T359644 */
| |
| .infobox p,
| |
| .infobox > div,
| |
| .infobox caption,
| |
| /* frwiki T359644 */
| |
| .infobox--frwiki td,
| |
| .infobox--frwiki th,
| |
| .infobox--frwiki p,
| |
| .infobox--frwiki > div,
| |
| .infobox--frwiki caption,
| |
| /* itwiki */
| |
| .sinottico th,
| |
| .infobox-header,
| |
| /* T358164 General case that templates/extensions can opt into */
| |
| .skin-nightmode-reset-color,
| |
| .navigation-box,
| |
| .metadata,
| |
| /* T357735 */
| |
| .quotebox,
| |
| /* T357726 */
| |
| .side-box,
| |
| .side-box div,
| |
| /* T358012 */
| |
| .navbox,
| |
| .navbox-subgroup,
| |
| .navbox-group,
| |
| .navbox-even,
| |
| .navbox-abovebelow,
| |
| .navbox-title {
| |
| &:not( .notheme ) {
| |
| }
| |
| }
| |
|
| |
| // These colors become !important in night mode to avoid color contrast issues.
| |
| .hatnote:not( .notheme ),
| |
| .dablink:not( .notheme ),
| |
| .rellink:not( .notheme ),
| |
| .infobox:not( .notheme ) {
| |
| color: #202122 !important;
| |
| background-color: #f8f9fa !important;
| |
| }
| |
|
| |
| // T358797 - if a background color is specified, assume they wanted the day mode font color
| |
| .mw-parser-output [ style*='background' ] {
| |
| /* #202122 */
| |
| color: #202122; // not !important so that if a color is also specified it will take priority
| |
| }
| |
|
| |
| }
| |
| }
| |