There doesn’t seem to be any specific class currently. I found this but it doesn’t work since the theme’s ID is the same for the dark and light mode (which is defined the color scheme, I guess). I suppose a short script could help? And, maybe add this to Discourse’s core?

If you would like, there is a sort of hidden workaround. You can create a folder and only add in an about.json file in it. I actually did this to create a solarized light color scheme, because I wanted to specify my own variants, rather than rely on the built in color functions. Here is the actua…

Would you mind explaining why you need specific classes added to the body for dark or light mode? Does this core feature not allow what you are needing? [圖片] Automatic Dark Mode color scheme switching megaphoneAnnouncements You can now set up your Discourse s…

The staff of the forum I’m migrating doesn’t like a specific generated color variable (--tertiary-very-low) that makes this specific brownish color: [image] They would like to tweak it, and it seems I can’t really change it since there it’s generated AND is no parent-specific class for the dark m…

We (sorry, I’ll say we as I’m with @Canapin doing the tweaks on our forum) made a dark theme using the preset called “Café crème” in the french version of Discourse (“coffee” I assume) and we just changed the color of the :heart: to red instead of brown. The strange thing with this theme is that th…

Using .cooked a as a css target should work for you to set a custom color for these links. While our core system now allows the use of dark / light color scheme choices for their corresponding modes, you should also be able to use the css media query for dark/light modes like so: [圖片] pre…

@media (prefers-color-scheme: dark) { .cooked a, .d-editor-preview a { color: var(--primary-low-mid); } } Did the work. Thank you!

Oops. No, it didn’t work. Please correct me if I’m wrong. prefers-color-scheme is based on the device’s preference, not the actual selected Discoure’s theme? On my Windows device, I set a Dark theme. So websites that use my device’s preference will show, if possible, a dark theme. But on my foru…

Sorry I misunderstood you to mean, the system setting of dark mode, triggering dark mode on the forum. So are you personally using the light color scheme, but your users are using the dark color scheme? The previous screenshot showed the dark color scheme in action, but your recent reply states yo…

Hi, sorry, yeah it’s not clear, especially since I was talking about two things of the same kind but on different color schemes. Also, it was a bit confusing for me. So my question would be: On Discourse, how do I know which color scheme is used, regardless of the device’s dark/light mode preferenc…

Thanks for clarifying, I understand now. [圖片] Canapin: So: how do I know, in the HTML code of Discourse, if I’m currently using a Light or a Dark color scheme? I didn’t find any parent class like “light-color-scheme” or “dark-color-scheme”. So I can’t differentiate/target specific color schemes…

[圖片] jordan.vidrine: is the reason being that you dislike the color our color functions generate for --tertiary on your currently selected dark scheme? Yup, exactly :slight_smile: [圖片] jordan.vidrine: What would you like to achieve through a body class that you feel like you are not able…

如何为深色（或浅色）模式添加特定的 body 类？

支持

jordan.vidrine (Jordan Vidrine) 2022年三月4日 15:02 2

您介意解释一下为什么需要在 body 中添加特定的类来支持 dark 或 light 模式吗？

这个核心功能不能满足您的需求吗？

話題		回覆	觀看
Color definitions for more than light/dark color schemes Support	1	621	2024年一月6日
使用discourse 内置的深浅主题切换，在discourse中如何写dark下的样式,目前没有看到.dark样式 Support	2	171	2025年八月19日
How to make the automatic dark theme the same as the selected dark theme? Support dark-theme , dark-mode-toggle	10	721	2024年十二月14日
Is this still the solution for checking for dark mode? Development	4	224	2025年二月20日
How to change css item based on dark or light mode? Development	11	2522	2023年六月18日

如何为深色（或浅色）模式添加特定的 body 类？

相關主題