MediaWiki:Vector.css

@import url('https://fonts.googleapis.com/css2?family=Istok+Web:ital,wght@0,400;0,700;1,400;1,700&family=PT+Mono&display=swap');

/* Глобальные настройки */
/* Рамки, границы, поля */
.vector-page-toolbar-container{
	box-shadow: none;
}
/* Текст и заголовки */
/* Их гарнитура */
/* в теле, липкой шапке, кнопках правки раздела */
body, 
.mw-body h1, .mw-body h2,
.vector-feature-zebra-design-disabled .vector-sticky-header-context-bar-primary,
.mw-editsection{
	font-family: Istok Web, sans-serif;
}
/* Их размеры */
.vector-body{
	font-size: 1em;
}
/* Рюшки для текста */
/* в оглавлении */
.vector-toc-level-1 a:any-link{
	text-transform: uppercase;
}
/* Рюшки для ссылок */
/* для всех */
a:any-link,
a:hover{
	text-decoration: none;
}
/* в статье */
.mw-body-content a:any-link{
	border-bottom: 1px solid;
}
/* в меню над статьёй */
.vector-menu-tabs .mw-list-item.vector-tab-noicon > a, 
.vector-page-toolbar-container .vector-dropdown.vector-tab-noicon > a, 
.vector-menu-tabs .mw-list-item .vector-dropdown-label, 
.vector-page-toolbar-container .vector-dropdown .vector-dropdown-label{
	padding: 0 7px;
	margin-bottom: 0;
	margin-top: 1px;
}
/* в кнопках правки раздела и правой части меню статьи*/
.mw-editsection a:any-link,
#right-navigation a:any-link{
	font-style: italic;
	padding: 0 10px;
}
.mw-editsection a:any-link,{
	border-bottom: none;
}

/* Цвета (зависят от темы) */
/* Светлая тема (по умолчанию)*/
/* Светлая тема отстой */

/* Тёмная */
@media (prefers-color-scheme: dark){
	:root{
		--backgroundColor: black;
		--textColor: rgb(220, 220, 220);
		--linkColor: yellow;
		--linkUnderlineColor: rgba(255, 255, 255, 0.33);
		--linkOutColor: rgb(112, 255, 200);
		--linkNewColor: rgb( 255, 122, 49);
		--hoverColor: rgb(255, 255, 255);
		--articleActionColorUnselected: rgba(255, 255, 0, 0.25);
		--articleActionColorSelected: rgba(255, 255, 0, 0.75);
		--leftBackgroundColor: rgb(77, 34, 14);
		--leftTextColor: rgb(220, 220, 220);
		--leftLinkColor: rgb(220, 220, 220);
		--tableBackgroundColor: rgb(90, 90, 90);
		--tableCaptionBackgroundColor: rgb( 120, 120, 150);
		--codeBackgroundColor: rgba(200, 200, 220, 0.5);
		--messageSuccessBG: rgb(112, 155, 255);
	}
}
/* Фон всей страницы */
body,
.vector-feature-zebra-design-disabled .mw-page-container{
	background-color: var(--backgroundColor);
}
/* главного меню и содержания */
.vector-feature-zebra-design-disabled #vector-main-menu-pinned-container .vector-main-menu,
.vector-feature-zebra-design-disabled #vector-toc{
	background-color: var(--leftBackgroundColor);
}
/* хак против тупого градиента */
.vector-feature-zebra-design-disabled #vector-toc-pinned-container .vector-toc::after,
.vector-feature-zebra-design-disabled #vector-page-tools-pinned-container .vector-page-tools::after{
	background: none;
}
/* Фон в меню над статьёй */
.vector-menu-tabs .mw-list-item a:any-link{
	background-color: var(--articleActionColorUnselected);
}
.vector-menu-tabs .selected a:any-link{
	background-color: var(--articleActionColorSelected);
}

