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?
All of the pages in Splunk no longer load application.css or application.js in 6.0
To help clarify, here is a list:
All of the pages in Splunk no longer load application.css or application.js in 6.0
To help clarify, here is a list:
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">
See the new documentation :
And as a workaround you can specify the css file in simple XML dashboard manually.
example :
<dashboard script="application.js" stylesheet="application.css">
Ok, thanks for clearing things up.
@FRoth currently there is no way to customize those pages outside of the header color and logo.
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?
It had not even occurred to me that this was on 6.0.
Does Chrome show your .section-title CSS stanza? It should show it though the font-size attribute will be crossed out.
It's probably overridden. Did you try adding !important after your customization? i.e.
.section-title {
font-size: 40px; !important
}
No - no change. And I applied the important in the correct way before the ";".