Timeline chart: Wrong point-to-labelbox path color in styled mode

[scebotari66]

Expected behaviour

In the demo example for timeline chart, the axis point matches the color of the path going to the label box. I would expect the same in styled mode.

Actual behaviour

In styled mode the path color differs from the point color (it inherits from .highcharts-color-0). While there are color classes for the paths (e.g. highcharts-data-label-color-1), there are no style rules for these. The same issue is with bullet colors in the label box.

Live demo with steps to reproduce

https://jsfiddle.net/scebotari66/1btx2wd3/

Product version

Highcharts JS v10.2.0 (2022-07-05)

Affected browser(s)

All

[scebotari66]

For anyone having the same problem, I ended up generating the color rules for the highcharts-data-label-color- classes myself. Similarly to how highcharts-color- rules are generated in the default provided SCSS file.

@import '~highcharts/css/highcharts.scss';

// Fix path colors not matching point colors
@for $i from 1 through length($colors) {
  $color: nth($colors, $i);
  .highcharts-data-label-color-#{$i - 1} {
    fill: $color;
    stroke: $color;
  }
}

[pawellysy]

Hi @scebotari66, thanks for reporting this issue, and sorry for the lengthy response.
Your workaround works, but this is a bug in the core, and we will try to fix it so that you don't need to generate the classes yourself. Thanks!