dark.red.theme.for.mangalib by bladeevich

/* ==UserStyle==
@name           Dark Theme For MangaLib
@namespace      USO Archive
@author         Trashentator
@description    `Простая тёмная тема для сайта MangaLib. Использовать совместно с тёмной темой для читалки.В процессе использовались пять цветов:1) основной, он же самый тёмный;2) второй, желаемый; используется в большинстве случаев на заголовках;3) третий, светлее второго, множество вариаций (за счёт прозрачности); основной текст на сайте;4) четвёртый, для прочего текста на сайте;5) особый цвет, неполная альтернатива зелёному: ники в чате, комментариях и на форуме, звёзды рейтинга, загрузочная полоса и т.д.`
@version        20190520.18.28
@license        NO-REDISTRIBUTION
@preprocessor   uso
==/UserStyle== */
@-moz-document url-prefix("https://mangalib.me") {

/**
*  @Author: Trashentator
*  @Name: Dark Manga Style
*  @Version: 1.04
*  @Page: https://mangalib.me/user/22828
*
*
*
* Косяки со стрелками в разделе УВЕДОМЛЕНИЯ.
* Траблы с быстрым поиском манги.
* Цвет текста "тема" и "от" на форуме.
* Один значок на две кнопки ("Сообщить об ошибке" и "Правила чата").
* В принципе, не критично, но выглядит не очень.
* Остаётся проблема с рамками.
*/
:root {
    /*** Основной цвет фона ***/
    --main-bg-color: rgb(15, 15, 15);

    /*** Основной второй цвет ***/
    --main-two-color: rgb(200, 0, 0);

    /*** Основной третий цвет ***/
    --main-three-color: rgba(255, 255, 255, .2);

    /*** Третий цвет с прозрачностью 0.2 ***/
    --main-three-opas: rgba(255, 255, 255, .2);

    /*** Третий цвет с прозрачностью 0.4 ***/
    --main-three-oopas: rgba(255, 255, 255, .2);

    /*** Третий цвет с прозрачностью 0.75 ***/
    --main-three-ooopas: rgb(20, 20, 20);

    /*** Основной четвёртый цвет ***/
    --main-four-color: rgb(250, 0, 0);

    /*** Бонусный цвет (альтернатива зелёному) ***/
    --another-green-color: rgb(50, 200, 50);
}

/*** К СКРИПТУ ***/
._emanon-ref {
    color: var(--another-green-color)!important;
}

/*** ГЛАВНАЯ СТРАНИЦА ***/
body {
    background-color: var(--main-bg-color);
    color: var(--main-three-color);
}

.link,
a {
    color: var(--main-two-color);
}

.fa.fa-rss-square {
    color: var(--main-two-color);
}

/*** ИЗМЕНЕНИЕ ЦВЕТА PLACEHOLDER ***/
::-webkit-input-placeholder {
    color: var(--main-bg-color);
}

.empty {
    border: 2px dashed var(--main-three-color);
    border-radius: 4px;
    color: var(--main-three-ooopas);
}


/*** РАМКИ ***/
.section__body {
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .1), 0 0 0 1px var(--main-two-color);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .1), 0 0 0 1px var(--main-two-color);
}


/*** ШАПКА ***/
.header {
    background: var(--main-bg-color);
}

/*** ПАНЕЛЬ УПРАВЛЕНИЯ СВЕРХУ ***/
.header-menu .dropdown_active {
    background: var(--main-three-ooopas)!important;
    color: var(--main-bg-color)!important;
}

.menu__item:active,
.menu__item:focus,
.menu__item:hover,
.menu__item_active {
    color: var(--main-bg-color);
    font-weight: bold;
}

.menu__item:before {
    background-color: var(--main-two-color);
}

.menu.header-dropdown {
    background: var(--main-three-ooopas);
}

.tippy-tooltip.dropdown-theme {
    color: var(--main-bg-color);
    background-color: var(--main-three-ooopas);
}

/*** КАРАНДАШИК ***/
.header-button__icon.dropdown_active {
    color: var(--main-two-color)!important;
}

.menu__divider {
    height: 1px;
    margin: 5px 0;
    background-color: var(--main-two-color);
    overflow: hidden;
}

.tippy-tooltip.dropdown-theme {
    color: var(--main-bg-color);
    padding: 0;
    background-color: var(--main-two-color);
    border-radius: 2px;
    text-align: left;
    pointer-events: auto;
}

/*** УВЕДОМЛЕНИЯ ***/
.notify__footer,
.notify__header {
    background: var(--main-three-opas);
}

.notify__header {
    border-bottom: 1px solid var(--main-two-color);
}

.notify__title {
    color: var(--main-bg-color);
}

.notify__footer-btn {
    color: var(--main-bg-color);
}

.notify__read-all:hover {
    color: var(--main-two-color);
}

.notify__footer-btn:active,
.notify__footer-btn:focus,
.notify__footer-btn:hover {
    color: var(--main-two-color);
}

.notify__read-all {
    color: var(--main-bg-color);
}

.notify__row + .notify__row,
.notify__footer {
    border-top: 1px solid var(--main-two-color);
}


/*** ОБНОВЛЕНИЯ ПОПУЛЯРНОЙ МАНГИ ***/
.page__title {
    color: var(--main-two-color);
}

.hot-manga-item:hover .hot-manga-item__caption {
    background: var(--main-three-color);
}
.page__title:after {
    content: "";
    display: block;
    width: 100px;
    height: 1px;
    background: var(--main-two-color);
    margin: .3em 0 .5em;
}

