Dashboards & Visualizations

CSS reference

Contributor

There seem to be an awful lot of CSS elements which you can customise in Splunk, but I don't see any reference document which lists them. Does this exist? I've looked in both docs and dev, but apart from telling everyone 'you should use CSS' it's pretty light on detail.

0 Karma

Splunk Employee
Splunk Employee

There are no official docs on this, by design. That's because we consider the Splunk CSS classes a non-public API, which means that the class names and other things are subject to change at any time, without notice (and they do). If you use them, please keep that in mind.

The best way to avoid depending on these is to use standard CSS with HTML-style dashboards.

Legend

Please download Splunk 6.x Dashboard examples which has examples of using CSS to enhance your dashboards. There are several examples on Javascript and CSS extensions to Simple XML dashboards. The Custom Layout Example: Dark deals explicitly with CSS styling of dashboard.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

Contributor

Seen this of course, and it's nice as far as it goes. Also had a look at what gets shipped with the search app: how complete is this? This topic is barely even touched in the current docs.

As far as I can tell, there is no reference resource for the hundreds and hundreds of other css attributes used by splunk. People who do this a lot more than I do, seem to be spending lots of time messing around with an inspector of some kind, tracking through the attribute hierarchies, which may or may not be particularly human readable. Then there's the tedious procedure of edit, bump and reload to see if the knob you've twiddled is actually the right one, and what interesting side effects might happened.
Seriously, is this the state of the art? Anyone recommend a good CSS tool that can take some of the pain out of this, and does not require you to be such an expert that you don't need it? Not built-in browser object inspectors...

0 Karma

Legend

CSS Extension and JS Extension allows Splunk developers to extend and use their own CSS and JavaScript to extend Splunk to do whatever developer imagines.

Some more examples are present on dev.splunk.com(http://dev.splunk.com/view/webframework-codeexamples/SP-CAAAEU7 )

However, I find that Simple XML Examples App is better organised and it gets you started with some examples in each area.

Let me change this answer to comment so that Splunk Community can point you to any App which can allow Splunk developers to use CSS more dynamically. Otherwise it would mean that there is scope of development of such app.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma
State of Splunk Careers

Access the Splunk Careers Report to see real data that shows how Splunk mastery increases your value and job satisfaction.

Find out what your skills are worth!