Skip to content

MangaRead (Darker) by zaltroscrown

Screenshot of MangaRead (Darker)

Details

Authorzaltroscrown

LicenseNo License

Categoryhttps://www.mangaread.org/

Created

Updated

Size25 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

An even darker theme for MangaRead website by Zaltros Crown.
Enable Original dark theme for better compatibility.

Notes

If you encounter anything you don’t like and would like to have changed or would like for me to make a dark theme for a different site please contact me on zaltros.work@gmail.com or over on Discord - zaltroscrownwork

The dark theme is still a work in progress and will get updated over time as I get time to work on it.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name         MangaRead (Darker)
@version      20240907.08.55
@namespace    https://userstyles.world/user/zaltroscrown
@description  An even darker theme for MangaRead website by Zaltros Crown.Enable Original dark theme for better compatibility.
@author       zaltroscrown
@license      No License
==/UserStyle== */

@-moz-document url-prefix("https://www.mangaread.org/") {
:root{
    --bg1: #050505;
    --bg2: #090909;
    --bg3: #151515;
    --bg4: #222;
    --scroll: #555;
    --scroll-blank: #151515;
    --border: #444;
    --border-extra: #888;
    --ora: #fd5e1e;
    --fg-extra: #fff;
    --fg: #b9b9b9;
    --fg-dull: #636363;
    --button-hover: #333;
    --blu: #0165b9;
    }

html {
    scrollbar-color: var(--scroll) var(--scroll-blank)!important;
    scrollbar-width: thin!important;
    }
body.text-ui-light .body-wrap, .body-wrap{
    background: url(https://chapmanganato.to/themes/hm/images/background-black.png)!important;
}

/*------------------------------------------HEADER------------------------------------------*/
.site-header .main-navigation.style-1{ /*Top background*/
    background: linear-gradient(to right, var(--bg3) 60%, var(--ora))!important;
}
.site-header .c-sub-header-nav.with-border{ /*Genre bar background*/
    background: var(--bg2)!important;
    border-color: var(--border)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .sub-nav_content .sub-nav_list li:hover > a{ /*Genre bar options*/
    color: var(--fg)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .sub-nav_content .sub-nav_list > li.menu-item-has-children > ul.sub-menu{
    background: var(--bg3)!important;
    border-top: 1px solid var(--border)!important;
    border-bottom: 1px solid var(--border)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .btn-active-modal{
    background: var(--bg3)!important;
    border-radius: 20px!important;
    border: 1px solid var(--border-extra)!important;
    color: var(--fg)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .btn-active-modal:hover{
    background: var(--button-hover)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .c-user_item .c-user_menu{ /*Dropdown when hovering on profile*/
    background: var(--bg3)!important;
    border-color: var(--border)!important;
    border-top: 1px solid var(--border)!important;
    border-bottom: 1px solid var(--border)!important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .c-user_item .c-user_menu a:hover{
    color: var(--fg)!important;
}
body.text-ui-light .site-header .c-header__top .search-main-menu, .site-header .c-header__top .search-main-menu{ /*Search background*/
    background: var(--bg3)!important;
}
.site-header .search-main-menu form input[type="text"]{ /*Search box*/
    border-bottom-left-radius: 10px!important;
    border-top-left-radius: 10px!important;
    border-top-right-radius: 10px!important;
    border-bottom-right-radius: 10px!important;
    background: var(--bg2)!important;
    border-color: var(--border)!important;
    color: var(--fg)!important;
}
.site-header .search-main-menu form input[type="submit"]{
    background: var(--bg4)!important;
    border-top-right-radius: 10px!important;
    border-bottom-right-radius: 10px!important;
    border: 1px solid var(--border-extra);
    color: var(--fg-extra)!important;      
}
.site-header .search-main-menu form input[type="submit"]:hover{
    background: var(--fg)!important;
    color: var(--bg1)!important;   
}
.site-header .c-header__top .manga-autocomplete.ui-autocomplete > li:not(.last-child), .site-header .c-header__top .manga-autocomplete.ui-autocomplet{
    background: var(--bg3)!important;
    border-color: var(--border)!important;
    color: var(--fg)!important;
    box-shadow: 1px 1px 3pc var(--bg2)!important;
}
.site-header .c-header__top .manga-autocomplete.ui-autocomplete > li:not(.last-child):hover, .site-header .c-header__top .manga-autocomplete.ui-autocomplet:hover{
    background: var(--button-hover)!important;
}
.site-header .main-navigation .search-navigation .menu-search .open-search-main-menu{
    background: var(--bg3)!important;
    color: var(--fg-extra)!important;
    border: 1px solid var(--ora)!important;
}
.site-header .main-navigation .search-navigation .menu-search .open-search-main-menu:hover{
    background: var(--button-hover)!important;
}
/*------------------------------------------Log In------------------------------------------*/
body.modal-open .modal .modal-dialog{
    background: transparent!important;
}
.close{
    color: var(--fg-extra)!important;
}
#login > h3:nth-child(1) > a:nth-child(1){
    color: var(--fg)!important;
}
body.modal-open .modal .modal-content .modal-body .login label{
    color: var(--fg)!important;
}
body.modal-open .modal .modal-content .modal-body .login input[type="text"], body.modal-open .modal .modal-content .modal-body .login input[type="password"]{
    background: var(--bg3)!important;
    border-color: var(--border-extra)!important;
    color: var(--fg)!important;
}
body.modal-open .modal .modal-content .modal-body .login .submit .wp-submit{
    background: var(--bg4)!important;
    border-radius: 10px!important;
    border: 1px solid var(--border-extra);
    color: var(--fg-extra)!important;      
}
body.modal-open .modal .modal-content .modal-body .login .submit .wp-submit:hover{
    background: var(--button-hover)!important;
    color: var(--fg-extra)!important;   
}
p.nav:nth-child(14) > a:nth-child(1), p.backtoblog:nth-child(15) > a:nth-child(1){
    color: var(--fg)!important;
}
p.nav:nth-child(14) > a:nth-child(1):hover, p.backtoblog:nth-child(15) > a:nth-child(1):hover{
    color: var(--fg-extra)!important;
}
/*------------------------------------------Main body------------------------------------------*/
body.text-ui-light .popular-slider .slider__container .slider__item .item__wrap, .popular-slider .slider__container .slider__item .item__wrap{ /*Background for scrolling mangas*/
    background: var(--bg3)!important;
}
.slider__container .slider__item .slider__content .slider__content_item .chapter-item .chapter a{ /*Chapter number buttons on scrolling mangas*/
    background: var(--bg3)!important;
    border-color: var(--border-extra)!important;
    color: var(--fg)!important;
}
.slider__container .slider__item .slider__content .slider__content_item .chapter-item .chapter a:hover{
    background: var(--button-hover)!important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .list-chapter .chapter-item .chapter, .widget.c-popular .popular-item-wrap .popular-content .chapter-item .chapter{ /*Manga chapter buttons*/
    background: var(--bg3)!important;
    border: 1px solid var(--border-extra)!important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .list-chapter .chapter-item .chapter a{ /*Text in manga chapter buttons*/
    color: var(--fg)!important;
}
.c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .list-chapter .chapter-item .chapter:hover, body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .list-chapter .chapter-item .chapter:hover{ /*Chapter number buttons in the latest manga updates*/
    background: var(--button-hover)!important;
}
.widget.c-popular .popular-item-wrap .popular-content .chapter-item .chapter:hover{ /*Chapter number buttons in the side boxes*/
    background: var(--button-hover)!important;
}
.widget.c-popular .widget-view-more{ /*"Here for more Popular Manga" button in the side boxes*/
    background: var(--bg3)!important;
    border-radius: 10px!important;
    border: 1px solid var(--border-extra)!important;
}
.widget.c-popular .widget-view-more:hover{
    background: var(--button-hover)!important;
}
body.text-ui-light .navigation-ajax .load-ajax, .navigation-ajax .load-ajax{ /*Load more button*/
    background: var(--bg3)!important;
    border-radius: 10px!important;
    border: 1px solid var(--border-extra)!important;
    color: var(--fg)!important;
}
body.text-ui-light .navigation-ajax .load-ajax:hover, .navigation-ajax .load-ajax:hover{
    background: var(--button-hover)!important;
}
.widget:not(.default):not(.background) > .c-widget-wrap{ /*Box on the side*/
    border-color: var(--border-extra)!important;
    border-radius: 20px!important;
}
.widget.c-popular .popular-item-wrap{ /*Deviding border in the box on the side*/
    border-color: var(--border-extra)!important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item{ /*Deviding border in latest manga updates*/
    border-color: var(--border-extra)!important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .rating .score{ /*Manga score*/
    color: var(--fg)!important;
}
.c-breadcrumb-wrapper{ /*Bar when in a main seciton*/
    background: var(--bg3)!important;
    border-top: 1px solid var(--border)!important;
    border-bottom: 1px solid var(--border)!important;
}
.tab-wrap .c-nav-tabs ul.c-tabs-content li a{ /*"Order by" options*/
    color: var(--fg)!important;
}
.tab-wrap .c-nav-tabs ul.c-tabs-content li a:hover{
    color: var(--fg-extra)!important;
}
.tab-wrap .c-nav-tabs ul.c-tabs-content li a::after{
    background: var(--fg-extra)!important;
}
.widget.c-released .released-item-wrap ul.list-released li a{ /*Year options*/
    color: var(--fg)!important;
}
.widget.c-released .released-item-wrap ul.list-released li a:hover{
    color: var(--fg-extra)!important;
}
.widget.c-released .released-search form [type="submit"]{
    background: var(--bg4)!important;
    border-radius: 20px!important;
    border: 1px solid var(--border-extra);
    color: var(--fg-extra)!important;      ...

Reviews

No reviews yet.