Dashboards & Visualizations

where to make changes to change background color of navigation menu options dropdown.

disha
Contributor

Trying to ask very internal thing but this is te requirement of my app. I want to change the background color of navigation menu options dropdown which is white by default.
I am not able to find out which css or js file I need to approch for doing that.
Any help?

Tags (1)
0 Karma
1 Solution

sideview
SplunkTrust
SplunkTrust

Well, technically there isn't any CSS that sets the background color, because the background color is white.

That said, this CSS technically changes the background color to an off-white.

.splMenu-primary, 
.splMenu-primary a {
    background-color:#eee;
    color:#000;
} 

But you're only at the beginning, because once the background color isn't white there are some other problematic CSS rules that you then have to fight, like :

-- You'll have to tinker with .splShadow because the above CSS will produce some less-than-ideal off-white dropshadows.

-- the ul elements in the menus have some default margin that will now show up as white gaps. And you'll have to deal with that.

And very probably several other side quests that I haven't thought of.

One idea is to simply look through the Splunkbase apps, try and find one that changes the look and feel, download them, take a look at their CSS in Firebug and get some ideas there.

View solution in original post

sideview
SplunkTrust
SplunkTrust

Well, technically there isn't any CSS that sets the background color, because the background color is white.

That said, this CSS technically changes the background color to an off-white.

.splMenu-primary, 
.splMenu-primary a {
    background-color:#eee;
    color:#000;
} 

But you're only at the beginning, because once the background color isn't white there are some other problematic CSS rules that you then have to fight, like :

-- You'll have to tinker with .splShadow because the above CSS will produce some less-than-ideal off-white dropshadows.

-- the ul elements in the menus have some default margin that will now show up as white gaps. And you'll have to deal with that.

And very probably several other side quests that I haven't thought of.

One idea is to simply look through the Splunkbase apps, try and find one that changes the look and feel, download them, take a look at their CSS in Firebug and get some ideas there.

disha
Contributor

Thanks for guiding me one the right path. I have downloaded some apps and looked the css. Its working now.
Thankyou so much.

0 Karma
Get Updates on the Splunk Community!

Stay Connected: Your Guide to May Tech Talks, Office Hours, and Webinars!

Take a look below to explore our upcoming Community Office Hours, Tech Talks, and Webinars this month. This ...

They're back! Join the SplunkTrust and MVP at .conf24

With our highly anticipated annual conference, .conf, comes the fez-wearers you can trust! The SplunkTrust, as ...

Enterprise Security Content Update (ESCU) | New Releases

Last month, the Splunk Threat Research Team had two releases of new security content via the Enterprise ...