/* Цвет текста всей страницы */
/* А также заголовков */
body,
.vector-feature-zebra-design-disabled body,
.vector-feature-zebra-design-disable .mw-page-container,
h1, h2, h3, h4, h5, h6{
	color: var(--textColor);
}
/* Цвет ссылок — в статье и неописанных */
a:any-link, a:visited,
.mw-body-content a:any-link{
	color: var(--linkColor);
	border-color: var(--linkUnderlineColor);
}
/* при наведении */
a:hover,
.mw-body-content a:hover{
	color: var(--hoverColor);
	border-color: var(--hoverColor);
}
/* Их новых */
.mw-body-content a.new:any-link,
a.new:any-link{
	color: var(--linkNewColor);
}
/* Вовне */
a.external:any-link,
.mw-body-content a:not([href^="/"]):any-link,
.mw-body-content a.external:any-link{
	color: var(--linkOutColor);
}
/* Кнопок правки раздела */
.mw-editsection a:any-link,
#p-cactions a:any-link{
	background-color: var(--articleActionColorUnselected);
	color: var(--textColor);
}
.mw-editsection a:hover,
.vector-menu-content-list a:hover{
	color: var(--hoverColor);
}
/* В левом меню */
.vector-feature-zebra-design-disabled .vector-pinnable-element .mw-list-item a:not(.mw-selflink):any-link, 
.vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a:not(.mw-selflink):any-link{
	color: var(--leftLinkColor);
}
.vector-toc-link a{
	color: var(--textColor);
}
/* В меню действий сверху */
.vector-menu-tabs .mw-list-item a:any-link,
.vector-menu-content-list a:any-link{
	color: var(--textColor);
}
.vector-menu-tabs .mw-list-item-selected a:any-link{
	color: var(--backgroundColor);
}

/* Цвет шапки */
/* просто вверху */
.vector-feature-zebra-design-disabled 
.vector-header-container{
	background-color: rgb(245, 151, 0);
}
/* липкой */
.vector-sticky-header{
	background-color: rgba(245, 151, 0, 0.7);
	color: white;
}
/* Визуальный редактор */
/* Всплывашка (для ссылки, например) */
.oo-ui-popupWidget-popup,
.oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame{
	background-color: var(--leftBackgroundColor);
}
.oo-ui-tabOptionWidget,
.oo-ui-toolbar-bar{
	color: var(--textColor);
}
.oo-ui-tabOptionWidget.oo-ui-optionWidget-selected{
	background-color: var(--articleActionColorSelected);
	color: var(--backgroundColor);
}
/* Элементы статьи */
/* Обычная таблица (и не очень)*/
.wikitable, .mw-datatable td, 
.mw-datatable tr:hover td,
#mw-allmessagestable tbody:hover td{
	background-color: var(--tableBackgroundColor);
	color: var(--textColor);
}
.wikitable > * > tr > th, .mw-datatable th{
	background-color: var(--tableCaptionBackgroundColor);
}
/* Код */
.pre, code, .mw-code{
	background-color: var(--codeBackgroundColor);
	color: var(--textColor);
	border: #222;
}
/* UniversalLanguangeSelector */
.ulc-search{
	background-color: #111;
}
.uls-lcd{
	background-color: #777;
}
/* Информационные сообщения */
.mw-message-box-success{
	background-color: var(--messageSuccessBG);
}
/* Поле с категориями */
.catlinks{
	background-color: rgba(128, 128, 128, 0.5);
}
/* Поля на странице сравнения версий */
#pagehistory li.selected{
	background-color: rgb(90, 120, 84);
	color: var(--textColor);
}
/* Выпадайка при догадке страницы в разных полях */
.oo-ui-menuSelectWidget{
	background-color: rgba(0, 0, 0, 0.7);
}
.oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget{
	color: var(--textColor);
}
.oo-ui-menuOptionWidgetHighlited{
	background-color: var(--backgroundColor);
}