Dashboards & Visualizations

How to fix the dashboard title styling

Tika
Explorer

Hello all, I have a simple dashboard with a dropdown under the title. When I add styles into the title, the dropdown input element interferes with that and the full hight of the title panel is not visible. 

Tika_0-1646172738371.png

This is my current inline style content. I want to display the full hight of my title panel. Can anyone help?

 

 

<label>Endpoint Configurations Summary Dashboard</label>
<row depends="$alwaysHideCSSPanel$">
<panel>
<html>
<style>
.dashboard-panel h2{
background:#6495ED !important;
color:white !important;
text-align: center !important;
font-weight: bold !important;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}
.highcharts-background {
fill: #ffffff !important;
}
.highcharts-grid-line{
fill: #ffffff !important;
}
h1 {
background:#6495ED !important;
color:white !important;
text-align: center !important;
font-weight: bold !important;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}
h2, h3, p {
color: #696969 !important;
text-align: center !important;

}

</style>
</html>
</panel>
</row>

 

 

 

Labels (1)
0 Karma
1 Solution

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Tika 

Did you tried by adding css on h1 header?

.dashboard-header-title {
    height: 100px !important;
  }

 May be this will solve your issue.

 

Screenshot 2022-03-02 at 9.35.57 AM.png

 

Thanks

KV

View solution in original post

Tika
Explorer

Thanks taht worked!

0 Karma

kamlesh_vaghela
SplunkTrust
SplunkTrust

@Tika 

Did you tried by adding css on h1 header?

.dashboard-header-title {
    height: 100px !important;
  }

 May be this will solve your issue.

 

Screenshot 2022-03-02 at 9.35.57 AM.png

 

Thanks

KV

Get Updates on the Splunk Community!

Everything Community at .conf24!

You may have seen mention of the .conf Community Zone 'round these parts and found yourself wondering what ...

Index This | I’m short for "configuration file.” What am I?

May 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with a Special ...

New Articles from Academic Learning Partners, Help Expand Lantern’s Use Case Library, ...

Splunk Lantern is a Splunk customer success center that provides advice from Splunk experts on valuable data ...