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

/* --- Основные цвета Nord --- */
:root {
  /* Polar Night */
  --nord0: #2e3440;
  --nord1: #3b4252;
  --nord2: #434c5e;
  --nord3: #4c566a;

  /* Snow Storm */
  --nord4: #d8dee9;
  --nord5: #e5e9f0;
  --nord6: #eceff4;

  /* Frost */
  --nord7: #8fbcbb;
  --nord8: #88c0d0;
  --nord9: #81a1c1;
  --nord10: #5e81ac;

  /* Aurora (Акцентные цвета) */
  --nord11: #bf616a; /* Красный */
  --nord12: #d08770; /* Оранжевый */
  --nord13: #ebcb8b; /* ЖЕЛТЫЙ (наш акцент) */
  --nord14: #a3be8c; /* Зеленый */
  --nord15: #b48ead; /* Фиолетовый */
}

/* --- Основной фон и текст --- */
/* Основной фон страницы */
.mw-page-container,
.mw-body,
#mw-content-container,
#mw-header-container,
#mw-content-wrapper,
#mw-panel,
footer,
#footer-info,
#mw-content {
  background-color: var(--nord0) !important; /* nord0 */
  color: var(--nord4) !important; /* nord4 */
}

/* Фон основного содержимого */
.mw-body-content {
  background-color: var(--nord1) !important; /* nord1 */
  color: var(--nord4) !important; /* nord4 */
  padding: 1em;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* --- Ссылки --- */
/* Основные ссылки */
a,
.mw-parser-output a,
.vector-menu-content-list .mw-list-item a,
.vector-menu-tabs .mw-list-item a,
.vector-menu-dropdown .mw-list-item a {
  color: var(--nord13) !important; /* ЖЕЛТЫЙ акцент */
  text-decoration: none;
}

/* Посещенные ссылки */
a:visited,
.mw-parser-output a:visited {
  color: var(--nord15) !important; /* nord15 - фиолетовый для посещенных */
}

/* Ссылки при наведении */
a:hover,
.mw-parser-output a:hover,
.vector-menu-content-list .mw-list-item a:hover,
.vector-menu-tabs .mw-list-item a:hover,
.vector-menu-dropdown .mw-list-item a:hover {
  color: var(--nord6) !important; /* nord6 - светло-серый */
  text-decoration: underline;
}

/* Активные/выбранные вкладки */
.vector-menu-tabs .mw-list-item.selected a,
.vector-menu-tabs .mw-list-item.selected a:visited {
  background-color: var(--nord2) !important; /* nord2 */
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  border-bottom: 2px solid var(--nord13) !important; /* ЖЕЛТЫЙ */
}

/* --- Заголовки --- */
h1, h2, h3, h4, h5, h6 {
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  border-bottom: 1px solid var(--nord3) !important; /* nord3 */
  padding-bottom: 0.3em;
}

/* --- Навигация и боковая панель --- */
/* Фон боковой панели */
#mw-panel {
  background-color: var(--nord1) !important; /* nord1 */
  color: var(--nord4) !important; /* nord4 */
}

/* Ссылки в боковой панели */
#mw-panel .mw-portlet h3,
#mw-panel .mw-portlet ul li a {
  color: var(--nord4) !important; /* nord4 */
}

#mw-panel .mw-portlet ul li a:hover {
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  background-color: var(--nord2) !important; /* nord2 */
}

/* --- Поиск --- */
/* Поле поиска */
#simpleSearch {
  background-color: var(--nord2) !important; /* nord2 */
  border: 1px solid var(--nord3) !important; /* nord3 */
}

#searchInput {
  background-color: transparent !important;
  color: var(--nord4) !important; /* nord4 */
  border: none !important;
}

/* Кнопка поиска */
#searchButton,
#mw-searchButton {
  background-color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  color: var(--nord0) !important; /* nord0 */
  border: 1px solid var(--nord3) !important; /* nord3 */
}
#searchButton:hover,
#mw-searchButton:hover {
  background-color: var(--nord14) !important; /* Зеленый при наведении */
}

/* --- Таблицы --- */
.wikitable {
  background-color: var(--nord1) !important; /* nord1 */
  color: var(--nord4) !important; /* nord4 */
  border: 1px solid var(--nord3) !important; /* nord3 */
}

.wikitable > * > tr > th {
  background-color: var(--nord2) !important; /* nord2 */
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  border: 1px solid var(--nord3) !important; /* nord3 */
}

