Hi,
So the method I'll cover here is actually most preferred as it doesn't require cloning the SC Order Guide widget.
You'd want to search in back-end UI for: Service Portal > Widget Instances, then search for the widget: SC Order Guide and ensure you click the one (as my OOB instance had 3) that is for your Service Portal package (see screenshot below for example):
Once the form loads, you'll see a blank CSS section, you can simply use this code to override the OOB widget CSS:
.accordion-header {
.panel-heading {
padding: 0;
.row {
padding: 15px;
margin: 0;
}
.align-text {
top: 3px;
}
&:hover {
background-color: transparent;
}
label {
font-size: inherit;
}
}
&.panel-open {
.panel-heading {
border-bottom: 1px solid #dee5e7;
&:hover {
background-color: transparent;
}
}
}
.panel-title {
font-size: inherit;
}
}So simply paste that in there and save. Then...when you go back to your order guide to check it out, it'll look like this:
Instead of:
So the line that really controls all this is:
&:hover {
background-color: transparent;
}So if you don't like transparent, which is what I went with as it's not as "loud" as that green, you can change that to various other colors, etc. Personally, the transparent is at least a very light touch of color to just interact with the mouse cursor.
Please mark reply as Helpful & Correct. Thanks!
