Multiple CSS class in visualisation builder markdown


I wanted to setup visualisation with multiple metric each with other color and if possible do some logic on them, like if metric < 0, use different CSS class.

So far I was able to do it using something like that

h5:nth-of-type(1) {
    background-color: blue; 
    display: table-cell;
    padding: 0.5em 0.5em ;
    text-align: left;
    color: black

this allows me to format each heading differently but if I would need to move them then this will fall apart.

I wanted to use something like this

.sev_low { background-color: red }

and access that in markdown later.

With conditionlas I was wondering if there's an option to check for example if metric is below 10 if so use different CSS class.
With handlebars I was only able to do

{{#if metric}}

{{gt}} or {{compare}} helpers do not work for me.

Is it possible to do what I am trying to using what's in Kibana now?

Best Regards,


Wouldn't the Color option in the field formatting in Kibana solve your problem without having to resort to changing CSS?
You can find it in the "Management - Index patterns" page. Next to each field there's an edit button and there you have the Format option.

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.