# Choosing between dark and light colors in a theme component

**URL:** https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241
**Category:** Support
**Created:** [February 18, 2021, 6:55pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241 "2021-02-18T18:55:57Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![Lumi](https://avatars.discourse-cdn.com/v4/letter/l/b38774/32.png) [@Lumi](https://meta.discourse.org/u/Lumi)
#### Post date: [February 18, 2021, 6:55pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/1 "2021-02-18T18:55:57Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [February 18, 2021, 8:50pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/2 "2021-02-18T20:50:28Z")

</div>

Any advice here @awesomerobot ?

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [February 18, 2021, 10:31pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/3 "2021-02-18T22:31:07Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [February 18, 2021, 10:39pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/4 "2021-02-18T22:39:26Z")

</div>

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

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [February 19, 2021, 5:01pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/5 "2021-02-19T17:01:48Z")

</div>

Indeed, it was a regression, thanks for the report @Lumi. It should be fixed now via [DEV: More refactoring of SCSS importers (#12143) · discourse/discourse@5604ce7 · GitHub](https://github.com/discourse/discourse/commit/5604ce70d4b53a86c53d6109b4e5c896e1edb7d8)

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [February 27, 2021, 4:00pm UTC](https://meta.discourse.org/t/choosing-between-dark-and-light-colors-in-a-theme-component/180241/6 "2021-02-27T16:00:51Z")

</div>

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