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

Материал из Лор Бабки Людов
Перейти к навигации Перейти к поиску
Установка темы Грядка
Снят кастомный CSS
Строка 1: Строка 1:
@import url("https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&family=PT+Serif:wght@400;700&family=PT+Mono&display=swap&subset=cyrillic,cyrillic-ext,latin");
/* Тема снята, ищем готовую */
 
/* === Лор Бабки Люды — тема «Грядка» === */
/* Палитра огорода: зелёный лист, подсолнух, свёкла, земля, бумажный фон */
 
:root {
--bl-leaf:        #4a7c2e;  /* зелёный лист */
--bl-leaf-light:  #6fa83a;
--bl-leaf-dark:  #355c1f;
--bl-sun:        #f4b91a;  /* подсолнух */
--bl-sun-dark:    #c99514;
--bl-beet:        #7a1d2e;  /* свёкла — для предупреждений/акцентов */
--bl-carrot:      #e87530;
--bl-soil:        #6b4423;  /* земля */
--bl-soil-dark:  #3d2817;
--bl-paper:      #faf5e6;  /* кремовая бумага — основной фон */
--bl-paper-warm:  #f3ead0;  /* чуть темнее, для боковых блоков */
--bl-ink:        #2c1810;  /* основной текст */
--bl-ink-soft:    #5a4a3a;
}
 
/* Бумажный фон с лёгкой текстурой */
body.skin-vector-2022,
body.skin-vector {
background-color: var(--bl-paper);
background-image:
radial-gradient( circle at 20% 30%, rgba(106, 68, 35, 0.03) 1px, transparent 1px ),
radial-gradient( circle at 70% 80%, rgba(74, 124, 46, 0.03) 1px, transparent 1px );
background-size: 24px 24px, 32px 32px;
color: var(--bl-ink);
font-family: "PT Sans", "Segoe UI", system-ui, sans-serif;
}
 
/* Контейнер страницы — «бумажная карточка» */
.mw-page-container {
background-color: var(--bl-paper);
}
 
