====== Темне оформлення правилами ======

Це **старий спосіб** зробити домен темним: перебити правила движка по одному, своїм css. Він і далі працює, але тим самим займається [[uk:admin_main:design|тема домену]] — вибором зі списку, без жодного рядка css.

> **Спершу спробуйте тему.** «Домен» → «Дизайн» → «Налаштування домену» → «Тема оформлення»: **Dark Purple** або **Dark Radix** дають темний домен цілком — і сайт, і гру, і день, і ніч. Усе, що нижче, тема робить без вас.

Якщо своя темна гама все-таки потрібна, починати варто не з цього списку селекторів, а з **токенів**: задати ''--qeng-body-bg'', ''--qeng-surface-bg'' і ще кілька імен палітри — і колір розійдеться по правилах движка сам. Список відкривається в студії посиланням «Токени теми» поряд із css-слотом.

===== Приклад на правилах =====

Нижче — той самий старий приклад. Він написаний під колишній устрій сторінок, і частина селекторів у ньому може вже нічого не знаходити.

Копіюється в блок **CSS** на екрані «Сайт» у розділі «Дизайн», далі «Зберегти».

**Збережіть свої старі налаштування, щоб можна було до них повернутися** — або скористайтеся кнопкою «Історія» в студії: вона пам'ятає 30 останніх збережень.

<code>
/*Налаштування фону по краях*/
body {
  background-color:#000;
  background-image: url("https://imagizer.imageshack.com/img924/7545/DlMobT.png"); /* фонова затайлена картинка */
  background-repeat: repeat-x repeat-y;
  color:#FFF;
}

/* Адмінські панельки */
.admin-control {
  background-color:#003;
}

/* Сторінки, на яких багато тексту, без вкладок, які згортаються, наприклад, Моніторинг */
.page-container {
  background-color:#111;
  color:#FFE;
}
.page-container a{
  color:#EEF;
}

.table {
  color:#FFF;
}

/* Вкладки, які згортаються */
.sp-head, .sp-wrap {
  background-color:#555;
  color:#CCC;
}
.sp-wrap {
  box-shadow: 5px 5px 5px #113;
}
.sp-body .sp-wrap {
    box-shadow: 3px 3px 3px #113;
}
.sp-body {
  background-color:#111;
  color:#FFF;
}
.out_game_controls {
  background-color:#222; /* Фон під кнопками керування грою */
  color:#FFF;
}
.sp-wrap a {
  color:#FFE; /* колір шрифту ID гри */
}

/* Вкладки активних ігор, які згортаються */
.game.active .sp-wrap {
  background-color:#665; /* колір заголовку */
}
.game.active .sp-wrap .sp-head{
  color:#FFF;  /* колір шрифта назви гри */
}
.game.active .sp-wrap .sp-head a{
  color:#FFF; /* колір шрифта ID гри */
}

/* Іноді зустрічається, наприклад, перелік сезонів у рейтингу */
.list-group-item {
  border: 1px solid #CCC;
  border: 1px solid rgba(255,255,255,.125);
  background-color:#111;
  color:#FFE;
}

</code>