Can I override theme CSS variables?

[ttorre1904]

I'm looking to override CSS variables such as --theme-primary-color

Is this possible using Demo Monkey? And if so, what would be the corresponding syntax?

[svrnm]

Hey @ttorre1904, thanks for your question!

There are a few capabilities in DemoMonkey that might be able to help with that:

• You could bring back <style> to the allowList via https://github.com/svrnm/DemoMonkey/blob/main/USAGE.md#block--and-allowlist-tags, this of course only works if --theme-primary-color is in a <style> tag and not in an external sourced file
• There are a few commands that allow you to inject arbitrary HTML:
  • overwrite html is a fairly powerful command, that allows you to target an HTML element an overwrite it. You can use it creatively and replace something like <title> with a combination of <title> and a new style (or something, just guessing)
  • Insert before and after a DOM element, is here to add content before or after a DOM element you can use !insertBefore and !insertAfter. It's a little bit unnatural to use, so play around with it.

Final Note, there is a addScript command, it is probably possible to add a addStyle command in a similar manner, I just have not explored that capability. PRs are welcome.