MediaWiki:Minerva.css
Jump to navigation
Jump to search
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Theme toggle button styles for MinervaNeue mobile skin */
/* Icon styles */
.minerva-icon--theme-toggle {
mask-image: linear-gradient(transparent, transparent),
url("data:image/svg+xml,%3Csvg height='21' viewBox='0 0 21 21' width='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8.85464918.37900488c-1.91149353 1.51069427-3.13816124 3.84973402-3.13816124 6.47527736 0 4.55564936 3.69308349 8.24873286 8.24873286 8.24873286 2.5815709 0 4.8861545-1.1859235 6.3986798-3.0426994-.8206378 4.7389755-4.9523867 8.343122-9.9259291 8.343122-5.56375572 0-10.07407088-4.5103151-10.07407088-10.0740709 0-5.02506013 3.67919933-9.19079725 8.49074856-9.95036192z' fill='%2354595d' fill-rule='evenodd'/%3E%3C/svg%3E");
}
.stw-theme-dark .minerva-icon--theme-toggle {
mask-image: linear-gradient(transparent, transparent),
url("data:image/svg+xml,%3Csvg fill='%2354595d' fill-rule='evenodd' xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M17.07 7.07V2.93h-4.14L10 0 7.07 2.93H2.93v4.14L0 10l2.93 2.93v4.14h4.14L10 20l2.93-2.93h4.14v-4.14L20 10zM10 16a6 6 0 1 1 6-6 6 6 0 0 1-6 6z'/%3E%3Ccircle cx='10' cy='10' r='4.5'/%3E%3C/svg%3E");
}
/* Hide vanilla MW theme settings */
#skin-client-prefs-skin-theme {
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 */
body.rootpage-Structorica_Wiki .page-heading,
body.rootpage-Main_Page .page-heading {
display: none;
}
body.page-Main_Page #firstHeading {
display: none;
}
/* Margin is too big */
.page-heading {
margin-bottom: 0;
}
/* Force collapsed navbox headers to full width */
.content table.navbox {
display: table;
border-collapse: separate;
}
/* Show TOC */
@media (max-width: 512px) {
.skin-minerva .toc-mobile {
display: block;
}
}
/* 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 */
.footer-content .hlist-separated li:after {
color: #FFF;
}
/* Fix hlist gaps being too wide */
.hlist > ul li {
margin-right: 0;
}
/* Fix changes autocollapsing in recent changes */
.mw-changeslist-edit, .mw-changeslist-line {
display: table-row !important;
}
.mw-changeslist-line-inner {
padding-top: 1.5em;
}
.mw-enhanced-rc-nested {
padding-top: 0.5em;
}
/* Rollback link as a button */
.mw-rollback-link a {
padding: 5px 12px;
border: 1px solid var(--border-color-base);
font-weight: bold;
}
/* Width is based on existing minerva calculations */
@media all and (max-width: 639px) {
/* Display rollback button on own line to stop clipping */
.mw-rollback-link {
display: block;
}
}
/* Alternating cell background */
.alternatecells:nth-child(odd) {
background-color: #F9F9F9;
}
/* Add a background color to the overlay header and remove the padding */
.overlay-header {
background-color: var(--content-background-color);
padding-top: 0;
}
.content li {
margin-bottom: 2px;
}
.content .mw-parser-output > h2, .content .section-heading {
border-bottom: 1px solid #c8ccd1;
}
dl {
margin-bottom: 5px;
}
/* Hide nomobile */
.nomobile,
.msgbox .msgbox-image {
display: none;
}
/* Remove blank space when editing */
.action-edit .overlay-header-container + .overlay-content {
padding-top: 0;
}
.editor-overlay .content {
margin-top: 0;
}
/* Hatnotes and disambiguation notices */
.hatnote {
font-style: italic;
}
.hatnote i {
font-style: normal;
}
div.hatnote {
padding-left: 0;
margin-bottom: 0.5em;
font-size: 0.8125rem;
}
div.hatnote + div.hatnote {
margin-top: -0.5em;
}
div.msgbox {
font-size: 0.8125rem;
max-width: revert !important;
}
@media all and (min-width: 511px) {
div.msgbox-subtle {
max-width: 306px !important;
}
}
/* Fix animated infobox images shifting the screen when images have different dimensions */
.content span.animated a > img,
.content span.animated a > .lazy-image-placeholder,
.content noscript span.animated > img {
max-width: initial !important;
}
/* Fix infobox text being way too large */
#mw-mf-viewport .notaninfobox p {
font-size: 100%;
padding: 0.2em 0;
}
body.page-Main_Page #firstHeading {
display: none;
}
/* Turn a list into a tree view style */
.treeview {
margin-top: 0.3em;
}
.treeview .treeview-header {
padding-left: 3px;
font-weight: bold;
}
.treeview .treeview-header:last-child {
border-color: #636363 !important;
border-left-style: dotted;
}
.treeview .treeview-header:not(:last-child):before {
content: none;
}
.treeview .treeview-header:last-child:before {
border-bottom: 0;
}
.treeview ul,
.treeview li {
margin: 0;
padding: 0;
list-style-type: none;
list-style-image: none;
}
.treeview li li {
position: relative;
padding-left: 13px;
margin-left: 7px;
border-left: 1px solid #636363;
}
.treeview li li:before {
content: "";
position: absolute;
top: 0;
left: -1px;
width: 11px;
height: 11px;
border-bottom: 1px solid #636363;
}
.treeview li li:last-child:not(.treeview-continue) {
border-color: transparent;
}
.treeview li li:last-child:not(.treeview-continue):before {
border-left: 1px solid #636363;
width: 10px;
}
.nbttree-inherited {
background-color: #E6E6FA;
}