CSS is breaking ability to add dark theme

dev
1

I’m struggling to add a dark theme on a production forum. I’m not sure why, but the site keeps certain elements white. I spun up a test Discourse and cannot recreate, but it looks like this on the production forum after enabling the dark theme:

image
image1360×305 19.4 KB

CSS. Click to see

.page-not-found-search { display: none; }
.hamburger-panel ul.category-links li.subcategory {
display: none;
}
img[src*=‘#left’] {
float: left;
}
img[src*=‘#right’] {
float: right;
}
img[src*=‘#center’] {
display: block;
margin: auto;
}
.d-header-icons .icon:hover, .d-header-icons .icon:focus {
background-color: white;
}

.d-header-icons .d-icon {
color: white;
}

.d-header-icons .icon:hover .d-icon, .d-header-icons .icon:focus .d-icon {
color: #0082c9;
}

.drop-down-mode .d-header-icons .active .icon .d-icon {
color: #0082c9;
}

/* Don’t show subcategories in category list */
.category-list .subcategories {
display: none;
}

Afaik the issue is with the CSS, so I’m wondering about how I can change it. Thanks for any guidance.

2 Likes
2

Are any other themes or components at play?

Are you changing just the color scheme or are you trying to make changes via css?

Can you share the url?

2 Likes
3

image

I have been messing with the color scheme so far. I exported the existing css (linked above) and theme settings to to test on my own home discourse, but ran into no such troubles.

afaik I signed away that privilege in order to get this level of access. :heart:

1 Like
4

I figured it out. There were additonal custom css values written into a custom component, which I thought was a default. Removing that component resolved everything and dark theme works perfectly.

Thanks for guidance @pfaffman as I know everyone has busy lives. :heart:

1 Like
5

I’m guessing it was “Make banner white” !!!

6

It was “Font” :wink:

1 Like
7

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.