.wikitable > * > tr > td {
  border: 1px solid var(--nord3) !important; /* nord3 */
}

/* --- Код --- */
.mw-code {
  background-color: var(--nord1) !important; /* nord1 */
  color: var(--nord4) !important; /* nord4 */
  border: 1px dashed var(--nord3) !important; /* nord3 */
}

/* --- Цитаты, блоки кода --- */
blockquote,
pre {
  background-color: var(--nord1) !important; /* nord1 */
  border-left: 4px solid var(--nord13) !important; /* ЖЕЛТЫЙ */
  color: var(--nord4) !important; /* nord4 */
  padding: 0.5em 1em;
  margin: 1em 0;
}

/* --- Сообщения MediaWiki --- */
/* Общие сообщения */
.mw-message-box {
  background-color: var(--nord1) !important; /* nord1 */
  border: 1px solid var(--nord3) !important; /* nord3 */
  color: var(--nord4) !important; /* nord4 */
}

/* Сообщения об ошибках */
.mw-message-box-error {
  border-left: 4px solid var(--nord11) !important; /* nord11 - красный */
  background-color: rgba(191, 97, 106, 0.1) !important;
}

/* Предупреждения */
.mw-message-box-warning {
  border-left: 4px solid var(--nord13) !important; /* nord13 - ЖЕЛТЫЙ */
  background-color: rgba(235, 203, 139, 0.1) !important;
}

/* --- Сноски (References) --- */
ol.references {
  font-size: 90%;
  margin-bottom: 0.5em;
  color: var(--nord5); /* nord5 - чуть светлее основного текста */
}

/* --- Навбоксы --- */
.navbox {
  background-color: var(--nord1) !important; /* nord1 */
  border: 1px solid var(--nord3) !important; /* nord3 */
  color: var(--nord4) !important; /* nord4 */
}

.navbox-title,
.navbox th {
  background-color: var(--nord2) !important; /* nord2 */
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
}

.navbox-subgroup .navbox-title,
.navbox-subgroup th {
  background-color: var(--nord3) !important; /* nord3 */
  color: var(--nord13) !important; /* ЖЕЛТЫЙ */
}

.navbox-even {
  background-color: var(--nord2) !important; /* nord2 */
}

/* --- Изображения --- */
/* Миниатюры */
.thumbinner {
  background-color: var(--nord1) !important; /* nord1 */
  border: 1px solid var(--nord3) !important; /* nord3 */
}

.thumbimage,
.thumbborder {
  border: 1px solid var(--nord3) !important; /* nord3 */
}

/* Подписи к изображениям */
.thumbcaption {
  color: var(--nord5) !important; /* nord5 */
}

/* --- Шрифты --- */
/* Используйте шрифты, которые хорошо читаются на темном фоне */
body {
  font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* --- Прочие элементы --- */
/* Линии */
hr {
  border: 0;
  height: 1px;
  background-color: var(--nord3); /* nord3 */
  margin: 1em 0;
}

/* --- Кнопки --- */
/* Общие стили кнопок (пример для .mw-ui-button) */
.mw-ui-button {
  background-color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  color: var(--nord0) !important; /* nord0 */
  border: 1px solid var(--nord3) !important; /* nord3 */
  border-radius: 4px;
  padding: 0.4em 0.8em;
  cursor: pointer;
}
.mw-ui-button:hover {
  background-color: var(--nord14) !important; /* Зеленый при наведении */
  color: var(--nord0) !important;
}

/* --- Формы --- */
textarea,
input[type="text"],
input[type="password"],
select {
  background-color: var(--nord2) !important; /* nord2 */
  color: var(--nord4) !important; /* nord4 */
  border: 1px solid var(--nord3) !important; /* nord3 */
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
select:focus {
  border-color: var(--nord13) !important; /* ЖЕЛТЫЙ */
  outline: none;
  box-shadow: 0 0 0 2px rgba(235, 203, 139, 0.3);
}

/* --- Diff (различия) --- */
.diff-addedline {
  background-color: rgba(163, 190, 140, 0.2) !important; /* nord14 зеленый, прозрачный */
  border-color: var(--nord14) !important;
}
.diff-deletedline {
  background-color: rgba(191, 97, 106, 0.2) !important; /* nord11 красный, прозрачный */
  border-color: var(--nord11) !important;
}
.diff-context {
  background-color: var(--nord1) !important;
  border-color: var(--nord3) !important;
}
.diffchange {
  background-color: rgba(235, 203, 139, 0.3) !important; /* nord13 желтый, прозрачный */
}