Choosing between dark and light colors in a theme component

Support
1

I have a theme component with different colors for dark and light themes. I have been using dark-light-choose function to choose between the light and dark colors, but it is no longer working after the color variable update. Specifically dark-light-choose always returns light color for the theme component, even if a dark color scheme has been selected. Here’s a short example: if I put

$d-color: dark-light-choose(#fff, #000);

:root {
  --d-color: #{$d-color};
}

in color definitions and

.d-header {
  background: var(--d-color);
}

in common, I will always end up with a white header regardless of the color scheme in use. Any ideas why this is not working?

1 Like
2

Any advice here @awesomerobot ?

1 Like
3

hmm yes, I just tried and ran into the same problem… it looks like the component is only seeing the default color scheme even if the parent theme is switched to a different scheme. I haven’t used the color definitions stylesheet in a component yet… @pmusaraj did that ever work, or did something regress?

2 Likes
4

This looks like a regression, I will take a look.

2 Likes
5

Indeed, it was a regression, thanks for the report @Lumi. It should be fixed now via https://github.com/discourse/discourse/commit/5604ce70d4b53a86c53d6109b4e5c896e1edb7d8

2 Likes
6

This topic was automatically closed after 6 days. New replies are no longer allowed.