MediaWiki:Minerva.css: различия между версиями

/* 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;
}