MediaWiki:Common.css: Difference between revisions

:root {
    --bg-main: #1e1e1e;
    --bg-gray: #2b2b2b;
    --bg-content: #2f2f2f;
    --text-main: #cbcbcb;
    --text-muted: #b0b0b0;
    --link-color: #69e9ff;
    --link-hover: #69e9ff;
    --link-visited: #cc7a2a;
    --link-missing: #b9676e;
    --border-color: #3f3f3f;
    --header-bg: #222;
    --header-border: #444;
}

/* === Общий фон === */
body.skin-vector-2022,
body.skin-vector-2022 .mw-page-container,
body.skin-vector-2022 .vector-main-content-container,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned,
body.skin-vector-2022 .vector-page,
body.skin-vector-2022 .mw-workspace-container {
    background-color: var(--bg-main) !important;
    color: var(--text-main) !important;
}

/* Контент */
body.skin-vector-2022 .mw-body,
body.skin-vector-2022 .mw-parser-output {
    background-color: var(--bg-content) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border-color) !important;
    padding: 20px;
    border-radius: 6px;
}

/* === Верхняя панель (хедер) === */
body.skin-vector-2022 .vector-header,
body.skin-vector-2022 .vector-page-toolbar-container,
body.skin-vector-2022 .vector-page-toolbar {
    background-color: var(--header-bg) !important;
    border-bottom: 1px solid var(--header-border) !important;
}

/* === Заголовки страниц === */
body.skin-vector-2022 #firstHeading,
body.skin-vector-2022 .mw-page-title-main,
body.skin-vector-2022 .firstHeading,
body.skin-vector-2022 .mw-headline {
    color: var(--text-main) !important;
}

/* === Левое меню (панель) === */
body.skin-vector-2022 #mw-panel,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned {
    background-color: #252525 !important;
    border-right: 1px solid var(--border-color) !important;
}

/* Заголовки меню */
body.skin-vector-2022 #mw-panel .vector-menu-heading,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned .vector-menu-heading {
    color: var(--text-muted) !important;
    font-weight: bold !important;
}

/* Ссылки меню */
body.skin-vector-2022 #mw-panel .vector-menu-content li a,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned .vector-menu-content li a {
    color: var(--link-color) !important;
    text-decoration: none !important;
}

body.skin-vector-2022 #mw-panel .vector-menu-content li a:visited,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned .vector-menu-content li a:visited {
    color: var(--link-visited) !important;
}

body.skin-vector-2022 #mw-panel .vector-menu-content li a:hover,
body.skin-vector-2022 .vector-feature-sidebar-main-menu-pinned .vector-menu-content li a:hover {
    color: var(--link-hover) !important;
    text-decoration: underline !important;
}

/* === Ссылки в контенте === */
body.skin-vector-2022 .mw-parser-output a {
    color: var(--link-color) !important;
}
body.skin-vector-2022 .mw-parser-output a:visited {
    color: var(--link-visited) !important;
}
body.skin-vector-2022 .mw-parser-output a.new {
    color: var(--link-missing) !important;
}

/* === Таблицы === */
.mw-parser-output table {
    border: 1px solid var(--border-color) !important;
    background-color: #333 !important;
    color: var(--text-main) !important;
}
.mw-parser-output th {
    background-color: #444 !important;
    color: #fff !important;
}

/* === Infobox === */
.infobox {
    float: right;
    clear: right;
    margin: 0 0 1em 1em;
    width: 300px;
    background-color: #2f2f2f !important;
    border: 1px solid #555 !important;
    border-collapse: collapse;
    font-size: 90%;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    border-radius: 6px;
    overflow: hidden;
    color: var(--text-main) !important;
}
.infobox th {
    background: #3a3a3a !important;
    text-align: left;
    font-weight: bold;
    padding: 6px;
    border: none;
    color: #fff !important;
    width: 40%;
}
.infobox td {
    border: none;
    padding: 6px;
    vertical-align: middle;
    background-color: #2f2f2f !important;
}
.infobox caption {
    background: linear-gradient(to bottom, #4b4b4b, #3a3a3a) !important;
    font-weight: bold;
    font-size: 100%;
    padding: 6px;
    text-align: center;
    border-bottom: 1px solid #555;
    color: #fff !important;
}

/* === Recipe таблицы === */
table.recipe-table {
    width: 220px !important;
    min-width: 220px;
    max-width: 220px;
    display: inline-block !important;
    vertical-align: top;
    margin: 0;
    border-collapse: collapse !important;
    border: 1px solid #555 !important;
    background: #2f2f2f !important;
    font-size: 85% !important;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.3);
    border-radius: 6px;
    overflow: hidden;
    color: var(--text-main) !important;
}
table.recipe-table caption {
    background: linear-gradient(to bottom, #4b4b4b, #3a3a3a) !important;
    font-weight: bold;
    font-size: 95%;
    padding: 5px;
    text-align: center;
    border-bottom: 1px solid #555;
    color: #fff !important;
}
table.recipe-table th {
    background: #3a3a3a !important;
    text-align: center !important;
    font-weight: bold !important;
    padding: 3px 4px !important;
    border: none !important;
    color: #fff !important;
    font-size: 80%;
    text-transform: uppercase;
}
table.recipe-table td {
    padding: 3px 6px !important;
    border: none !important;
    vertical-align: middle !important;
    height: auto !important;
    line-height: normal !important;
    width: auto;
}
table.recipe-table img {
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block;
    vertical-align: middle;
}