.mw-page-container-inner {
background: linear-gradient( to bottom, #fefaf0 0%, var(--bl-paper) 100% );
border-left: 1px solid rgba(107, 68, 35, 0.15);
border-right: 1px solid rgba(107, 68, 35, 0.15);
}
 
/* Шапка — зелёная «грядка» сверху */
.mw-header {
background: linear-gradient( to bottom, var(--bl-leaf) 0%, var(--bl-leaf-dark) 100% );
color: var(--bl-paper);
border-bottom: 4px solid var(--bl-soil);
box-shadow: 0 2px 8px rgba(61, 40, 23, 0.2);
}
 
.mw-header a,
.mw-header .mw-checkbox-hack-button {
color: var(--bl-paper);
}
 
.mw-header a:hover {
color: var(--bl-sun);
}
 
/* Логотип-заголовок */
.mw-logo-wordmark {
color: var(--bl-paper) !important;
font-family: "PT Serif", Georgia, serif;
font-weight: 700;
font-size: 1.4em;
text-shadow: 1px 1px 0 var(--bl-leaf-dark);
}
 
/* Поиск */
.cdx-search-input__input,
.mw-search-form input[name="search"] {
background-color: var(--bl-paper);
border: 1px solid var(--bl-soil) !important;
color: var(--bl-ink);
}
 
/* Сайдбары — плоско, без карточек, без скруглений.
  Только типографика, тонкие разделители, никаких вложенных фонов. */
 
/* Все сайдбар-обёртки и портлеты — прозрачные */
.vector-main-menu,
.vector-page-tools,
.vector-appearance,
.vector-appearance-landmark,
.vector-sticky-pinned-container,
.vector-toc-pinned-container,
.vector-pinnable-element,
.mw-portlet,
.vector-menu,
.vector-menu-content {
background: transparent !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
}
 
/* Главные заголовки сайдбаров (Содержание, Внешний вид, Инструменты) */
.vector-menu-heading,
.vector-pinnable-header,
.vector-pinnable-header-label {
color: var(--bl-soil-dark);
font-family: "PT Serif", Georgia, serif;
font-weight: 700;
font-size: 1em;
border-bottom: 1px solid rgba(107, 68, 35, 0.25);
padding: 0 0 0.4em 0;
margin: 0 0 0.8em 0;
background: transparent !important;
}
 
/* Подзаголовки внутри панелей (Текст, Ширина, Общие и т.п.) — h3 */
.vector-appearance h3,
.vector-appearance-landmark h3,
.mw-portlet h3,
.vector-menu .vector-menu-heading + h3,
.vector-menu h3.vector-menu-heading {
color: var(--bl-soil-dark);
font-family: "PT Serif", Georgia, serif;
font-size: 0.92em;
font-weight: 700;
margin: 0.9em 0 0.4em 0;
padding: 0.5em 0 0 0;
border-top: 1px solid rgba(107, 68, 35, 0.15);
border-bottom: none;
background: transparent !important;
}
 
/* Первый h3 в панели — без верхнего разделителя */
.vector-appearance .vector-menu-content > h3:first-child,
.vector-appearance-landmark .vector-menu-content > h3:first-child,
.mw-portlet .vector-menu-content > h3:first-child,
.vector-menu-content > .mw-portlet:first-child h3 {
border-top: none;
padding-top: 0;
margin-top: 0;
}
 
/* Выпадающее меню "Инструменты" — единственная карточка, очень мягкая.
  Только этот один блок получает кремовый фон + бордер,
  потому что это плавающий popup и ему нужны границы. */
.vector-dropdown-content,
.vector-page-tools-dropdown .vector-menu,
.vector-menu-dropdown .vector-menu-content {
background-color: var(--bl-paper) !important;
border: 1px solid rgba(107, 68, 35, 0.25) !important;
border-radius: 0 !important;
box-shadow: 2px 2px 0 rgba(61, 40, 23, 0.12) !important;
padding: 0.7em 0.9em !important;
}
 
/* Внутри попапа всё плоское */
.vector-dropdown-content .mw-portlet,
.vector-dropdown-content .vector-pinnable-element {
padding: 0 !important;
margin: 0 !important;
}
 
/* Список ссылок в сайдбарах — без буллитов, плотнее */
.vector-menu-content-list,
.mw-portlet ul {
list-style: none;
padding-left: 0;
margin: 0;
}
 
.vector-menu-content-list > li,
.mw-portlet ul > li {
padding: 0.15em 0;
}
 
/* Заголовки страниц — серьёзная типографика */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.firstHeading,
.mw-first-heading {
font-family: "PT Serif", Georgia, "Times New Roman", serif;
color: var(--bl-soil-dark);
border-bottom: 2px solid var(--bl-leaf);
padding-bottom: 0.2em;
}
 
.mw-body h1,
.firstHeading,
.mw-first-heading {
border-bottom: 3px double var(--bl-leaf);
padding-bottom: 0.3em;
}
 
/* Декоративный росток слева от h1 */
.mw-first-heading::before {
content: "🌱 ";
color: var(--bl-leaf);
font-size: 0.9em;
}
 
/* Ссылки — цвет молодой травы */
.mw-body-content a,
.mw-body a:not(.mw-selflink) {
color: var(--bl-leaf-dark);
text-decoration: underline;
text-decoration-color: rgba(74, 124, 46, 0.4);
text-underline-offset: 2px;
}
 
.mw-body-content a:hover {
color: var(--bl-leaf);
text-decoration-color: var(--bl-leaf);
}
 
/* Красные ссылки (несуществующие страницы) — цвет свёклы */
.mw-body-content a.new,
.mw-body a.new {
color: var(--bl-beet);
text-decoration-color: rgba(122, 29, 46, 0.4);
}
 
/* Контент */
.mw-body,
.mw-body-content,
.parser-output {
color: var(--bl-ink);
line-height: 1.6;
}
 
/* Таблицы — деревянные рамки */
.wikitable {
background-color: #fff9eb;
border: 2px solid var(--bl-soil);
border-radius: 4px;
box-shadow: 0 2px 4px rgba(61, 40, 23, 0.1);
}
 
.wikitable > tr > th,
.wikitable > * > tr > th {
background: linear-gradient( to bottom, var(--bl-leaf) 0%, var(--bl-leaf-dark) 100% );
color: var(--bl-paper);
border: 1px solid var(--bl-soil-dark);
font-family: "PT Serif", Georgia, serif;
}
 
.wikitable > tr > td,
.wikitable > * > tr > td {
border: 1px solid rgba(107, 68, 35, 0.3);
}
 
/* Инфобоксы / сайдбары на страницах */
.infobox {
background: var(--bl-paper-warm);
border: 2px solid var(--bl-soil);
border-radius: 4px;
box-shadow: 2px 2px 0 rgba(61, 40, 23, 0.15);
font-family: "PT Sans", system-ui, sans-serif;
}
 
.infobox-title,
.infobox caption {
background: linear-gradient( to bottom, var(--bl-sun) 0%, var(--bl-sun-dark) 100% );
color: var(--bl-soil-dark);
font-family: "PT Serif", Georgia, serif;
font-weight: bold;
padding: 0.4em;
}
 
/* Цитаты — «записка из блокнота» */
blockquote {
background: var(--bl-paper-warm);
border-left: 4px solid var(--bl-sun);
padding: 0.8em 1em;
font-style: italic;
color: var(--bl-ink-soft);
border-radius: 0 4px 4px 0;
}
 
/* Код */
code,
pre {
background-color: #2c1810;
color: #f4e8d0;
border: 1px solid var(--bl-soil-dark);
border-radius: 3px;
font-family: "PT Mono", "Consolas", monospace;
}
 
code {
padding: 0.1em 0.4em;
}
 
pre {
padding: 0.8em;
overflow-x: auto;
}
 
/* Кнопки */
.cdx-button:not(.cdx-button--weight-quiet):not(.cdx-button--weight-primary),
.mw-ui-button {
background-color: var(--bl-paper-warm);
border: 1px solid var(--bl-soil);
color: var(--bl-soil-dark);
}
 
.cdx-button--action-progressive,
.cdx-button--weight-primary,
.mw-ui-button.mw-ui-progressive {
background: linear-gradient( to bottom, var(--bl-leaf) 0%, var(--bl-leaf-dark) 100% );
border: 1px solid var(--bl-leaf-dark);
color: var(--bl-paper);
}
 
.cdx-button--action-progressive:hover {
background: linear-gradient( to bottom, var(--bl-leaf-light) 0%, var(--bl-leaf) 100% );
}
 
/* Футер — землистый */
.mw-footer-container,
#footer,
.mw-footer {
background-color: var(--bl-soil-dark);
color: var(--bl-paper-warm) !important;
border-top: 4px solid var(--bl-leaf);
}
 
.mw-footer-container *,
#footer *,
.mw-footer * {
color: var(--bl-paper-warm) !important;
}
 
.mw-footer-container a,
#footer a,
.mw-footer a {
color: var(--bl-sun) !important;
}
 
.mw-footer-container a:hover,
#footer a:hover,
.mw-footer a:hover {
color: #fff !important;
}
 
/* Боковая панель "Внешний вид" — в палитру грядки */
.vector-appearance,
.vector-appearance-landmark,
.vector-sticky-pinned-container,
.vector-toc {
background-color: var(--bl-paper-warm);
border-left: 1px solid rgba(107, 68, 35, 0.2);
}
 
.vector-toc-pinned-container {
background-color: var(--bl-paper-warm);
}
 
/* Вкладки (читать/править/история) */
.vector-menu-tabs li,
#p-views li {
background: var(--bl-paper-warm);
border: 1px solid var(--bl-soil);
border-bottom: none;
}
 
