MediaWiki:Common.css: различия между версиями
Перейти к навигации
Перейти к поиску
Admin (обсуждение | вклад) Снят кастомный CSS |
Admin (обсуждение | вклад) Установка темы Грядка |
||
| Строка 1: | Строка 1: | ||
/* | /* =================================================================== | ||
Лор Бабки Люды — тема в стиле wiki.gg (Terraria-like) | |||
База: Vector legacy + heavy custom CSS | |||
=================================================================== */ | |||
@import url("https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&family=PT+Serif:wght@400;700;900&family=PT+Mono&display=swap&subset=cyrillic,cyrillic-ext,latin"); | |||
:root { | |||
/* Палитра — дерево/земля/листва/подсолнух/бумага */ | |||
--bl-bg: #3d2817; /* фон страницы — тёмное дерево */ | |||
--bl-bg-darker: #2c1c10; | |||
--bl-panel: #4a3220; /* боковые панели */ | |||
--bl-panel-h: #5e9a3a; /* шапки боковых панелей — листва */ | |||
--bl-panel-h-dark: #355c1f; | |||
--bl-content-bg: #faf5e6; /* фон контента — бумага */ | |||
--bl-content-bg2: #f3ead0; | |||
--bl-border: #6b4423; | |||
--bl-border-dark: #3d2817; | |||
--bl-text: #f4ead0; /* текст на тёмном фоне */ | |||
--bl-text-content: #2c1810; /* текст на бумаге */ | |||
--bl-link: #7da42a; | |||
--bl-link-hover: #a8d65c; | |||
--bl-link-content: #355c1f; | |||
--bl-link-redlink: #a8281c; | |||
--bl-sun: #f4b91a; | |||
} | |||
/* --- Фон страницы: тёмное дерево --- */ | |||
html, body { | |||
background-color: var(--bl-bg) !important; | |||
background-image: | |||
repeating-linear-gradient( | |||
90deg, | |||
rgba(0,0,0,0.04) 0px, | |||
rgba(0,0,0,0.04) 1px, | |||
transparent 1px, | |||
transparent 4px | |||
), | |||
repeating-linear-gradient( | |||
0deg, | |||
rgba(0,0,0,0.06) 0px, | |||
rgba(0,0,0,0.06) 1px, | |||
transparent 1px, | |||
transparent 60px | |||
); | |||
color: var(--bl-text); | |||
font-family: "PT Sans", "Segoe UI", system-ui, sans-serif; | |||
} | |||
/* --- Баннер сверху: широкая SVG-картинка --- */ | |||
body::before { | |||
content: ""; | |||
display: block; | |||
width: 100%; | |||
height: 200px; | |||
background-image: url(/resources/assets/babka-banner.svg); | |||
background-size: cover; | |||
background-position: center center; | |||
background-repeat: no-repeat; | |||
border-bottom: 4px solid var(--bl-border-dark); | |||
box-shadow: 0 4px 12px rgba(0,0,0,0.4); | |||
} | |||
/* В Vector legacy main panel начинается с #mw-page-base. Сдвигаем всё вниз. */ | |||
#mw-page-base, | |||
#mw-head-base { | |||
background: transparent !important; | |||
background-color: transparent !important; | |||
} | |||
#mw-head { | |||
background-color: var(--bl-bg) !important; | |||
} | |||
/* --- Контентная область: кремовая бумага с тёмной рамкой --- */ | |||
#content, | |||
.mw-body { | |||
background-color: var(--bl-content-bg) !important; | |||
color: var(--bl-text-content) !important; | |||
border: 1px solid var(--bl-border) !important; | |||
border-radius: 4px !important; | |||
padding: 1em 1.5em !important; | |||
box-shadow: 0 2px 8px rgba(0,0,0,0.3); | |||
margin-top: 0.5em; | |||
} | |||
/* Текст на бумаге */ | |||
.mw-body, | |||
.mw-body-content, | |||
#bodyContent, | |||
.parser-output { | |||
color: var(--bl-text-content); | |||
} | |||
/* Заголовки на бумаге */ | |||
.mw-body h1, | |||
.mw-body h2, | |||
.mw-body h3, | |||
.mw-body h4, | |||
.mw-body h5, | |||
.mw-body h6, | |||
.firstHeading, | |||
#firstHeading { | |||
font-family: "PT Serif", Georgia, "Times New Roman", serif; | |||
color: var(--bl-text-content); | |||
border-bottom: 2px solid var(--bl-border); | |||
font-weight: 700; | |||
} | |||
.firstHeading, | |||
#firstHeading { | |||
border-bottom: 3px double var(--bl-border); | |||
padding-bottom: 0.2em; | |||
} | |||
/* Ссылки на бумаге */ | |||
.mw-body a, | |||
#bodyContent a { | |||
color: var(--bl-link-content); | |||
text-decoration: none; | |||
} | |||
.mw-body a:hover, | |||
#bodyContent a:hover { | |||
color: var(--bl-panel-h); | |||
text-decoration: underline; | |||
} | |||
.mw-body a.new, | |||
#bodyContent a.new { | |||
color: var(--bl-link-redlink); | |||
} | |||
/* --- Левая панель (sidebar) --- */ | |||
#mw-panel { | |||
background: transparent !important; | |||
} | |||
#mw-panel .portal, | |||
.portal { | |||
background-color: var(--bl-panel) !important; | |||
border: 1px solid var(--bl-border-dark) !important; | |||
border-radius: 4px; | |||
margin: 0 0.5em 0.8em 0.5em !important; | |||
padding: 0 !important; | |||
box-shadow: 0 2px 4px rgba(0,0,0,0.3); | |||
} | |||
/* Заголовки секций сайдбара (Navigation, Guides, Portals) */ | |||
#mw-panel .portal h3, | |||
.portal h3 { | |||
background: linear-gradient(to bottom, var(--bl-panel-h) 0%, var(--bl-panel-h-dark) 100%) !important; | |||
color: var(--bl-text) !important; | |||
font-family: "PT Serif", Georgia, serif !important; | |||
font-size: 0.95em !important; | |||
font-weight: 700 !important; | |||
margin: 0 !important; | |||
padding: 0.5em 0.8em !important; | |||
border: none !important; | |||
border-bottom: 2px solid var(--bl-border-dark) !important; | |||
border-radius: 3px 3px 0 0; | |||
text-shadow: 1px 1px 0 rgba(0,0,0,0.4); | |||
cursor: default; | |||
} | |||
#mw-panel .portal .body, | |||
.portal .body { | |||
padding: 0.5em 0.8em !important; | |||
background: transparent !important; | |||
} | |||
#mw-panel .portal ul, | |||
.portal ul { | |||
list-style: none; | |||
padding: 0; | |||
margin: 0; | |||
} | |||
#mw-panel .portal li, | |||
.portal li { | |||
padding: 0.2em 0; | |||
} | |||
#mw-panel .portal a, | |||
.portal a { | |||
color: var(--bl-text) !important; | |||
text-decoration: none; | |||
} | |||
#mw-panel .portal a:hover, | |||
.portal a:hover { | |||
color: var(--bl-sun) !important; | |||
text-decoration: underline; | |||
} | |||
/* --- Вкладки сверху: Главная/Обсуждение и Читать/Править/История --- */ | |||
.vectorTabs, | |||
#p-namespaces, | |||
#p-views { | |||
background: transparent !important; | |||
} | |||
.vectorTabs li, | |||
#p-namespaces li, | |||
#p-views li { | |||
background: var(--bl-panel) !important; | |||
background-image: linear-gradient(to bottom, #5e3e22 0%, var(--bl-panel) 100%) !important; | |||
border: 1px solid var(--bl-border-dark) !important; | |||
border-bottom: none !important; | |||
border-radius: 4px 4px 0 0; | |||
margin-right: 2px; | |||
} | |||
.vectorTabs li.selected, | |||
#p-namespaces li.selected, | |||
#p-views li.selected { | |||
background: var(--bl-content-bg) !important; | |||
background-image: none !important; | |||
} | |||
.vectorTabs li a, | |||
#p-namespaces li a, | |||
#p-views li a { | |||
color: var(--bl-text) !important; | |||
text-decoration: none; | |||
padding: 0.4em 0.8em; | |||
} | |||
.vectorTabs li.selected a, | |||
#p-namespaces li.selected a, | |||
#p-views li.selected a { | |||
color: var(--bl-text-content) !important; | |||
font-weight: 700; | |||
} | |||
.vectorTabs li a:hover, | |||
#p-namespaces li a:hover { | |||
color: var(--bl-sun) !important; | |||
} | |||
/* --- Поиск --- */ | |||
#p-search { | |||
background: transparent !important; | |||
} | |||
#searchInput, | |||
#searchInput[type="search"] { | |||
background-color: var(--bl-content-bg) !important; | |||
color: var(--bl-text-content) !important; | |||
border: 1px solid var(--bl-border) !important; | |||
border-radius: 3px; | |||
padding: 0.3em 0.5em; | |||
} | |||
/* --- Персональные ссылки сверху-справа (Войти и т.п.) --- */ | |||
#p-personal { | |||
background: transparent !important; | |||
} | |||
#p-personal ul, | |||
#p-personal li { | |||
background: transparent !important; | |||
} | |||
#p-personal a { | |||
color: var(--bl-text) !important; | |||
text-decoration: none; | |||
} | |||
#p-personal a:hover { | |||
color: var(--bl-sun) !important; | |||
} | |||
/* --- Логотип в углу: прячем дефолтный --- */ | |||
#p-logo { | |||
display: none; | |||
} | |||
/* --- Таблицы --- */ | |||
.wikitable { | |||
background-color: var(--bl-content-bg2); | |||
border: 2px solid var(--bl-border); | |||
border-radius: 3px; | |||
box-shadow: 0 1px 3px rgba(0,0,0,0.15); | |||
} | |||
.wikitable > tr > th, | |||
.wikitable > * > tr > th { | |||
background: linear-gradient(to bottom, var(--bl-panel-h) 0%, var(--bl-panel-h-dark) 100%); | |||
color: var(--bl-text); | |||
border: 1px solid var(--bl-border-dark); | |||
font-family: "PT Serif", Georgia, serif; | |||
text-shadow: 1px 1px 0 rgba(0,0,0,0.4); | |||
} | |||
.wikitable > tr > td, | |||
.wikitable > * > tr > td { | |||
border: 1px solid rgba(107, 68, 35, 0.3); | |||
padding: 0.4em 0.6em; | |||
} | |||
/* --- Инфобоксы --- */ | |||
.infobox { | |||
background: var(--bl-content-bg2); | |||
border: 2px solid var(--bl-border); | |||
border-radius: 3px; | |||
box-shadow: 2px 2px 0 rgba(61, 40, 23, 0.2); | |||
} | |||
/* --- Код --- */ | |||
code, pre { | |||
background-color: var(--bl-bg-darker); | |||
color: #f4e8d0; | |||
border: 1px solid var(--bl-border-dark); | |||
border-radius: 3px; | |||
font-family: "PT Mono", Consolas, monospace; | |||
} | |||
code { padding: 0.1em 0.4em; } | |||
pre { padding: 0.8em; overflow-x: auto; } | |||
/* --- TOC --- */ | |||
.toc, #toc { | |||
background-color: var(--bl-content-bg2); | |||
border: 1px solid var(--bl-border); | |||
border-left: 4px solid var(--bl-panel-h); | |||
border-radius: 0 3px 3px 0; | |||
padding: 0.8em; | |||
} | |||
.toctitle { | |||
font-family: "PT Serif", Georgia, serif; | |||
} | |||
/* --- Футер --- */ | |||
#footer, | |||
.mw-footer { | |||
background-color: var(--bl-bg-darker); | |||
color: var(--bl-text); | |||
border-top: 4px solid var(--bl-panel-h); | |||
padding: 1em; | |||
margin-top: 1em; | |||
} | |||
#footer a, | |||
.mw-footer a { | |||
color: var(--bl-sun); | |||
} | |||
#footer a:hover, | |||
.mw-footer a:hover { | |||
color: #fff; | |||
} | |||
/* --- Цитаты --- */ | |||
blockquote { | |||
background: var(--bl-content-bg2); | |||
border-left: 4px solid var(--bl-sun); | |||
padding: 0.8em 1em; | |||
font-style: italic; | |||
color: #5a4a3a; | |||
border-radius: 0 3px 3px 0; | |||
} | |||
/* --- Заглавная страница: убираем h1 (как у wiki.gg) --- */ | |||
.page-Заглавная_страница #firstHeading, | |||
.page-Main_Page #firstHeading { | |||
display: none; | |||
} | |||
Версия от 11:09, 13 мая 2026
/* ===================================================================
Лор Бабки Люды — тема в стиле wiki.gg (Terraria-like)
База: Vector legacy + heavy custom CSS
=================================================================== */
@import url("https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&family=PT+Serif:wght@400;700;900&family=PT+Mono&display=swap&subset=cyrillic,cyrillic-ext,latin");
:root {
/* Палитра — дерево/земля/листва/подсолнух/бумага */
--bl-bg: #3d2817; /* фон страницы — тёмное дерево */
--bl-bg-darker: #2c1c10;
--bl-panel: #4a3220; /* боковые панели */
--bl-panel-h: #5e9a3a; /* шапки боковых панелей — листва */
--bl-panel-h-dark: #355c1f;
--bl-content-bg: #faf5e6; /* фон контента — бумага */
--bl-content-bg2: #f3ead0;
--bl-border: #6b4423;
--bl-border-dark: #3d2817;
--bl-text: #f4ead0; /* текст на тёмном фоне */
--bl-text-content: #2c1810; /* текст на бумаге */
--bl-link: #7da42a;
--bl-link-hover: #a8d65c;
--bl-link-content: #355c1f;
--bl-link-redlink: #a8281c;
--bl-sun: #f4b91a;
}
/* --- Фон страницы: тёмное дерево --- */
html, body {
background-color: var(--bl-bg) !important;
background-image:
repeating-linear-gradient(
90deg,
rgba(0,0,0,0.04) 0px,
rgba(0,0,0,0.04) 1px,
transparent 1px,
transparent 4px
),
repeating-linear-gradient(
0deg,
rgba(0,0,0,0.06) 0px,
rgba(0,0,0,0.06) 1px,
transparent 1px,
transparent 60px
);
color: var(--bl-text);
font-family: "PT Sans", "Segoe UI", system-ui, sans-serif;
}
/* --- Баннер сверху: широкая SVG-картинка --- */
body::before {
content: "";
display: block;
width: 100%;
height: 200px;
background-image: url(/resources/assets/babka-banner.svg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
border-bottom: 4px solid var(--bl-border-dark);
box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
/* В Vector legacy main panel начинается с #mw-page-base. Сдвигаем всё вниз. */
#mw-page-base,
#mw-head-base {
background: transparent !important;
background-color: transparent !important;
}
#mw-head {
background-color: var(--bl-bg) !important;
}
/* --- Контентная область: кремовая бумага с тёмной рамкой --- */
#content,
.mw-body {
background-color: var(--bl-content-bg) !important;
color: var(--bl-text-content) !important;
border: 1px solid var(--bl-border) !important;
border-radius: 4px !important;
padding: 1em 1.5em !important;
box-shadow: 0 2px 8px rgba(0,0,0,0.3);
margin-top: 0.5em;
}
/* Текст на бумаге */
.mw-body,
.mw-body-content,
#bodyContent,
.parser-output {
color: var(--bl-text-content);
}
/* Заголовки на бумаге */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6,
.firstHeading,
#firstHeading {
font-family: "PT Serif", Georgia, "Times New Roman", serif;
color: var(--bl-text-content);
border-bottom: 2px solid var(--bl-border);
font-weight: 700;
}
.firstHeading,
#firstHeading {
border-bottom: 3px double var(--bl-border);
padding-bottom: 0.2em;
}
/* Ссылки на бумаге */
.mw-body a,
#bodyContent a {
color: var(--bl-link-content);
text-decoration: none;
}
.mw-body a:hover,
#bodyContent a:hover {
color: var(--bl-panel-h);
text-decoration: underline;
}
.mw-body a.new,
#bodyContent a.new {
color: var(--bl-link-redlink);
}
/* --- Левая панель (sidebar) --- */
#mw-panel {
background: transparent !important;
}
#mw-panel .portal,
.portal {
background-color: var(--bl-panel) !important;
border: 1px solid var(--bl-border-dark) !important;
border-radius: 4px;
margin: 0 0.5em 0.8em 0.5em !important;
padding: 0 !important;
box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
/* Заголовки секций сайдбара (Navigation, Guides, Portals) */
#mw-panel .portal h3,
.portal h3 {
background: linear-gradient(to bottom, var(--bl-panel-h) 0%, var(--bl-panel-h-dark) 100%) !important;
color: var(--bl-text) !important;
font-family: "PT Serif", Georgia, serif !important;
font-size: 0.95em !important;
font-weight: 700 !important;
margin: 0 !important;
padding: 0.5em 0.8em !important;
border: none !important;
border-bottom: 2px solid var(--bl-border-dark) !important;
border-radius: 3px 3px 0 0;
text-shadow: 1px 1px 0 rgba(0,0,0,0.4);
cursor: default;
}
#mw-panel .portal .body,
.portal .body {
padding: 0.5em 0.8em !important;
background: transparent !important;
}
#mw-panel .portal ul,
.portal ul {
list-style: none;
padding: 0;
margin: 0;
}
#mw-panel .portal li,
.portal li {
padding: 0.2em 0;
}
#mw-panel .portal a,
.portal a {
color: var(--bl-text) !important;
text-decoration: none;
}
#mw-panel .portal a:hover,
.portal a:hover {
color: var(--bl-sun) !important;
text-decoration: underline;
}
/* --- Вкладки сверху: Главная/Обсуждение и Читать/Править/История --- */
.vectorTabs,
#p-namespaces,
#p-views {
background: transparent !important;
}
.vectorTabs li,
#p-namespaces li,
#p-views li {
background: var(--bl-panel) !important;
background-image: linear-gradient(to bottom, #5e3e22 0%, var(--bl-panel) 100%) !important;
border: 1px solid var(--bl-border-dark) !important;
border-bottom: none !important;
border-radius: 4px 4px 0 0;
margin-right: 2px;
}
.vectorTabs li.selected,
#p-namespaces li.selected,
#p-views li.selected {
background: var(--bl-content-bg) !important;
background-image: none !important;
}
.vectorTabs li a,
#p-namespaces li a,
#p-views li a {
color: var(--bl-text) !important;
text-decoration: none;
padding: 0.4em 0.8em;
}
.vectorTabs li.selected a,
#p-namespaces li.selected a,
#p-views li.selected a {
color: var(--bl-text-content) !important;
font-weight: 700;
}
.vectorTabs li a:hover,
#p-namespaces li a:hover {
color: var(--bl-sun) !important;
}
/* --- Поиск --- */
#p-search {
background: transparent !important;
}
#searchInput,
#searchInput[type="search"] {
background-color: var(--bl-content-bg) !important;
color: var(--bl-text-content) !important;
border: 1px solid var(--bl-border) !important;
border-radius: 3px;
padding: 0.3em 0.5em;
}
/* --- Персональные ссылки сверху-справа (Войти и т.п.) --- */
#p-personal {
background: transparent !important;
}
#p-personal ul,
#p-personal li {
background: transparent !important;
}
#p-personal a {
color: var(--bl-text) !important;
text-decoration: none;
}
#p-personal a:hover {
color: var(--bl-sun) !important;
}
/* --- Логотип в углу: прячем дефолтный --- */
#p-logo {
display: none;
}
/* --- Таблицы --- */
.wikitable {
background-color: var(--bl-content-bg2);
border: 2px solid var(--bl-border);
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.wikitable > tr > th,
.wikitable > * > tr > th {
background: linear-gradient(to bottom, var(--bl-panel-h) 0%, var(--bl-panel-h-dark) 100%);
color: var(--bl-text);
border: 1px solid var(--bl-border-dark);
font-family: "PT Serif", Georgia, serif;
text-shadow: 1px 1px 0 rgba(0,0,0,0.4);
}
.wikitable > tr > td,
.wikitable > * > tr > td {
border: 1px solid rgba(107, 68, 35, 0.3);
padding: 0.4em 0.6em;
}
/* --- Инфобоксы --- */
.infobox {
background: var(--bl-content-bg2);
border: 2px solid var(--bl-border);
border-radius: 3px;
box-shadow: 2px 2px 0 rgba(61, 40, 23, 0.2);
}
/* --- Код --- */
code, pre {
background-color: var(--bl-bg-darker);
color: #f4e8d0;
border: 1px solid var(--bl-border-dark);
border-radius: 3px;
font-family: "PT Mono", Consolas, monospace;
}
code { padding: 0.1em 0.4em; }
pre { padding: 0.8em; overflow-x: auto; }
/* --- TOC --- */
.toc, #toc {
background-color: var(--bl-content-bg2);
border: 1px solid var(--bl-border);
border-left: 4px solid var(--bl-panel-h);
border-radius: 0 3px 3px 0;
padding: 0.8em;
}
.toctitle {
font-family: "PT Serif", Georgia, serif;
}
/* --- Футер --- */
#footer,
.mw-footer {
background-color: var(--bl-bg-darker);
color: var(--bl-text);
border-top: 4px solid var(--bl-panel-h);
padding: 1em;
margin-top: 1em;
}
#footer a,
.mw-footer a {
color: var(--bl-sun);
}
#footer a:hover,
.mw-footer a:hover {
color: #fff;
}
/* --- Цитаты --- */
blockquote {
background: var(--bl-content-bg2);
border-left: 4px solid var(--bl-sun);
padding: 0.8em 1em;
font-style: italic;
color: #5a4a3a;
border-radius: 0 3px 3px 0;
}
/* --- Заглавная страница: убираем h1 (как у wiki.gg) --- */
.page-Заглавная_страница #firstHeading,
.page-Main_Page #firstHeading {
display: none;
}