I cannot get color definitions in theme components to load. They simply never arrive in the browser.
I tried to migrate to color definitions because my themes broke with the recent 2.7.0.beta4 upgrade.
I have the following color definitions in multiple theme components (hence multiple code blocks):
:root {
--my-post-name-color: #{dark-light-diff(#1e79a7, $secondary, 0%, 25%)};
}
$my-background: #ABDAFB;
$my-border: #38abe3;
:root {
--my-quote-background: #{dark-light-choose($my-background, $primary-low)};
--my-quote-border: #{dark-light-choose($my-border, blend-primary-secondary(5%))};
}
When I try to use the colors I define, the browser only reports that they are unknown and everything is broken.
One usage is like this:
aside.quote .title {
background-color: var(--my-quote-background);
border-left: 5px solid var(--my-quote-border);
}
aside.quote blockquote {
background-color: var(--my-quote-background);
border-left: 5px solid var(--my-quote-border);
}
What am I doing wrong?
The only non-default colors I can see are from the BBCode plugin.