How to stylize the colors of buttons in spModal?

zynsn — Tue, 14 Feb 2023 00:08:08 GMT

Hi community,

How do I stylize the colors of the buttons on a spModal dialog box? I tried using class: and style:, class doesn't work and style: doesn't seem to apply the colors even though it is specified in the CSS page.

$scope.onActionClick = function(state) { if (state === c.data.CONST.REJECT_STATE) { if (c.data.requireRejectionComment && !c.data.useCommentBox) { // Create an input popup spModal.open({ title: c.data.CONST.i18n.REJECT_MODAL_TITLE, message: c.data.CONST.i18n.REJECT_MODAL_MESSAGE, input: true, buttons: [ {label: c.data.CONST.i18n.REJECT_MODAL_CANCEL, cancel: true}, {label: c.data.CONST.i18n.REJECT_MODAL_SUBMIT, primary: true, style: "reject-button" } //tried adding this to the CSS page and tried using class:, it does not work

.reject-button { background-color: red; color: white; }

Re: How to stylize the colors of buttons in spModal?

Community Alums — Tue, 14 Feb 2023 10:17:33 GMT

Hello @zynsn ,

If you are using the above code then u have to use class instead of style. And add class on button not in label.

Else u can add CSS like this:-

div > button >.btn{

  /* your css ... */

}

Please refer this link also:

https://www.servicenow.com/community/developer-forum/how-to-style-spmodal-buttons/m-p/1784636

Please mark my answer as accepted solution and helpful, if it works for you.

Thank you!

question How to stylize the colors of buttons in spModal? in Developer forum

How to stylize the colors of buttons in spModal?

Re: How to stylize the colors of buttons in spModal?