cancel
Showing results for 
Search instead for 
Did you mean: 

Change widget header background color

ElementUX
8 - Cloud Apps
8 - Cloud Apps

Trying to change the widget title background color.  I am using custom css code for card look. 

The following widget code allows me to change border radius/color.  Trying to use similar "widget-header'  to no avail.  Any ideas?  Thx!

$('.widget')
    .css('border-radius','10px')
    .css('border', '#c8c8c8 solid 1px');

$('.widget-header')
    .css('background-color','#f2f2f2');

ElementUX_1-1651694032138.png

 

1 ACCEPTED SOLUTION

harikm007
13 - Data Warehouse
13 - Data Warehouse

@ElementUX ,

Remove the period (.) from '.widget-header'

$('widget-header')
.css('background-color','#f2f2f2');

-Hari

View solution in original post

4 REPLIES 4

harikm007
13 - Data Warehouse
13 - Data Warehouse

@ElementUX ,

Remove the period (.) from '.widget-header'

$('widget-header')
.css('background-color','#f2f2f2');

-Hari

That did it!  Thank you! 

ElementUX_0-1651750428708.png

 

mdoria
8 - Cloud Apps
8 - Cloud Apps

Hi, do you know how can you do this by widget? I want different widgets to have different style on their headers.

Hi @mdoria ,

In case you are looking for a robust solution without any code involved I highly recommend you to check out Paldi's Dashboard Styler

This plugin is one of our earliest and most popular plugins which gives you the ability to design your widgets and style your dashboard with an interactive interface.

 

Feel free to reach out if you have any further questions as we're always happy to help (: 
Paldi Solutions - Number #1 Sisense Plugins Developer