.vector-menu-tabs li.selected,
#p-views li.selected {
background: var(--bl-paper);
border-bottom: 1px solid var(--bl-paper);
}
 
/* TOC — содержание */
.toc,
#toc {
background-color: var(--bl-paper-warm);
border: 1px solid var(--bl-soil);
border-left: 4px solid var(--bl-leaf);
border-radius: 0 4px 4px 0;
padding: 0.8em;
}
 
.toctitle h2 {
font-family: "PT Serif", Georgia, serif;
color: var(--bl-soil-dark);
}
 
/* Предупреждения/сообщения */
.warningbox,
.mw-message-box-warning {
background: #fff4d6;
border: 1px solid var(--bl-sun-dark);
border-left: 4px solid var(--bl-sun-dark);
color: var(--bl-ink);
}
 
.errorbox,
.mw-message-box-error {
background: #fae2e6;
border: 1px solid var(--bl-beet);
border-left: 4px solid var(--bl-beet);
color: var(--bl-beet);
}
 
.successbox,
.mw-message-box-success {
background: #e8f0d6;
border: 1px solid var(--bl-leaf);
border-left: 4px solid var(--bl-leaf);
color: var(--bl-leaf-dark);
}
 
/* Декоративный «забор» внизу шапки */
.mw-header::after {
content: "";
display: block;
height: 6px;
background-image:
linear-gradient( 45deg, var(--bl-sun) 25%, transparent 25%, transparent 75%, var(--bl-sun) 75%, var(--bl-sun) ),
linear-gradient( 45deg, var(--bl-sun) 25%, transparent 25%, transparent 75%, var(--bl-sun) 75%, var(--bl-sun) );
background-size: 12px 12px;
background-position: 0 0, 6px 6px;
background-color: var(--bl-soil);
opacity: 0.7;
}
 
/* Заглавная страница — особый праздничный вид */
.page-Заглавная_страница .mw-first-heading,
.page-Main_Page .mw-first-heading {
text-align: center;
font-size: 2.2em;
border-bottom: none;
color: var(--bl-soil-dark);
}
 
.page-Заглавная_страница .mw-first-heading::before,
.page-Main_Page .mw-first-heading::before {
content: "🌻 ";
}
 
.page-Заглавная_страница .mw-first-heading::after,
.page-Main_Page .mw-first-heading::after {
content: " 🌻";
}

Версия от 00:06, 13 мая 2026

/* Тема снята, ищем готовую */