panel background color changing

[jip31]

Hello

I want to color a panel background but before I need to clarify some points
First, I know I have to update my CSS file
But I dont understand how to link my CSS code with my panel
For exeample, if I put the code below in my CSS

file

#panel5 h2.panel-title{
. background-color: #FFD501;
}

What I exactly have to add in my XML file? / instead panel or something else?

    <panel>
      <title>System Event Log - Disk - Pie chart</title>
      <chart>
        <title>Critical Events - ID 51 &amp; ID 11</title>
        <search>
          <query>| loadjob savedsearch="admin:FO_DiskHealth_Monitoring:FO_DiskHealth_EV_Pie"</query>
          <earliest>-30d@d</earliest>
          <latest>now</latest>
        </search>
        <option name="charting.axisTitleX.visibility">visible</option>
        <option name="charting.axisTitleY.visibility">visible</option>
        <option name="charting.axisTitleY2.visibility">visible</option>
        <option name="charting.chart">pie</option>
        <option name="charting.chart.showLabels">1</option>
        <option name="charting.chart.sliceCollapsingThreshold">0.01</option>
        <option name="charting.drilldown">none</option>
        <option name="charting.legend.placement">right</option>
        <option name="refresh.display">progressbar</option>
        <option name="trellis.enabled">0</option>
      </chart>
    </panel>

Thanks
Regards

[493669 · Accepted solution]

To see css file in action, edit your xml directly, Change the first line from

<dashboard>
   <label>Title of the Dashboard</label>

to

 <dashboard  stylesheet="my_style.css">
   <label>Title of the Dashboard</label>

and if it is form then change to

 <form  stylesheet="my_style.css">
   <label>Title of the Dashboard</label>

Now place a file called my_style.css in the appserver/static folder of the app this dashboard is in (you'll have to create the folders if they're not there already; if the dashboard is in the search app, that means %SPLUNK_HOME%/etc/apps/search/appserver/static/my_style.css)
Restart your splunk instance (to pick up the new file) and check your dashboard to see that the title of the dashboard is now styled according to your css.
also if you add id to your panel for ex.panel id="abc" then css will be-

#abc .dashboard-panel  {
     background: #eee !important; 
 }

[jip31]

i done exactly the same but it doesnt works

[jip31]

nobody can explain me why it doesnt work please??

[493669]

@jip31 ,
If you have given your panel id as "abc" then try in css-

div#abc {
    background-color: #FFD501 !important;
}

after saving this css to take effect bump the server using -http://localhost:8000/en-GB/_bump click bump button

[jip31]

Hello all
I m going to test it and I keep you aware
Rgds

[harishalipaka]

hi @jip31

https://answers.splunk.com/answers/589078/can-i-add-javascript-and-css-to-an-xml-dashboard.html