MediaWiki:Vector.css: различия между версиями
добавил правило для кнопок правки раздела и ещё что-то |
просто минус зебра? |
||
(не показано 29 промежуточных версий этого же участника) | |||
Строка 2: | Строка 2: | ||
/* Глобальные настройки */ | /* Глобальные настройки */ | ||
/* Рамки, границы, поля */ | |||
.vector-page-toolbar-container{ | |||
box-shadow: none; | |||
} | |||
/* Текст и заголовки */ | /* Текст и заголовки */ | ||
/* Их гарнитура */ | /* Их гарнитура */ | ||
/* в теле, липкой шапке, кнопках правки раздела */ | |||
body, | body, | ||
.mw-body h1, .mw-body h2, | .mw-body h1, .mw-body h2, | ||
.vector-sticky-header-context-bar-primary, | |||
.mw-editsection{ | |||
font-family: Istok Web, sans-serif; | font-family: Istok Web, sans-serif; | ||
} | } | ||
Строка 14: | Строка 18: | ||
.vector-body{ | .vector-body{ | ||
font-size: 1em; | font-size: 1em; | ||
} | |||
/* Рюшки для текста */ | |||
/* в оглавлении */ | |||
.vector-toc-level-1 a:any-link{ | |||
text-transform: uppercase; | |||
} | |||
/* никаких рюшек стиля */ | |||
li{ | |||
list-style-image: none; | |||
} | } | ||
/* Рюшки для ссылок */ | /* Рюшки для ссылок */ | ||
Строка 24: | Строка 37: | ||
.mw-body-content a:any-link{ | .mw-body-content a:any-link{ | ||
border-bottom: 1px solid; | 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; | |||
} | } | ||
Строка 42: | Строка 73: | ||
--articleActionColorUnselected: rgba(255, 255, 0, 0.25); | --articleActionColorUnselected: rgba(255, 255, 0, 0.25); | ||
--articleActionColorSelected: rgba(255, 255, 0, 0.75); | --articleActionColorSelected: rgba(255, 255, 0, 0.75); | ||
--leftBackgroundColor: | --leftBackgroundColor: rgb(77, 34, 14); | ||
--leftTextColor: rgb(220, 220, 220); | --leftTextColor: rgb(220, 220, 220); | ||
--leftLinkColor: rgb(220, 220, 220); | --leftLinkColor: rgb(220, 220, 220); | ||
Строка 53: | Строка 84: | ||
/* Фон всей страницы */ | /* Фон всей страницы */ | ||
body, | body, | ||
.mw-page-container{ | |||
background-color: var(--backgroundColor); | background-color: var(--backgroundColor); | ||
} | } | ||
/* главного меню и содержания */ | /* главного меню и содержания */ | ||
.vector- | .vector-pinned-container, | ||
#vector-main-menu-pinned-container .vector-main-menu, | |||
#vector-toc{ | |||
background-color: var(--leftBackgroundColor); | background-color: var(--leftBackgroundColor); | ||
} | } | ||
/* хак против тупого градиента */ | /* хак против тупого градиента */ | ||
#vector-toc-pinned-container .vector-toc::after, | |||
#vector-page-tools-pinned-container .vector-page-tools::after{ | |||
background: none; | 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); | |||
} | } | ||
Строка 70: | Строка 109: | ||
/* А также заголовков */ | /* А также заголовков */ | ||
body, | body, | ||
.mw-page-container, | |||
h1, h2, h3, h4, h5, h6, | |||
h1, h2, h3, h4, h5, h6{ | .mw-footer li{ | ||
color: var(--textColor); | color: var(--textColor); | ||
} | } | ||
Строка 92: | Строка 131: | ||
color: var(--linkNewColor); | color: var(--linkNewColor); | ||
} | } | ||
/* | /* Вовне */ | ||
.mw-editsection a:any-link{ | 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); | background-color: var(--articleActionColorUnselected); | ||
color: var(--textColor); | 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-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{ | .vector-feature-zebra-design-disabled .vector-dropdown-content .mw-list-item a:not(.mw-selflink):any-link{ | ||
color: var(--leftLinkColor); | 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- | .vector-header-container .mw-header{ | ||
. | |||
background-color: rgb(245, 151, 0); | background-color: rgb(245, 151, 0); | ||
} | } | ||
/* липкой */ | /* липкой */ | ||
.vector-sticky-header{ | .vector-header-container .vector-sticky-header{ | ||
background-color: rgba(245, 151, 0, 0.7); | background-color: rgba(245, 151, 0, 0.7); | ||
color: white; | 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); | |||
} | } |
Текущая версия от 00:33, 8 октября 2024
@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-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;
}
/* никаких рюшек стиля */
li{
list-style-image: none;
}
/* Рюшки для ссылок */
/* для всех */
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,
.mw-page-container{
background-color: var(--backgroundColor);
}
/* главного меню и содержания */
.vector-pinned-container,
#vector-main-menu-pinned-container .vector-main-menu,
#vector-toc{
background-color: var(--leftBackgroundColor);
}
/* хак против тупого градиента */
#vector-toc-pinned-container .vector-toc::after,
#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,
.mw-page-container,
h1, h2, h3, h4, h5, h6,
.mw-footer li{
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-header-container .mw-header{
background-color: rgb(245, 151, 0);
}
/* липкой */
.vector-header-container .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);
}