HeaningBart
New member
- Apr 20, 2021
- 2
- 0
- 1
- Title for your fault: Issue w/ Dark Mode
- Fault Description: Madara WP Theme has a issue in some pages that even you switching to dark mode, some parts from the page won't change to their own dark theme
- What have you done to try to fix the issue: I was checking some pages which also had madara as wp theme and saw the following code in every page:
Code:
/* Fix for Dark theme */
body.text-ui-light .profile-manga, body.text-ui-light .c-breadcrumb-wrapper{
background-image: url("/wp-content/themes/madara/images/bg-search-dark.jpg") !important;
}
body.text-ui-light .c-search-header__wrapper{
background-image: url("/wp-content/themes/madara/images/bg-search-dark.jpg") !important;
}
body.text-ui-light.search .c-search-header__wrapper .search-content .btn-search-adv.collapsed, .c-btn.c-btn_style-2, body.search .c-search-header__wrapper .search-content .btn-search-adv{
border-color: #fff;
}
body.text-ui-light.search .c-search-header__wrapper .search-content .search-form .search-submit:hover{
background: #707070;
}
body.text-ui-light.search .c-search-header__wrapper .search-content .search-form .search-submit{
background: #303030;
}
body.text-ui-light h1, body.text-ui-light h2, body.text-ui-light h3, body.text-ui-light h4, body.text-ui-light h5, body.text-ui-light .h1, body.text-ui-light .h2, body.text-ui-light .h3, body.text-ui-light .h4, body.text-ui-light .h5, body.text-ui-light h6, body.text-ui-light .h6{
color: #fff;
}
body.text-ui-light .slider__content_item .post-title a {
color: #fff;
}
body.text-ui-light .slider__content_item .post-title a:hover {
opacity: 0.7;
}
body.text-ui-light .site-header .main-navigation.style-1 {
background: #303030;
}
body.text-ui-light .site-header .search-main-menu form input[type=submit]{
background: #303030;
border: 1px solid #d7d7d7;
}
body.text-ui-light .site-header .c-header__top form#blog-post-search.manga-search-form .loader-inner{
background: #303030;
border: 1px solid #d7d7d7;
border-left: 0px solid #d7d7d7;
}
body.text-ui-light .site-header .main-navigation .search-navigation .menu-search .open-search-main-menu {
color: #303030;
background: #808080;
}
body.text-ui-light .site-header .main-navigation .search-navigation .menu-search .open-search-main-menu:hover {
color: #303030;
background: #fff;
}
body.text-ui-light .site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .c-user_item .c-user_menu {
border-bottom-color: #303030;
}
a:hover {
color: #079ac7;
}
body.text-ui-light .site-header .c-sub-header-nav.with-border {
border-bottom: 1px solid #272727;
background: #242424;
}
body.text-ui-light .slider__content_item .post-on{
color: #fff;
}
body.text-ui-light .slider__content_item .chapter-item span a{
color: #eee;
}
body.text-ui-light li.active::before{
color: #888;
}
body.text-ui-light li.active:last-child{
color: #ddd;
}
/**
* Hero Slide
**/
.profile-manga {
background-image: url(/wp-content/themes/madara/images/bg-search.jpg);
}
.c-sidebar .c-top-sidebar .wp-manga {
background-image: none;
}
.c-sidebar {
padding: 10px 0 0px !important;
}
img.lazyloaded {
padding-top: 0px !important;
background-color: #f5f5f5;
background: rgba(245, 245, 245, 0.0)
}
/*
* Manga page
* */
body.text-ui-light .manga-action .action_detail span{
color: #ccc;
}
/*
* Hamburger mobile menu
*/
.menu_icon__open {
margin: 4px 0;
}
.menu_icon__open > span {
background-color: #079ac7;
height: 3px
}
.sub-nav_list .mobile-icon{
color: #fff;
}
/*
* Mobile menu
*/
.off-canvas{
background:#034d63ed;
}
.mobile-menu.menu-collapse.off-canvas.active{
background:#034d63ed;
}
.mobile-menu.menu-collapse.off-canvas.active .off-menu ul li>a{
color: #fff;
font-weight: 500;
}
.mobile-menu.menu-collapse.off-canvas.active .off-menu ul li>a:hover{
opacity: 0.5;
}
but the problem is that i don't understand anything about coding, so im not suret whether i should add this code to all my .php files or just those with dark mode problem
if someone can help me, thx a lot