How to switch image based on dark or light mode

Dev
1

I would like to custom my banner image according to what mode the os is using now.
I tried to add this to my color_definitions.scss stylesheet:

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

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

And I tried use var(--custom-banner) in my regular stylesheet.

Everything looks good on pc and mobile phone. But the picture flickers on ipad. :disappointed_relieved:

Is there a way to fix the problem or should I try another way?

2

Hello :wave: Could you show an example? :slightly_smiling_face:

1 Like