Dark mode button colors

I’ve tried to ignore this but it just keeps tripping me up.
I have dark mode enabled and this is what the filter bar looks like for Sites:

The main thing I want to point out is how the “Filter Sites” button has a black color that almost blends into the background, and the “Reset” button appears to have what would be the primary color button.
This is reversed, in my opinion.

Whenever I set a filter or two and want to filter it, every single time I click the green button thinking it’s the primary button to filter the list, only for it to reset everything instead of filter it. Then I have to remember, the actual filter button is the black one and do it over again.

This needs to be swapped if you ask me. Make the primary color button the one that actually filters things, and make the reset button a secondary or muted color.

I don’t know if it’s only me, but these colors should be swapped. Like this:

better color

That goes for anywhere else in the whole UX where it seems like the secondary and destructive buttons are using a primary color scheme. It don’t know if this happens elsewhere, but it trips me up every day in this spot.

It’s the same way in all the light color themes too. The primary button seems to be using a secondary muted color and the desctrutive/reset/secondary buttons use the primary color.

It’s starting to drive me nuts, haha

PS: I know I can make my own theme by editing the CSS file, but in this case the styles are set with generic classes like “basic” and “green”. I don’t want to restyle these classes globally, I want to restyle the contextual or symantic style, i.e. “primary button” or “secondary button” or just these buttons specifically, which is not how your classes work.
I can target them, and I did, but I still wanted to report this oddity. Primary should be primary, secondary/reset/destructive/cancel/close should be muted or otherwise.

2 Likes

Hey @zackw

Thanks for pointing this out to us.

This will be addressed in a future version of the Dashboard.

In the meantime, we’d suggest swapping these colors with CSS, using our Custom Dashboard extension.

2 Likes

Thanks!

For now I changed the color just with a custom CSS file.

1 Like

Blockquote This will be addressed in a future version of the Dashboard.

Exciting! Does this mean there is a visual overhaul on the way? Our team was considering spending some time on a custom design as suggested above, but if a new dashboard is coming soon we will hold off :slight_smile:

Hey @Shadician there will not be any major design changes in version 5.1, the last major design changes were in version 5.0. If interested you can read more about that release here - https://mainwp.com/mainwp-version-5-by-the-numbers-a-monumental-update/

If you’d like to customize a theme to your liking check this kb article How to change the style of your MainWP Dashboard - MainWP Knowledgebase

Thanks for the reply. Just to confirm though, even without major design changes, is there a plan to adjust the Reset Filters button (and similar dark mode issues) or not?

Thank you

Yes, we plan to adjust the Reset Filters buttons in v5.1.

If you spot any other issues with the Dark Theme, please do let us know.

2 Likes