.section__body {
    background-color: var(--main-bg-color);
}

.hot-manga-item {
    border: 1px solid var(--main-two-color);
}

/*** ВЕРХНЯЯ ПОЛОСА ***/
.header__inner {
    background-color: var(--main-bg-color);
}

/*** ПОСЛЕДНИЕ НОВОСТИ | ПОСЛЕДНИЕ ТЕМЫ ФОРУМА ***/
.link:hover,
a:hover {
    color: var(--main-two-color);
    text-decoration: underline;
}

.short-news-item__title a,
.short-news-item__info {
    color: var(--main-four-color);
}

.short-news-item__title:before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 3px;
    vertical-align: middle;
    background: var(--main-four-color);
    border-radius: 50%;
}

.short-news__more {
    color: var(--main-four-color);
    font-size: 14px;
    margin-top: 5px;
}


/*** ЖАНРЫ ***/
.aside__title-inner {
    padding: 12px 10px 11px;
    margin-bottom: -1px;
    display: block;
    border-left: 7px solid var(--main-bg-color);
}

.aside__title {
    color: var(--main-two-color);
    border-bottom: 1px solid var(--main-four-color);
}

.aside__panel {
    background: var(--main-bg-color);
}

.tag-item {
    color: var(--main-bg-color);
    background-color: var(--main-four-color);
}

.tag-item:hover,
.tags-more:hover {
    color: var(--main-two-color);
}

.tags-more {
    color: var(--main-four-color);
}

.updates__header {
    padding: 0 5px 5px;
    margin-bottom: 2px;
    border-bottom: 1px solid var(--main-two-color);
}

/*** НОВАЯ МАНГА ***/
.side-manga-item:hover,
.similar-item:hover {
    background: var(--main-bg-color);
}
.side-manga-item__inner:hover {
    background: var(--main-bg-color);
}

.side-manga-item:hover h3,
.similar-item:hover h3 {
    color: var(--another-green-color);
}

/*** ПОПУЛЯРНАЯ МАНГА ***/
.side-manga-item__body h3,
.similar-item__body h3 {
    font-size: 15px;
    color: var(--main-two-color);
}

.side-manga-item__inner,
.similar-item__inner {
    border-bottom: 1px solid var(--main-four-color);
}

/*** ПОСЛЕДНИЕ КОММЕНТАРИИ ***/
.last-comment__username {
    color: var(--main-two-color);
}

/*** ИКОНКА ЧАТА ***/
.chat-wrap__title {
    background: var(--main-two-color);
    color: var(--main-bg-color);
    border: 2px solid var(--main-two-color);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

/*** ЧАТ ***/
.chat-wrap__head {
    color: var(--main-four-color);
    background: var(--main-two-color);
}

.chat-item__username {
    color: var(--another-green-color);
}

.chat-item__username:hover {
    color: var(--main-three-color);
}

.chat-item,
.chat__items {
    background-color: var(--main-bg-color);
}

.chat-item__date {
    color: var(--main-three-oopas);
}

.chat-item__remove {
    color: var(--another-green-color);
}

.chat-item__reply {
    color: var(--main-two-color);
}
.item__reply {
    color: var(--main-three-color);
}
.chat-item__message span {
    color: var(--main-three-ooopas);
    background: var(--main-three-opas);
}

textarea {
    background-color: var(--main-bg-color);
    color: var(--main-three-color);
}

.chat-send__area {
    background-color: var(--main-bg-color);
    color: var(--main-three-color);
}

.chat-send__button {
    color: var(--main-two-color);
}

.chat-send {
    border-top: 1px solid var(--main-bg-color);
}

.chat-item__message a {
    color: var(--main-three-color);
    border-bottom: 1px dashed var(--main-three-color);
}

.chat-item__message a:hover {
    color: var(--main-two-color);
}

.chat-item + .chat-item {
    border-top: 1px solid var(--main-two-color);
}

.fa-refresh:before,
.chat-wrap__resizer svg,
.chat-wrap__pin.fa.fa-fw.fa-thumb-tack:before,
.fa.fa-exclamation-triangle:before,
.fa.fa-fw.fa-cog:before,
.fa.fa-fw.fa-close:before {
    color: var(--main-bg-color);
}

.chat-wrap__resizer svg {
    fill: var(--main-bg-color);
}

.chat-item__message {
    color: var(--main-three-ooopas);
}

/*** ПОСЛЕДНИЕ ОБНОВЛЕНИЯ ***/
.link-default {
    color: var(--main-two-color);
}

.updates__name_rus a {
    color: var(--main-three-color);
}

.updates__date,
.updates__chapter-name,
.updates__more {
    color: var(--main-four-color);
}

.updates__name_rus a:hover {
    color: var(--another-green-color);
}

.updates__more:hover {
    color: var(--main-two-color);
}

.updates__chapter:nth-child(odd) {
    background: var(--main-three-opas);
}

.updates__chapter:hover .updates__chapter-vol,
.updates__chapter-vol {
    color: var(--main-two-color);
}

.updates__chapter:hover {
    background: var(--main-three-oopas);
    color: var(--main-bg-color);
}

.m-label_warning {
    background: var(--main-two-color);
}

.m-label_success {
    background: var(--another-green-color);
}



/*** ПРОФИЛЬ ПОЛЬЗОВАТЕЛЯ ***/
.user__marker_online {
    color: var(--another-green-color);
}

.button.button_sm.button_green {
    background: var(--another-green-color);
}

.bookmark-box__caption {
    border-top: 5px solid var(--main-two-color);
}

.bo...