Automatic Dark Mode color scheme switching

That’s great news! Thank you so much! You’re awesome!

3 Likes

this only seems to be working with logged-in users for me

logged out users should be defaulted on light mode when system is on light mode but instead are defaulted on dark mode and doesn’t switch to light mode when toggled on/off

5 Likes

Hmm can you repro the above @pmusaraj ?

4 Likes

I cannot reproduce this report. Tested on a new self-hosted site, skipped the wizard, and the default color scheme is Light, and the scheme flips to dark when I switch my device to dark mode.

Maybe you made changes to the default color scheme in the wizard? What do you see under Color Palette when you go to Admin > Customize > Themes > Default?

2 Likes

this is what I see

2 Likes

even though my default theme is light when you visit the site (logged out system on light mode) it appears dark mode

2 Likes

Is your browser set to dark theme?

2 Likes

Can you provide the URL to the site so I can test it as an anonymous user?

2 Likes

No, as it works on light when logged in and when logged out goes to dark same browser

Sure the link is LGBTChat - A safe space for LGBTQ+ people! (lgbtchatmc.com)

4 Likes

That is very strange, the base color definitions on your site are returning the dark colors, which is strange because the base color scheme is harcoded as the light one.

You can try rebuilding, and if that doesn’t work, try creating a new Light color scheme and use that in your theme.

7 Likes

After running a rebuild, this now works as expected! Thank you for your help @pmusaraj :blue_heart:

5 Likes

Hi there, thanks for an awesome addition of auto dark mode for the latest discourse install… kudos to the maintainers :clap:t2:

However, I did notice that in Safari mobile browser running on latest iOS 15 (of my iPhone 12) , the notch area still stays light / white… (at meta.discourse.org the selected Dark theme does cover the notch as well, but I suspect that is a different implementation than the auto dark theme right?)

Good news is that it works fully on Chrome mobile browser in iOS 15 though…

Safari - notch area is still light example at try.discourse.org

Chrome - notch area is dark :white_check_mark::

Safari - notch area is dark at meta.discourse.org when choosing “Dark” mode:

cc @pmusaraj

Thanks!

5 Likes

Anyway we can set it enable by default for installed site? Would re run the install wizard work?

2 Likes

For an existing site, you can look for the site setting mentioned in the OP, default dark mode color scheme id and pick a color scheme there.

7 Likes

5 posts were split to a new topic: Unexpected Default Dark

On foodtalkcentral.com I don’t find a default dark mode color setting and the only choice for default dark mode color scheme id is None.

3 Likes

Maybe another admin on your site has removed all color schemes under Admin > Customize > Colors? If you see nothing there, you can create new schemes using the “+ New” button.

3 Likes

It could be a nice addition to add color palette creations/deletions entries in /admin/logs/staff_action_logs so we can keep track of this, as we do when we modify other themes or components’ settings.
Unless there’s already a way to know that I’m not aware of!

3 Likes

There is a way for use dark selector within CSS to modify specific items on dark mode?

Secondary color looks weird in our palette and a simple fix could be use a selector but I don’t see that Discourse uses something like that into dark mode.

Meanwhile I just removed the dark/light button because it’s beter on auto. Thanks!

1 Like

hey @matenauta :slight_smile:

I’m not 100% sure I understand your request, but could this help?

2 Likes