Dark mode different image?

[Teodor]

Please check the following docs:

Using Bootstrap 5 Dark Mode

Intro Bootstrap now embraces color modes, introducing the much-awaited dark mode. With version 5.3 you have the flexibility to integrate a custom color mode switcher. Our support extends to both light mode (the default setting) and the newly introduced dark mode. We developed a special Bootstrap Theme Switch component that you can add on your pages and allow users to switch between light, dark or auto mode. Switch Themes We designed a pretty simple page, which includes a navbar, some text co…

you can see how to show/hide elements on the page based on the active theme in Wappler 6.7.1

[franse]

@George

the theme manager data settings indeed stays on “auto” when the auto mode is on and doesn’t reflect the current selection. @patrick should fix this.

Another bump for this

[franse]

One more please

[Teodor]

@franse

Another bump for this

Can you explain what is the issue and what are you trying to achieve?

[franse]

@Teodor thanks:

When you set an image A for light mode, and another B for dark mode:

Image A appears when the theme selected is "auto" but the user is in dark mode (by system)

So the user will see all the dark mode except this condition

[Teodor]

How do you detect the active theme then?
The component returns the active theme which you can use:

active - returns the currently active theme on the page
detected - returns the detected system theme
theme - the theme selected in the theme switch component (auto, light or dark)

[franse]

Oh sorry I was pointing ".theme" instead of ".active"

Thanks @Teodor, my bad