MediaWiki:Common.css: Difference between revisions
Blanked the page Tag: Blanking |
No edit summary |
||
| Line 1: | Line 1: | ||
body { | |||
border-bottom-color: rgb(0, 203, 159); | |||
background-image: url("https://www.mediawiki.org/w/skins/Timeless/resources/images/cat.svg?558fd"); | |||
background-repeat: no-repeat; | |||
background-position: center 10em; | |||
} | |||
/* Make the font size a touch bigger on vector elements*/ | |||
.vector-pinnable-element, | |||
.vector-page-toolbar-container, | |||
.vector-user-links-main .vector-menu-content-list, | |||
.vector-search-box{ | |||
font-size:1rem; | |||
} | |||
/* disable the Dark Mode invert */ | |||
/* | |||
.client-darkmode, | |||
.client-darkmode img, | |||
.client-darkmode video, | |||
.client-darkmode svg, | |||
.client-darkmode iframe, | |||
.client-darkmode .mw-no-invert, | |||
.client-darkmode .mw-mmv-overlay, | |||
.client-darkmode .mw-mmv-pre-image, | |||
.client-darkmode .mw-kartographer-map, | |||
.client-darkmode .mw-kartographer-mapDialog-map, | |||
.client-darkmode:not(.mw-invert), | |||
.client-darkmode img:not(.mw-invert), | |||
.client-darkmode video:not(.mw-invert), | |||
.client-darkmode svg:not(.mw-invert), | |||
.client-darkmode iframe:not(.mw-invert), | |||
.client-darkmode .mw-no-invert:not(.mw-invert), | |||
.client-darkmode .cdx-no-invert:not(.mw-invert), | |||
.client-darkmode td .diffchange:not(.mw-invert), | |||
.client-darkmode .skin-minerva .mw-notification-visible .mw-notification-content:not(.mw-invert) | |||
{ | |||
filter: none; | |||
-webkit-filter: none; | |||
} | |||
*/ | |||
@media screen and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .skin-invert-image img, | |||
html.skin-theme-clientpref-os .oo-ui-iconElement-icon:not(.oo-ui-image-progressive):not(.oo-ui-image-destructive):not(.oo-ui-checkboxInputWidget-checkIcon):not(.oo-ui-image-invert):not(.mw-no-invert), | |||
html.skin-theme-clientpref-os .oo-ui-indicatorElement-indicator { | |||
color-scheme: light; | |||
filter: invert(1) hue-rotate(180deg); | |||
} | |||
html.skin-theme-clientpref-os .skin-invert { | |||
filter: none !important; | |||
} | |||
} | |||
/* CSS placed here will be applied to all skins */ | |||
/*Set font to be more legible.*/ | |||
body { | |||
font-family:"Gill Sans Nova",Ubuntu,Calibri,"DejaVu Sans",source-sans-pro,Helvetica,sans-serif; | |||
font-size:1.2rem; | |||
} | |||
th | |||
/*see more collapsible in incomplete template*/ | |||
@media (hover: hover) { | |||
#learn-more-toggle:hover { | |||
text-decoration: underline;co | |||
} | |||
} | |||
/*css hackjob to fix chrome putting subsections vertically next to infobox on mobile size*/ | |||
.mw-parser-output :is(h1,h2,h3,h4,h5,h6) { | |||
min-width: 1em; | |||
} | |||
/** CSS trick to fix page name**/ | |||
.mw-logo-container::before { | |||
font-weight: bold; | |||
content: "Consumer Rights Wiki"; | |||
} | |||
.mw-logo-wordmark{ | |||
display: none; | |||
} | |||
/** Hide extra footer notices **/ | |||
li#footer-info-license-notice, | |||
li#footer-info-privacy-notice{ | |||
display: none; | |||
} | |||
/** Category Page **/ | |||
.cat-but-grid{ | |||
} | |||
.cat-but-grid a{ | |||
text-decoration: none; | |||
} | |||
.cat-but{ | |||
} | |||
.cat-but:active{ | |||
border-color: var( --color-base--active, #404244 ) !important; | |||
} | |||
@media screen { | |||
html.skin-theme-clientpref-night .cat-but:active{ | |||
border: 2px solid var( --color-base--hover, #404244 ) !important; | |||
} | |||
} | |||
@media screen and (prefers-color-scheme: dark) { | |||
/* automatic mode */ | |||
html.skin-theme-clientpref-os .cat-but:active { | |||
border: 2px solid var( --color-base--hover, #404244 ) !important; | |||
} | |||
} | |||
@media (hover: hover) { | |||
.cat-but:hover{ | |||
border-color: var( --color-base--hover, #404244 ) !important; | |||
transform: scale(1.03); | |||
} | |||
html.skin-theme-clientpref-night .cat-but:hover{ | |||
border: 2px solid var( --color-base--hover, #404244 ) !important; | |||
} | |||
} | |||
@media (hover: hover) and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .cat-but:hover{ | |||
border: 2px solid var( --color-base--hover, #404244 ) !important; | |||
} | |||
} | |||
/** -------------------------------- **/ | |||
/** Extensions **/ | |||
/* Cargo */ | |||
/* Table - dark mode */ | |||
table.cargoTable.noMerge tr:nth-child(2n+1) { | |||
background: var(--background-color-base, #fff); | |||
} | |||
table.cargoTable.noMerge tr:nth-child(2n) { | |||
background: var(--background-color-base, #fff); | |||
} | |||
/* Page Forms */ | |||
/* Input Type - tokens */ | |||
.select2-container--default .select2-selection--multiple { | |||
background-color: var(--background-color-base, #fff); | |||
border: 1px solid var(--border-color-base, #a2a9b1); | |||
transition-property: border-color; | |||
transition-duration: 250ms; | |||
} | |||
.select2-container--default .select2-selection--multiple:hover { | |||
border-color: var(--border-color-interactive, #72777d); | |||
} | |||
.select2-container--default.select2-container--focus .select2-selection--multiple { | |||
border-color: var(--border-color-progressive--focus, #36c); | |||
border-width: 2px; | |||
box-shadow: inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c); | |||
} | |||
.select2-dropdown { | |||
background-color: var(--background-color-base, #fff); | |||
border: 1px solid var(--border-color-base, #a2a9b1); | |||
} | |||
.select2-container--default .select2-selection--multiple .select2-selection__choice { | |||
background-color: var(--background-color-base, #fff); | |||
} | |||
.select2-container--default .select2-results__option[aria-selected="true"] { | |||
background-color: var(--background-color-notice-subtle, #eaecf0); | |||
} | |||
.pf-select2-dropdown .select2-results__options .select2-results__option--highlighted { | |||
background-color: #2A4B8D; | |||
} | |||
/** -------------------------------- **/ | |||
/** Templates **/ | |||
/* Notices - Coloured boxes */ | |||
.cat-mw-box{ | |||
border: 1px solid var(--border-color-base, #a2a9b1); | |||
border-radius: 0.3rem; | |||
margin-bottom:2rem; | |||
} | |||
.cat-mw-box-header{ | |||
font-size:1.5rem; | |||
line-height: 1.65rem; | |||
background:rgba(0,0,0,0.03); | |||
padding:0.2rem 1rem; | |||
} | |||
.cat-mw-box-body{ | |||
padding:0.2rem 1rem; | |||
} | |||
/* Infobox */ | |||
.infobox { | |||
color: var(--color-base, #202122); | |||
background-color: var(--background-color-interactive-subtle, #f8f9fa); | |||
border: 1px solid #aaa; | |||
float: right; | |||
margin: 0 0 1em 1em; | |||
padding: 0.5em; | |||
width: 24em; | |||
} | |||
.infobox-title { | |||
font-size: 2em; | |||
text-align: center; | |||
border-bottom: 0.2em solid #ccc; | |||
padding-bottom: .25em; | |||
} | |||
.infobox-image{ | |||
display: flex; | |||
aspect-ratio: 2 / 1; | |||
align-items: center; | |||
justify-content: center; | |||
} | |||
/*bg color to get visible transparent images in darkmode*/ | |||
@media screen { | |||
html.skin-theme-clientpref-night .infobox-image{ | |||
background-color:#909590; | |||
} | |||
} | |||
@media screen and (prefers-color-scheme: dark) { | |||
/* automatic mode */ | |||
html.skin-theme-clientpref-os .infobox-image{ | |||
background-color:#909590; | |||
} | |||
} | |||
.infobox-table{ | |||
width:100%; | |||
table-layout:fixed; | |||
} | |||
.infobox-table td{ | |||
word-wrap:break-word; | |||
text-align: left; | |||
} | |||
.infobox-table th{ | |||
text-align: left; | |||
} | |||
.infobox-table-caption{ | |||
border-bottom: 0.1em solid #ccc; | |||
font-size:125%; | |||
} | |||
/* Loosely based on https://en.wikipedia.org/wiki/Template:Infobox */ | |||
@media (min-width: 640px) { | |||
.infobox { | |||
float: right; | |||
clear: right; | |||
} | |||
} | |||
@media (max-width: 640px) { | |||
.infobox { | |||
width: 95%; | |||
padding-left:2.5%; | |||
padding-right:2.5% | |||
} | |||
} | |||
/** -------------------------------- **/ | |||
/** Create page **/ | |||
.createPageInput { | |||
padding: 1rem; | |||
border: 2px solid var(--border-color-base, #a2a9b1); | |||
background-color: var(--background-color-interactive-subtle, #f8f9fa); | |||
cursor: pointer; | |||
border-radius: 8px; | |||
} | |||
.pageInputActive { | |||
border-color: var(--border-color-progressive--focus, #36c); | |||
box-shadow: inset 0 0 0 1px var(--box-shadow-color-progressive--focus, #36c); | |||
background-color: var(--background-color-interactive-subtle--active, #fff); | |||
} | |||
@media screen { | |||
html.skin-theme-clientpref-night .pageInputActive { | |||
border: 2px solid var( --color-base--hover, #404244 ); | |||
background-color: #101418; | |||
} | |||
} | |||
@media screen and (prefers-color-scheme: dark) { | |||
/* automatic mode */ | |||
html.skin-theme-clientpref-os .pageInputActive { | |||
border: 2px solid var( --color-base--hover, #404244 ); | |||
background-color: #101418; | |||
} | |||
} | |||
@media (hover: hover) { | |||
.createPageInput:hover{ | |||
border: 2px solid var( --color-base--hover, #404244 ); | |||
background-color: var( --background-color-interactive-subtle--active, #fff ); | |||
} | |||
html.skin-theme-clientpref-night .createPageInput:hover{ | |||
border: 2px solid var( --color-base--hover, #404244 ); | |||
background-color: #101418; | |||
} | |||
} | |||
@media (hover: hover) and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .createPageInput:hover{ | |||
border: 2px solid var( --color-base--hover, #404244 ); | |||
background-color: #101418; | |||
} | |||
} | |||
/* Work in progress */ | |||
.create-page { | |||
position: relative; | |||
} | |||
.create-page .grid { | |||
display: grid; | |||
grid-column-gap: 16px; | |||
grid-row-gap: 16px; | |||
} | |||
.create-page .grid .incident { grid-area: 1 / 1 / 3 / 3; cursor: pointer;} | |||
.create-page .grid .company { grid-area: 1 / 3 / 2 / 4; cursor: pointer;} | |||
.create-page .grid .product-line { grid-area: 2 / 3 / 3 / 4;cursor: pointer; } | |||
.create-page .grid .theme { grid-area: 3 / 1 / 4 / 3; cursor: pointer;} | |||
.create-page .grid .product { grid-area: 3 / 3 / 4 / 4;cursor: pointer; } | |||
.create-page .hidden { | |||
display: none; | |||
} | |||
.create-page .input-wrapper { | |||
padding-top: 16px; | |||
} | |||
@media (max-width: 640px) { | |||
.create-page .grid { | |||
display: flex; | |||
flex-direction: column; | |||
gap: 8px; | |||
} | |||
.create-page .input-wrapper { | |||
position: sticky; | |||
background-color: var(--background-color-base, #fff); | |||
bottom: 0; | |||
display: flex; | |||
flex-direction: column; | |||
border-top: 1px solid var(--border-color-muted, #dadde3); | |||
margin-left: -1.5rem; | |||
margin-right: -1.5rem; | |||
padding-left: 1.5rem; | |||
padding-right: 1.5rem; | |||
margin-top: 8px; | |||
} | |||
} | |||
/* Main page, new page summary */ | |||
.mainpage-contents .mw-contributions-list li{ | |||
padding-bottom: 0.5rem; | |||
margin: 0; | |||
} | |||
.mainpage-contents a.mw-newpages-time, | |||
.mainpage-contents span.mw-newpages-length, | |||
mainpage-contents span.comment, | |||
.mainpage-contents span.mw-usertoollinks, | |||
.mainpage-contents span.mw-tag-markers { display: none;} | |||
/** -------------------------------- **/ | |||
/* Utility classes */ | |||
/* Make an image span the full width of the page (should only be used for very narrow horizontal images) */ | |||
.cat-image-fullwidth img { | |||
max-width: 100%; | |||
height: auto; | |||
} | |||
@media screen and (min-width: 1680px) { | |||
.mw-header { | |||
display: flex !important; | |||
} | |||
} | |||
/* Jake */ | |||
#mw-panel a[href*="discord.gg"], | |||
#mw-panel a[href*="discord.com/invite"]{ | |||
display: flex; | |||
align-items: center; | |||
gap: 8px; | |||
padding: 10px 12px; | |||
border-radius: 6px; | |||
font-weight: 600; | |||
text-decoration: none; | |||
background: #5865F2; | |||
color: #fff !important; | |||
} | |||
#mw-panel a[href*="discord.gg"]::before, | |||
#mw-panel a[href*="discord.com/invite"]::before{ | |||
content: ""; | |||
width: 18px; | |||
height: 18px; | |||
flex: 0 0 18px; | |||
background: url("/w/Special:FilePath/Discord-white-icon.png") center / contain no-repeat; | |||
} | |||
#mw-panel a[href*="discord.gg"]:hover, | |||
#mw-panel a[href*="discord.com/invite"]:hover{ | |||
filter: brightness(0.95); | |||
} | |||
#mw-panel a[href="https://github.com/FULU-Foundation/CRW-Extension"]{ | |||
display: block; | |||
} | |||
/* | |||
#mw-panel a[href="https://github.com/FULU-Foundation/CRW-Extension"]::after{ | |||
content: "This extension is currently under development. Once complete,\00A0it will notify you when you're viewing a product,\00A0site,\00A0or\00A0service that has an article on our wiki."; | |||
display: block; | |||
margin-top: 4px; | |||
font-size: 0.85em; | |||
opacity: 0.7; | |||
font-weight: 400; | |||
line-height: 1.2; | |||
} | |||
*/ | |||
/* Jake */ | |||
.vector-header, | |||
.vector-header::before{ | |||
background-color: #004080 !important; | |||
background-image: none !important; | |||
border-bottom: 1px solid #004080; | |||
color: #fff; | |||
} | |||
.vector-header, | |||
.vector-header a, | |||
.vector-header .mw-logo-wordmark, | |||
.vector-header .vector-dropdown-label-text{ | |||
color: #fff !important; | |||
} | |||
/* FIX: dropdown text colors in explicit light theme (day) */ | |||
html.skin-theme-clientpref-day .vector-header .vector-dropdown-content, | |||
html.skin-theme-clientpref-day .vector-header .vector-dropdown-content *{ | |||
color: var(--color-base, #202122) !important; | |||
} | |||
html.skin-theme-clientpref-day .vector-header .vector-dropdown-content{ | |||
background: #fff !important; | |||
} | |||
html.skin-theme-clientpref-day .vector-header .vector-dropdown-content a{ | |||
color: var(--color-progressive, #36c) !important; | |||
} | |||
html.skin-theme-clientpref-day .vector-header .vector-dropdown-content a:visited{ | |||
color: var(--color-visited, #6b4ba1) !important; | |||
} | |||
.vector-header .vector-icon{ | |||
filter: invert(1) brightness(1.2); | |||
} | |||
/* Dropdown menus: light by default, dark in automatic OS dark and in night mode */ | |||
/* Light mode only */ | |||
@media screen and (prefers-color-scheme: light) { | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content { | |||
background: #fff !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content, | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content * { | |||
color: var(--color-base, #202122) !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content a { | |||
color: var(--color-progressive, #36c) !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content a:visited { | |||
color: var(--color-visited, #6b4ba1) !important; | |||
} | |||
} | |||
/* Automatic mode (OS dark) */ | |||
@media screen and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content { | |||
background: #202122 !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content, | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content * { | |||
color: #f8f9fa !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content a { | |||
color: #8ab4f8 !important; | |||
} | |||
html.skin-theme-clientpref-os .vector-header .vector-dropdown-content a:visited { | |||
color: #c58af9 !important; | |||
} | |||
} | |||
.vector-header .vector-dropdown-content .vector-icon{ | |||
filter: none !important; | |||
} | |||
#p-search .cdx-text-input__input{ | |||
background: #fff !important; | |||
color: var(--color-base, #202122) !important; | |||
} | |||
#p-search .cdx-text-input__input::placeholder{ | |||
color: rgba(32,33,34,0.6) !important; | |||
} | |||
#p-search .cdx-text-input__start-icon{ | |||
filter: none !important; | |||
} | |||
#p-search .cdx-menu, | |||
#p-search .cdx-menu *{ | |||
color: var(--color-base, #202122) !important; | |||
} | |||
#p-search .cdx-menu{ | |||
background: #fff !important; | |||
} | |||
#p-search .cdx-menu a{ | |||
color: var(--color-progressive, #36c) !important; | |||
} | |||
#p-search .cdx-menu a:visited{ | |||
color: var(--color-visited, #6b4ba1) !important; | |||
} | |||
#vector-main-menu-dropdown-label, | |||
#vector-appearance-dropdown-label, | |||
#vector-user-links-dropdown-label, | |||
.vector-header a.search-toggle, | |||
#pt-notifications-alert > a, | |||
#pt-notifications-notice > a{ | |||
background-color: transparent !important; | |||
opacity: 1 !important; | |||
border-radius: 8px; | |||
} | |||
#vector-main-menu-dropdown-label .vector-icon, | |||
#vector-appearance-dropdown-label .vector-icon, | |||
#vector-user-links-dropdown-label .vector-icon, | |||
.vector-header a.search-toggle .vector-icon, | |||
#pt-notifications-alert > a .vector-icon, | |||
#pt-notifications-notice > a .vector-icon{ | |||
opacity: 1 !important; | |||
filter: invert(1) brightness(1.2); | |||
} | |||
#vector-main-menu-dropdown-label:hover, | |||
#vector-appearance-dropdown-label:hover, | |||
#vector-user-links-dropdown-label:hover, | |||
.vector-header a.search-toggle:hover, | |||
#pt-notifications-alert > a:hover, | |||
#pt-notifications-notice > a:hover{ | |||
background-color: rgba(255, 255, 255, 0.14) !important; | |||
opacity: 1 !important; | |||
} | |||
#vector-main-menu-dropdown-label:hover .vector-icon, | |||
#vector-appearance-dropdown-label:hover .vector-icon, | |||
#vector-user-links-dropdown-label:hover .vector-icon, | |||
.vector-header a.search-toggle:hover .vector-icon, | |||
#pt-notifications-alert > a:hover .vector-icon, | |||
#pt-notifications-notice > a:hover .vector-icon{ | |||
filter: invert(1) brightness(1.45) !important; | |||
opacity: 1 !important; | |||
} | |||
.vector-header .vector-dropdown-label::after{ | |||
background-color: #fff !important; | |||
} | |||
/* Dark */ | |||
.skin-theme-clientpref-night .vector-header, | |||
.skin-theme-clientpref-night .vector-header::before{ | |||
background-color: #004080 !important; | |||
background-image: none !important; | |||
border-bottom: 1px solid #002a55 !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header, | |||
.skin-theme-clientpref-night .vector-header a, | |||
.skin-theme-clientpref-night .vector-header .mw-logo-wordmark, | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-label-text{ | |||
color: #fff !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-icon{ | |||
filter: none !important; | |||
background-color: #fff !important; | |||
opacity: 1 !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-label::after{ | |||
background-color: #fff !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-text-input__input{ | |||
background: #202122 !important; | |||
color: #f8f9fa !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-text-input__input::placeholder{ | |||
color: rgba(248,249,250,0.6) !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-text-input__start-icon{ | |||
filter: none !important; | |||
color: #f8f9fa !important; | |||
fill: #f8f9fa !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-typeahead-search__menu, | |||
.skin-theme-clientpref-night #p-search .cdx-menu{ | |||
background: #202122 !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-typeahead-search__menu, | |||
.skin-theme-clientpref-night #p-search .cdx-typeahead-search__menu *, | |||
.skin-theme-clientpref-night #p-search .cdx-menu, | |||
.skin-theme-clientpref-night #p-search .cdx-menu *{ | |||
color: #f8f9fa !important; | |||
} | |||
.skin-theme-clientpref-night #p-search .cdx-menu__item--highlighted, | |||
.skin-theme-clientpref-night #p-search .cdx-menu-item--highlighted, | |||
.skin-theme-clientpref-night #p-search .cdx-menu__item:hover, | |||
.skin-theme-clientpref-night #p-search .cdx-menu-item:hover{ | |||
background: rgba(255,255,255,0.08) !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content{ | |||
background: #202122 !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content, | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content *{ | |||
color: #f8f9fa !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content a{ | |||
color: #8ab4f8 !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content a:visited{ | |||
color: #c58af9 !important; | |||
} | |||
.skin-theme-clientpref-night .vector-header .vector-dropdown-content .vector-icon{ | |||
background-color: #f8f9fa !important; | |||
filter: none !important; | |||
} | |||
html.skin-theme-clientpref-night .vector-header .mw-logo-container.skin-invert{ | |||
filter: none !important; | |||
} | |||
html.skin-theme-clientpref-night .vector-header .mw-logo-wordmark{ | |||
color: #fff !important; | |||
} | |||
/* | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container, | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container #vector-main-menu, | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container #mw-panel, | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container .vector-pinnable-header, | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container .vector-menu-heading, | |||
html.skin-theme-clientpref-day #vector-main-menu-pinned-container .vector-menu-content, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container #vector-page-tools-pinned-container, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container #vector-page-tools, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container #vector-appearance-pinned-container, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container #vector-appearance, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container .vector-pinnable-header, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container .vector-menu-heading, | |||
html.skin-theme-clientpref-day .vector-sticky-pinned-container .vector-menu-content{ | |||
background-color: #FDFDFD !important; | |||
} | |||
@media (prefers-color-scheme: light){ | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container, | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container #vector-main-menu, | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container #mw-panel, | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container .vector-pinnable-header, | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container .vector-menu-heading, | |||
html.skin-theme-clientpref-os #vector-main-menu-pinned-container .vector-menu-content, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container #vector-page-tools-pinned-container, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container #vector-page-tools, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container #vector-appearance-pinned-container, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container #vector-appearance, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container .vector-pinnable-header, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container .vector-menu-heading, | |||
html.skin-theme-clientpref-os .vector-sticky-pinned-container .vector-menu-content{ | |||
background-color: #FDFDFD !important; | |||
} | |||
} | |||
html, | |||
body, | |||
.mw-page-container, | |||
.mw-page-container-inner, | |||
.mw-content-container, | |||
#content, | |||
.mw-body{ | |||
background: #FDFDFD !important; | |||
} | |||
*/ | |||
#p-jake-recentchanges .vector-menu-content-list{ | |||
margin: 0; | |||
padding: 0; | |||
} | |||
#p-jake-recentchanges .jake-rc-item{ | |||
margin: 0; | |||
padding: 2px 0; | |||
} | |||
#p-jake-recentchanges .jake-rc-item > a{ | |||
display: block; | |||
text-decoration: none; | |||
line-height: 1.15; | |||
} | |||
#p-jake-recentchanges .jake-rc-meta{ | |||
margin-top: 0; | |||
font-size: 0.85em; | |||
line-height: 1.1; | |||
opacity: 0.75; | |||
color: var(--color-base, #202122); | |||
} | |||
#p-jake-recentchanges .jake-rc-more{ | |||
padding: 4px 0 6px 0; | |||
margin-top: 4px; | |||
border-top: 0; | |||
border-bottom: 1px solid var(--background-color-interactive, #eaecf0); | |||
} | |||
#p-jake-recentchanges .jake-rc-more a{ | |||
text-decoration: none; | |||
font-weight: 600; | |||
} | |||
/* */ | |||
/* | |||
#left-navigation{ | |||
display: flex; | |||
margin-left: -8px; | |||
flex-grow: 1; | |||
align-items: center; | |||
} | |||
#left-navigation > nav[aria-label="Namespaces"]{ | |||
display: flex; | |||
align-items: center; | |||
gap: 8px; | |||
} | |||
*/ | |||
#p-associated-pages .vector-menu-content-list{ | |||
display: flex; | |||
align-items: center; | |||
} | |||
#p-associated-pages .mw-list-item{ | |||
display: flex; | |||
align-items: center; | |||
} | |||
.vector-menu-tabs .mw-list-item > a, | |||
.vector-page-toolbar-container .vector-dropdown > a, | |||
.vector-menu-tabs .mw-list-item .vector-dropdown-label, | |||
.vector-page-toolbar-container .vector-dropdown .vector-dropdown-label{ | |||
align-items: center; | |||
} | |||
#vector-variants-dropdown{ | |||
align-self: center; | |||
} | |||
#ca-jake-feedback{ | |||
display: flex; | |||
align-items: center; | |||
} | |||
#ca-jake-feedback > a.jake-feedback-btn{ | |||
display: inline-flex; | |||
align-items: center; | |||
gap: 8px; | |||
} | |||
#ca-jake-feedback > a.jake-feedback-btn::before{ | |||
content: ""; | |||
width: 14px; | |||
height: 14px; | |||
flex: 0 0 14px; | |||
background: url("/w/Special:FilePath/Info-circle.png") center / contain no-repeat; | |||
} | |||
figure[typeof~='mw:File/Thumb'], | |||
figure[typeof~='mw:File/Frame']{ | |||
border: 1px solid #004080 !important; | |||
border-bottom: 0 !important; | |||
} | |||
figure[typeof~='mw:File/Thumb'] > figcaption, | |||
figure[typeof~='mw:File/Frame'] > figcaption{ | |||
border: 1px solid #004080 !important; | |||
border-top: 0 !important; | |||
} | |||
.infobox{ | |||
color: var(--color-base, #202122); | |||
background-color: var(--background-color-interactive-subtle, #f8f9fa); | |||
border: 1px solid #004080 !important; | |||
float: right; | |||
margin: 0 0 1em 1em; | |||
padding: 0.5em; | |||
width: 24em; | |||
} | |||
/* */ | |||
#footer-social.crw-footer-social{ | |||
clear: both; | |||
width: 100%; | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 10px; | |||
margin: 6px 0 0 0; | |||
padding: 0; | |||
list-style: none; | |||
} | |||
#footer-social.crw-footer-social li{ | |||
margin: 0; | |||
padding: 0; | |||
} | |||
#footer-social.crw-footer-social a{ | |||
display: inline-flex; | |||
align-items: center; | |||
text-decoration: none; | |||
} | |||
@media screen and (prefers-color-scheme: dark) { | |||
/* Automatic mode search styles */ | |||
html.skin-theme-clientpref-os #p-search .cdx-text-input__input{ | |||
background: #202122 !important; | |||
color: #f8f9fa !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-text-input__input::placeholder{ | |||
color: rgba(248,249,250,0.6) !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-text-input__start-icon{ | |||
filter: none !important; | |||
color: #f8f9fa !important; | |||
fill: #f8f9fa !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-typeahead-search__menu, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu{ | |||
background: #202122 !important; | |||
border-color: rgba(255,255,255,0.18) !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-typeahead-search__menu, | |||
html.skin-theme-clientpref-os #p-search .cdx-typeahead-search__menu *, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu *{ | |||
color: #f8f9fa !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-menu__item--highlighted, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu-item--highlighted, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu__item:hover, | |||
html.skin-theme-clientpref-os #p-search .cdx-menu-item:hover{ | |||
background: rgba(255,255,255,0.08) !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-menu a{ | |||
color: #8ab4f8 !important; | |||
} | |||
html.skin-theme-clientpref-os #p-search .cdx-menu a:visited{ | |||
color: #c58af9 !important; | |||
} | |||
} | |||
.vector-page-titlebar { | |||
--border-color-base: transparent; | |||
} | |||