- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā04-20-2020 12:20 AM
Hi Team,
actually my requirement is i want to change the background of widget .
i tried with the following script in CSS
.panel-heading {
color: #fff;
background-color: #0060FF;
border-color: #0060FF;
}
but the issue it only changing the heading part , i want to change the full background.
In the above screenshot i want to change the approve button background color also , can anyone help on this.
Regards,
Chinna
Solved! Go to Solution.
- Labels:
-
Service Catalog

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā04-20-2020 12:42 AM
CTRL + Right Click >> "Instance In Page Editor" >> use below css in css field to change the background color.
.padder-b-none {
color: #fff;
background-color: #0060FF;
border-color: #0060FF;
}
.btn-block {
background-color: bisque;
}
.btn[name="approve"] {
background-color: red;
}
result:
If my answer helped you, kindly mark it as correct and helpful.

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā04-20-2020 12:26 AM
Hi Chinna,
have look at this script::
<div class="bg-primary custom-button">
<i class="fa fa-bomb"></i>
<h1>IT</h1>
</div>
Hope this will help you!!
If my response helps you then kindly mark my answer helpful šand correct āotherwise if any query š¤ feel free to ask further.
Thanks,
Ajim

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā04-20-2020 12:27 AM
I used the "bg-primary" class, as this will automatically apply a background color, but you could use the "custom-button" class to apply any custom CSS.

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā04-20-2020 12:42 AM
CTRL + Right Click >> "Instance In Page Editor" >> use below css in css field to change the background color.
.padder-b-none {
color: #fff;
background-color: #0060FF;
border-color: #0060FF;
}
.btn-block {
background-color: bisque;
}
.btn[name="approve"] {
background-color: red;
}
result:
If my answer helped you, kindly mark it as correct and helpful.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
ā05-01-2020 11:01 AM
You can also update the Style Sheet "sp-theme-la-jolla.css" (in the Table sp_css) instead of overriding single pages :
for example, I replaced $btn-success-bg, $btn-success-color and $btn-success-border by $btn-primary-bg, $btn-primary-color and $btn-primary-border.
These value are defined in the Portal Theme 'LaJolla' (table sp_theme)