Customize highlighter

Question

I am unable to customize the style of the default highlighter. I've tried using code from documentation like this:

this.paper.on('element:pointerdown', function(elementView) {
  elementView.highlight({
    name: 'stroke',
    options: {
      padding: 10,
      rx: 5,
      ry: 5,
      attrs: {
        'stroke-width': 13,
        stroke: '#FF0000'
      }
    }
  });
});

but it dosesn't make any changes to the default yellow 3px highlighter.

Answer 1

I've solved my problem by simply overriding css class;

.joint-highlight-stroke.joint-theme-default {
    stroke: #0157B9 !important;
    stroke-width: 3px !important;
}