MediaWiki:Minerva.css: Difference between revisions
No edit summary Tags: Mobile edit Mobile web edit |
No edit summary |
||
| (11 intermediate revisions by the same user not shown) | |||
| Line 16: | Line 16: | ||
display: none; | display: none; | ||
} | } | ||
/* Default styles */ | |||
:root { | |||
--mobile-header-background: url('images/essentials/Mobile-header.png'); | |||
--mobile-header-background-color: #698cff; | |||
--content-background-color: #ebeef2; | |||
--content-text-color: #202122; | |||
} | |||
/* Logo replacement for MinervaNeue */ | |||
.minerva-header .branding-box a span { | |||
font-size: 0; /* Hide text */ | |||
display: inline-block; | |||
} | |||
.minerva-header .branding-box a span::after { | |||
content: ""; | |||
display: inline-block; | |||
width: 135px; | |||
height: 50px; | |||
background-image: url('images/essentials/WikiLogoMobile.png'); | |||
background-size: contain; | |||
background-repeat: no-repeat; | |||
background-position: center; | |||
vertical-align: middle; | |||
} | |||
/* ------------------------------------------ DARK THEME -------------------------------------*/ | |||
:root .stw-theme-dark { | |||
--archive-box-background-color: #282828; | |||
--archive-box-border-color: #444; | |||
--mobile-header-background: url('images/essentials/Dark-mobile-header.png'); | |||
--mobile-header-background-color: #2b3162; | |||
--content-background-color: #2b2f39; | |||
--content-text-color: #e6e6e6; | |||
--base-background-color: #13191c; | |||
color: var(--content-text-color); | |||
} | |||
body.stw-theme-dark :not(.infobox-title) a:not(.new,.mw-selflink,.menu2-text a), | |||
body.stw-theme-dark .jslink, | |||
body.stw-theme-dark .toctogglelabel, | |||
body.stw-theme-dark .mw-collapsible-text, | |||
body.stw-theme-dark .vector-menu-dropdown .mw-list-item a, | |||
body.stw-theme-dark .mw-mmv-post-image a, | |||
body.stw-theme-dark #mw-mf-page-left ul.hlist li a{ | |||
color: #90c0fe; | |||
} | |||
body.stw-theme-dark .mw-body-content .hlist li:not(:last-child)::after { | |||
background-color: #FFF; | |||
} | |||
body.stw-theme-dark .mw-message-box, | |||
body.stw-theme-dark .mw-body, h1, h2, h3, h4, h5, h6, | |||
body.stw-theme-dark .mw-ui-input { | |||
color: var(--content-text-color); | |||
} | |||
body.stw-theme-dark .mw-body a.new, body.stw-theme-dark .mw-mmv-post-image a.new { | |||
color: #ffa4a4; | |||
} | |||
body.stw-theme-dark .branding-box img, | |||
body.stw-theme-dark .minerva-footer-logo img { | |||
filter: revert; | |||
} | |||
/* | |||
body.stw-theme-dark .client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), | |||
body.stw-theme-dark .jquery-tablesorter th.headerSort { | |||
background-image: url('images/essentials/Sort_both.svg'); | |||
} | |||
body.stw-theme-dark .jquery-tablesorter th.headerSortDown { | |||
background-image: url('images/essentials/Sort_down.svg'); | |||
} | |||
body.stw-theme-dark .jquery-tablesorter th.headerSortUp { | |||
background-image: url('images/essentials/Sort_up.svg'); | |||
} | |||
*/ | |||
/* CodeEditor search color fixes for dark theme */ | |||
body.stw-theme-dark .ace_search { | |||
background-color: #353535; | |||
border: 1px solid var(--ooui-border); | |||
border-top: 0; | |||
border-right: 0; | |||
color: #e6e6e6; | |||
} | |||
/* CodeEditor search input field color fixes for dark theme */ | |||
body.stw-theme-dark .ace_search_field { | |||
border-radius: 3px 0 0 3px; | |||
background-color: #414141; | |||
color: #e6e6e6; | |||
border: 1px solid var(--ooui-border); | |||
border-right: 0; | |||
} | |||
/* CodeEditor search button color fixes for dark theme */ | |||
body.stw-theme-dark .ace_searchbtn { | |||
border: 1px solid var(--ooui-border); | |||
background: #414141; | |||
color: #e6e6e6; | |||
border-right: 0; | |||
border-left: 1px solid var(--ooui-border); | |||
} | |||
body.stw-theme-dark .ace_button { | |||
border: 1px solid var(--ooui-border); | |||
color: #e6e6e6; | |||
} | |||
/*----------------------------------------------------------------------------------------*/ | |||
.minerva-footer { | |||
border-color: transparent; | |||
} | |||
.mw-footer > .post-content { | |||
margin-top: 32px; | |||
} | |||
.mw-footer > .post-content > .minerva-footer-logo { | |||
display: none; | |||
} | |||
/* | |||
footer, | |||
footer a:active, | |||
#footer, | |||
#footer a:active { | |||
color: #FFF; | |||
} | |||
footer a, | |||
#footer a, | |||
footer a:visited, | |||
#footer a:visited { | |||
color: #BFBFBF; | |||
} | |||
.last-modified-bar { | |||
background-color: #EAECF0; | |||
} | |||
*/ | |||
.content code { | |||
border-radius: 2px; | |||
} | |||
@media all and (max-width: 768px) { | |||
.gallerybox .thumb > div { | |||
margin: 15px !important; | |||
width: auto !important; | |||
} | |||
} | |||
@media all and (max-width: 720px) { | |||
.gallery.mw-gallery-traditional .gallerybox { | |||
width: 155px !important; | |||
} | |||
.gallery.mw-gallery-traditional .gallerybox .thumb { | |||
width: 150px !important; | |||
} | |||
.gallery.mw-gallery-nolines .gallerybox { | |||
width: 125px !important; | |||
} | |||
.gallery.mw-gallery-nolines .gallerybox .thumb { | |||
width: 120px !important; | |||
} | |||
} | |||
/* */ | |||
/** Mobile skin **/ | |||
.overlay.search-overlay, | |||
.overlay.editor-overlay { | |||
padding-top: 90px; | |||
} | |||
/* Mobile header background */ | |||
.skin-minerva #mw-mf-page-center .header-container, | |||
.skin-minerva .search-overlay .header-container { | |||
position: relative; | |||
background: var(--mobile-header-background) left bottom repeat-x,linear-gradient(0deg,var(--content-background-color) 50%,var(--mobile-header-background-color) 50%); | |||
background-size: 48px auto; | |||
right: 0; | |||
left: 0; | |||
height: 96px; | |||
} | |||
.skin-minerva .header-container { | |||
background-color: transparent; | |||
box-shadow: none; | |||
} | |||
.overlay-header, | |||
.minerva-header { | |||
padding-top: 7px; | |||
} | |||
/* Maximise editing space when editing on small screens */ | |||
@media all and (max-width: 999px) { | |||
.overlay-enabled .editor-overlay { | |||
padding-top: 3.35em; | |||
} | |||
.overlay-enabled .overlay.editor-overlay .header-container:after { | |||
bottom: 0; | |||
background-position: left bottom -29px; | |||
} | |||
} | |||
.overlay .overlay-header-container.header-container { | |||
z-index: 2; | |||
} | |||
.minerva-header .branding-box { | |||
opacity: 1; | |||
} | |||
.notification-count { | |||
background: none; | |||
} | |||
/* Background color */ | |||
.overlay-enabled, | |||
.overlay-content, | |||
.mw-body { | |||
background-color: var(--content-background-color); | |||
} | |||
/* Hide page title on all main pages */ | /* Hide page title on all main pages */ | ||
| Line 46: | Line 332: | ||
} | } | ||
/* Fix Footer*/ | |||
.footer-icons .cdx-button.cdx-button--fake-button--enabled, | |||
.footer-icons .cdx-button.cdx-button--fake-button--enabled:hover, | |||
.footer-icons .cdx-button.cdx-button--fake-button--enabled:active { | |||
background: none; | |||
border: none; | |||
padding: 0; | |||
margin: 0; | |||
} | |||
/* Fix footer hlist separator colour */ | /* Fix footer hlist separator colour */ | ||