Highcharts dark mode support and styledMode

This is very cool and thanks for this write-up and patch! When I use your MR, I am getting a black, infinite-scrolling box where the chart should be (see uploaded screenshare video). Did you experience this? Do you have any other configurations in your site?

If I disable styled mode, then I actually get a nice, dark-mode chart.

Hey, thanks for checking it.

styledMode needs the CSS file added, otherwise it will show that black box.

For example. this CSS: https://code.highcharts.com/css/highcharts.css and possibly adding https://code.highcharts.com/dashboards/css/dashboards.css

I have that CSS file added by my theme, but maybe we could add a library to include by the default highcharts.css if styledMode is enabled. It could then be overridden if needed in the theme etc..

In your other example, with styledMode off, the dark mode doesn't look so good because the fonts etc.. are black on black and other issues which the highcharts dark mode support solves when enabled.

Let me check if I can add that default CSS as a library when styledMode is enabled.

Thanks for clarifying. I think we need the option to bring in the library or some sort of validation that prevents users from doing something they're not going to like. What about like one of these, except it says, "Enabled styledMode" (with a link to more info)?

You're welcome. How about this approach of just adding the default highcharts css library, if styledMode is enabled?

The user can then override the default CSS in their theme etc..

This is similar to what is mentioned in the highcharts docs here https://api.highcharts.com/highcharts/chart.styledMode

The default style sheet is available from https://code.highcharts.com/css/highcharts.css.

If we just add the CSS with the styledMode option, it will prevent any issues with the default css missing when styledMode is enabled.

That's fine, was just trying to have a single place where all the optional libraries are toggled on and off. I'll take a look at the updated MR tomorrow my time.

Thanks again, I've added some updates to the MR to:

1. Add the default highcharts.css library if styledMode is enabled
2. Add an option to disable adding the default CSS library (if styledMode is enabled)

This means the default CSS will be now added by default while also providing the option to disable adding the default CSS, if needed.

A small nitpick.

Sorry, this one needs one more minor update, one moment.

Automatically closed - issue fixed for 2 weeks with no activity.