topic Re: How to add a CSS class to a row in a dashboard using Simple XML? in Dashboards & Visualizations

How to add a CSS class to a row in a dashboard using Simple XML?

sam_jacob — Fri, 21 Aug 2015 19:21:31 GMT

I want to be able to style specific rows by styling them through stylesheets. Is it possible to add a CSS class to a row with Simple XML dashboards?

Re: How to add a CSS class to a row in a dashboard using Simple XML?

jensonthottian — Fri, 21 Aug 2015 20:01:37 GMT

To add a different CSS class to each rows then you need to convert the xml to html and in html then you can add a different css reference for each row.

....
tr class="d0"

......

tr.d0 td {
background-color: #CC9999;
color: black;
}
tr.d1 td {
background-color: #9999CC;
color: black;
}

Re: How to add a CSS class to a row in a dashboard using Simple XML?

sam_jacob — Fri, 21 Aug 2015 20:12:09 GMT

So then I'm guessing that there's no way of doing it without converting it to HTML?

Re: How to add a CSS class to a row in a dashboard using Simple XML?

somesoni2 — Fri, 21 Aug 2015 20:14:33 GMT

By rows , it's table row OR row within the dashboard?

Re: How to add a CSS class to a row in a dashboard using Simple XML?

jensonthottian — Fri, 21 Aug 2015 20:20:57 GMT

I have'nt see any - for a row in a dashboard.

Re: How to add a CSS class to a row in a dashboard using Simple XML?

sam_jacob — Fri, 21 Aug 2015 20:22:51 GMT

Row within the dashboard.

Re: How to add a CSS class to a row in a dashboard using Simple XML?

somesoni2 — Fri, 21 Aug 2015 20:29:56 GMT

What kind of customization you're looking for?? Have seen examples from "Splunk 6.x Dashboard example' app?

Re: How to add a CSS class to a row in a dashboard using Simple XML?

sam_jacob — Fri, 21 Aug 2015 20:36:43 GMT

Honestly, I just want to add a margin-top to space out different sections in the view. I currently have a view with multiple dashboards, which are split into 5 different sections. I currently have an <h1> separating each section, and I was thinking of putting a margin-top on each heading.

I've seen and used the dashboard example app as a reference, is there something specific I should look at?

Re: How to add a CSS class to a row in a dashboard using Simple XML?

somesoni2 — Fri, 21 Aug 2015 20:46:04 GMT

In dashboard example, you can see "Layout Elements" (using .css file).

If the only thing your need is to space out different sections/panels, you can use HTML module of simple xml to add extra space (using br tags of html).

Re: How to add a CSS class to a row in a dashboard using Simple XML?

bmacias84 — Fri, 21 Aug 2015 23:17:16 GMT

You can add any arbitrary css to any simple XML by using the html tags in side of any row. I use this sometimes when I am lazy.

<row>
<html>
<style type="text/css">

h1 {
   font-size:20px;
   line-height:20px;
   margin:2px;
}

h3 {
   font-size:16px;
   line-height: 16px;
   margin:2px;
}

</style>
<div></div>
</html>
</row>

Hope this helps.