Dark/Light Mode Toggle

[Andrew_Rowe]

Thank you for your help
I am using this Dark/Light Mode Toggle component

@Moin

Is your question about this theme component that adds a toggle to switch to dark mode, or detecting a dark color palette in general?

My question is about detecting which mode I am in and switch the background image so I can have one image for light mode and another for dark mode.

I tried to follow along with the link you posted and also this one

Different CSS changes for different color schemes

If I understand the issue well, there’s a specific thing to do for this. I’ve been working on a guide about this, but I’m struggling a bit to merge information so it’s clear enough to directly use the information in a theme, but still explains underlying technical stuff. To explain how to do it the most clearly as I can… I suggest you create a theme locally (using Install the Discourse Theme CLI console app to help you build themes will help). Then, create a common/color_definitions.scss …

which goes into a little more detail but I did not succeed. I tried adding image files(JPGs) $bg-light and $bg-dark to my theme

I also tried adding a color_definitions.scss stylesheet to my theme with the code in that post

$bg: url(dark-light-choose($bg-light, $bg-dark));

:root {
  --custom-bg: #{$bg};
}

I also tried creating a theme on github

GitHub - MyRaceData/WebsiteTheme

like I said, sorry about being a little lost
If I should start a new topic let me know and in what category to put it
Thanks for your help