topic Re: application.css gets ignored in 6.0 in Dashboards & Visualizations

application.css gets ignored in 6.0

FRoth — Fri, 04 Oct 2013 10:44:44 GMT

I created a new app based on the sample_app and changed the application.css according to the examples from default.css as described here.

I restarted splunk several times and checked the applied styles with the "Inspect Element" function of Google Chrome. None of the styles I configured in application.css gets applied to my app.

E.g. I tried to change the style of the "section-title" - set it to "font-size: 40px;" and even that didn't get applied.

/* from application.css in /etc/apps/<appname>/appserver/static/ */
.section-title {
   font-size: 40px;
 }

Has anybody an idea why my changes to the application.css are completely ignored?

Re: application.css gets ignored in 6.0

Ayn — Fri, 04 Oct 2013 11:08:48 GMT

It's probably overridden. Did you try adding !important after your customization? i.e.

.section-title {
   font-size: 40px; !important
}

Re: application.css gets ignored in 6.0

FRoth — Fri, 04 Oct 2013 15:42:35 GMT

No - no change. And I applied the important in the correct way before the ";".

Re: application.css gets ignored in 6.0

LukeMurphey — Fri, 04 Oct 2013 16:44:27 GMT

Does Chrome show your .section-title CSS stanza? It should show it though the font-size attribute will be crossed out.

Re: application.css gets ignored in 6.0

melting — Fri, 04 Oct 2013 16:58:20 GMT

All of the pages in Splunk no longer load application.css or application.js in 6.0

To help clarify, here is a list:

pages (search, pivot, dashboard listings page, report listings page, alerts listing page) - no application.css/js
dashboards + forms (simple xml) - Load dashboard.css/js
views (advanced XML) - still load application.css/js

Re: application.css gets ignored in 6.0

LukeMurphey — Fri, 04 Oct 2013 17:01:09 GMT

It had not even occurred to me that this was on 6.0.

Re: application.css gets ignored in 6.0

FRoth — Fri, 04 Oct 2013 18:55:17 GMT

Oh - thanks. Yes - I upgraded to 6.0 before I started app development. Well, now I know why it does not work, but is there a way to edit the colors of the search bar in any other way. My app is meant to analyse logs from a product that has blue as its main color. I changed the color of the nav bar to blue. The color of the search bar is still green. This doesn't look very appealing. Is there another app specific .css that I can modify to change the green color in pages?

Re: application.css gets ignored in 6.0

melting — Fri, 04 Oct 2013 18:58:16 GMT

@FRoth currently there is no way to customize those pages outside of the header color and logo.

Re: application.css gets ignored in 6.0

FRoth — Sat, 05 Oct 2013 07:58:15 GMT

Ok, thanks for clearing things up.

Re: application.css gets ignored in 6.0

yannK — Thu, 10 Oct 2013 22:09:04 GMT

See the new documentation :

http://docs.splunk.com/Documentation/Splunk/latest/AdvancedDev/Migration#JavaScript_and_CSS_support_changes

And as a workaround you can specify the css file in simple XML dashboard manually.
example :
<dashboard script="application.js" stylesheet="application.css">

Re: application.css gets ignored in 6.0

yannK — Thu, 10 Oct 2013 23:35:48 GMT

For advanced xml, you can call application.css (and I believe application.js) in the view element in advanced XML:

<view autoCancelInterval="90" isVisible="true" onunloadCancelJobs="true" template="dashboard.html" stylesheet="application.css">