MediaWiki:Common.css

Материал из База Знаний экосистемы игрового превосходства Imba.Market
Перейти к навигации Перейти к поиску

Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

  • Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
  • Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
  • Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
  • Opera: Нажмите Ctrl+F5.
/* Размещённый здесь CSS будет применяться ко всем темам оформления */

/* MediaWiki:Common.css */
/* --- Глобальные переменные стиля IMBA --- */
:root {
    --imba-dark: #0c0c0c;
    --imba-dark-light: #1a1a1a;
    --imba-gray: #2d2d2d;
    --imba-text: #e6e6e6;
    --imba-text-secondary: #a0a0a0;
    --imba-accent: #ff5e1a;
    --imba-accent-hover: #ff7d47;
}

/* --- Общие стили --- */
body {
    background-color: var(--imba-dark);
    color: var(--imba-text);
    font-family: 'Roboto', sans-serif;
    line-height: 1.6;
}

#mw-page-base {
    background: linear-gradient(to bottom, var(--imba-dark-light) 0%, var(--imba-dark) 100%) !important;
    height: 60px;
}

.mw-body, .vector-body {
    background-color: var(--imba-dark-light) !important;
    color: var(--imba-text) !important;
    border: 1px solid var(--imba-gray) !important;
    border-top: none !important;
    margin-top: 0 !important;
}

/* --- Заголовок (Header) --- */
.vector-header-container {
    background-color: rgba(12, 12, 12, 0.95) !important;
    border-bottom: 1px solid var(--imba-gray) !important;
    backdrop-filter: blur(10px);
    padding: 10px 0;
}

.vector-header-container .mw-logo {
    /* Стили для логотипа, если нужно изменить его размер/положение */
}

.vector-search-box input {
    background-color: var(--imba-gray) !important;
    border: 1px solid #444 !important;
    color: var(--imba-text) !important;
    border-radius: 4px !important;
}

.vector-search-box input::placeholder {
    color: var(--imba-text-secondary) !important;
}

.vector-search-box button {
    background-color: var(--imba-accent) !important;
    border: none !important;
    border-radius: 0 4px 4px 0 !important;
}

.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited {
    color: var(--imba-accent) !important;
    border-bottom: 2px solid var(--imba-accent) !important;
}

.vector-menu-tabs li a {
    color: var(--imba-text-secondary) !important;
}

.vector-menu-tabs li a:hover {
    color: var(--imba-text) !important;
}

/* --- Навигация (Сайдбар) --- */
.vector-sidebar {
    background-color: var(--imba-dark) !important;
    border-right: 1px solid var(--imba-gray) !important;
}

.vector-sidebar h3 {
    color: var(--imba-text) !important;
    border-bottom: 1px solid var(--imba-gray) !important;
}

.vector-menu-portal ul li a {
    color: var(--imba-text-secondary) !important;
}

.vector-menu-portal ul li a:hover {
    color: var(--imba-accent) !important;
    background-color: transparent !important;
}

/* --- Контент --- */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
    color: var(--imba-text) !important;
    border-bottom: 1px solid var(--imba-gray) !important;
}

.mw-body a {
    color: var(--imba-accent) !important;
}

.mw-body a:visited {
    color: var(--imba-accent-hover) !important;
}

.mw-body a:hover {
    color: var(--imba-text) !important;
    text-decoration: underline;
}

/* --- Код и преформатированный текст --- */
pre, code {
    background-color: var(--imba-gray) !important;
    border: 1px solid #444 !important;
    color: #f8f8f2 !important; /* Более светлый цвет для кода */
    border-radius: 4px;
}

/* --- Таблицы --- */
.mw-body table {
    background-color: var(--imba-dark) !important;
}

.mw-body table th {
    background-color: var(--imba-gray) !important;
    color: var(--imba-text) !important;
    border: 1px solid #444 !important;
}

.mw-body table td {
    border: 1px solid #444 !important;
    color: var(--imba-text-secondary) !important;
}

/* --- Подвал (Footer) --- */
.mw-footer {
    background-color: var(--imba-dark) !important;
    border-top: 1px solid var(--imba-gray) !important;
    color: var(--imba-text-secondary) !important;
}

.mw-footer a {
    color: var(--imba-text-secondary) !important;
}

.mw-footer a:hover {
    color: var(--imba-accent) !important;
}

/* --- Кнопки --- */
.mw-body button,
.mw-body .oo-ui-buttonElement-button {
    background-color: var(--imba-gray) !important;
    color: var(--imba-text) !important;
    border: 1px solid #444 !important;
    border-radius: 4px !important;
}

.mw-body button:hover,
.mw-body .oo-ui-buttonElement-button:hover {
    background-color: var(--imba-accent) !important;
    color: var(--imba-dark) !important;
}